/** * @name pc * @namespace * @description Root namespace for the PlayCanvas Engine. */ declare namespace pc { /** * @constant * @type {number} * @name pc.INTERPOLATION_STEP * @description A stepped interpolation scheme. */ const INTERPOLATION_STEP: number; /** * @constant * @type {number} * @name pc.INTERPOLATION_LINEAR * @description A linear interpolation scheme. */ const INTERPOLATION_LINEAR: number; /** * @constant * @type {number} * @name pc.INTERPOLATION_CUBIC * @description A cubic spline interpolation scheme. */ const INTERPOLATION_CUBIC: number; /** * @class * @name pc.AnimData * @classdesc Wraps a set of data used in animation. * @description Create a new animation data container. * @param {number} dimension - Specifies the number of components which make up an element * of data. For example, specify 3 for a set of 3-dimensional vectors. The number of elements * in data must be a multiple of dimension. * @param {Float32Array|number[]} data - The set of data */ class AnimData { constructor(dimension: number, data: Float32Array | number[]); } /** * @class * @name pc.AnimCache * @classdesc Internal cache data for the evaluation of a single curve timeline. * @description Create a new animation cache. */ class AnimCache { } /** * @class * @name pc.AnimCurve * @classdesc Animation curve links an input data set to an output data set * and defines the interpolation method to use. * @description Create a new animation curve * @param {number} input - index of the curve which specifies the key data. * @param {number} output - index of the curve which specifies the value data. * @param {number} interpolation - the interpolation method to use. One of the following: * * * {@link pc.INTERPOLATION_STEP} * * {@link pc.INTERPOLATION_LINEAR} * * {@link pc.INTERPOLATION_CUBIC} * */ class AnimCurve { constructor(input: number, output: number, interpolation: number); } /** * @class * @name pc.AnimTarget * @classdesc AnimTarget names a target graph node and specifies the curves which drive translation, rotation and scale. * @description Create a new animation target. * @param {string} name - the target node to control. * @param {number} translation - the curve index controlling the translation of the target node or -1 for none. * @param {number} rotation - the curve index controlling the rotation of the target node or -1 for none. * @param {number} scale - the curve index controlling the scale of the target node or -1 for none. */ class AnimTarget { constructor(name: string, translation: number, rotation: number, scale: number); } /** * @class * @name pc.AnimTrack * @classdesc AnimTrack contains a set of curve data which can be used to animate a set of target nodes. * @description Create a new animation track. * @param {string} name - the track name * @param {number} duration - the duration of the track in seconds. * @param {pc.AnimData[]} inputs - list of curve key data. * @param {pc.AnimData[]} outputs - list of curve value data. * @param {pc.AnimCurve[]} curves - the list of curves. * @param {pc.AnimTarget[]} targets - the list of targets. */ class AnimTrack { constructor(name: string, duration: number, inputs: pc.AnimData[], outputs: pc.AnimData[], curves: pc.AnimCurve[], targets: pc.AnimTarget[]); } /** * @class * @name pc.AnimSnapshot * @classdesc AnimSnapshot stores the state of an animation track at a particular time. * @description Create a new animation snapshot. * @param {pc.AnimTrack} animTrack - the source track. */ class AnimSnapshot { constructor(animTrack: pc.AnimTrack); } /** * @class * @name pc.AnimClip * @classdesc AnimClip wraps the running state of an animation track. It contains and update * the animation 'cursor' and performs looping logic. * @description Create a new animation clip. * @param {pc.AnimTrack} track - the animation data. * @param {number} time - the initial time of the clip. * @param {number} speed - speed of the animation playback. * @param {boolean} playing - true if the clip is playing and false otherwise. * @param {boolean} loop - whether the clip should loop. */ class AnimClip { constructor(track: pc.AnimTrack, time: number, speed: number, playing: boolean, loop: boolean); } /** * @class * @name pc.AnimController * @classdesc AnimContoller stores a set of animation clips and performs blending * between them. It then applies the resulting transforms to the target nodes. * @description Create a new animation controller. * @param {pc.GraphNode} graph - root of the scene graph to control. */ class AnimController { constructor(graph: pc.GraphNode); } /** * @class * @name pc.Node * @classdesc A animation node has a name and contains an array of keyframes. * @description Create a new animation node. */ class Node { } /** * @class * @name pc.Animation * @classdesc An animation is a sequence of keyframe arrays which map to the nodes of a skeletal hierarchy. * It controls how the nodes of the hierarchy are transformed over time. * @property {string} name Human-readable name of the animation. * @property {number} duration Duration of the animation in seconds. */ class Animation { /** * @function * @name pc.Animation#getNode * @description Gets a {@link pc.Node} by name. * @param {string} name - The name of the pc.Node. * @returns {pc.Node} The pc.Node with the specified name. */ getNode(name: string): pc.Node; /** * @readonly * @name pc.Animation#nodes * @type {pc.Node[]} * @description A read-only property to get array of animation nodes. */ readonly nodes: pc.Node[]; /** * @function * @name pc.Animation#addNode * @description Adds a node to the internal nodes array. * @param {pc.Node} node - The node to add. */ addNode(node: pc.Node): void; /** * Human-readable name of the animation. */ name: string; /** * Duration of the animation in seconds. */ duration: number; } /** * @class * @name pc.Skeleton * @classdesc Represents a skeleton used to play animations. * @param {pc.GraphNode} graph - The root pc.GraphNode of the skeleton. * @property {boolean} looping Determines whether skeleton is looping its animation. */ class Skeleton { constructor(graph: pc.GraphNode); /** * @function * @name pc.Skeleton#addTime * @description Progresses The animation assigned to The specified skeleton by The * supplied time delta. If the delta takes the animation passed its end point, if * the skeleton is set to loop, the animation will continue from the beginning. * Otherwise, the animation's current time will remain at its duration (i.e. the * end). * @param {number} delta - The time in seconds to progress the skeleton's animation. */ addTime(delta: number): void; /** * @function * @name pc.Skeleton#blend * @description Blends two skeletons together. * @param {pc.Skeleton} skel1 - Skeleton holding the first pose to be blended. * @param {pc.Skeleton} skel2 - Skeleton holding the second pose to be blended. * @param {number} alpha - The value controlling the interpolation in relation to the two input * skeletons. The value is in the range 0 to 1, 0 generating skel1, 1 generating skel2 and anything * in between generating a spherical interpolation between the two. */ blend(skel1: pc.Skeleton, skel2: pc.Skeleton, alpha: number): void; /** * @name pc.Skeleton#animation * @type {pc.Animation} * @description Animation currently assigned to skeleton. */ animation: pc.Animation; /** * @name pc.Skeleton#currentTime * @type {number} * @description Current time of currently active animation in seconds. * This value is between zero and the duration of the animation. */ currentTime: number; /** * @readonly * @name pc.Skeleton#numNodes * @type {number} * @description Read-only property that returns number of nodes of a skeleton. */ readonly numNodes: number; /** * @function * @name pc.Skeleton#setGraph * @description Links a skeleton to a node hierarchy. The nodes animated skeleton are * then subsequently used to drive the local transformation matrices of the node * hierarchy. * @param {pc.GraphNode} graph - The root node of the graph that the skeleton is to drive. */ setGraph(graph: pc.GraphNode): void; /** * @function * @name pc.Skeleton#updateGraph * @description Synchronizes the currently linked node hierarchy with the current state of the * skeleton. Internally, this function converts the interpolated keyframe at each node in the * skeleton into the local transformation matrix at each corresponding node in the linked node * hierarchy. */ updateGraph(): void; /** * Determines whether skeleton is looping its animation. */ looping: boolean; } /** * @class * @name pc.AssetReference * @description An object that manages the case where an object holds a reference to an asset and needs to be notified when * changes occur in the asset. e.g. notifications include load, add and remove events. * @param {string} propertyName - The name of the property that the asset is stored under, passed into callbacks to enable updating. * @param {pc.Asset|object} parent - The parent object that contains the asset reference, passed into callbacks to enable updating. Currently an asset, but could be component or other. * @param {pc.AssetRegistry} registry - The asset registry that stores all assets. * @param {object} callbacks - A set of functions called when the asset state changes: load, add, remove. * @param {object} [callbacks.load] - The function called when the asset loads load(propertyName, parent, asset). * @param {object} [callbacks.add] - The function called when the asset is added to the registry add(propertyName, parent, asset). * @param {object} [callbacks.remove] - The function called when the asset is remove from the registry remove(propertyName, parent, asset). * @param {object} [scope] - The scope to call the callbacks in * @property {number} id Get or set the asset id which this references. One of either id or url must be set to initialize an asset reference. * @property {string} url Get or set the asset url which this references. One of either id or url must be called to initialize an asset reference. * @example * * var reference = new pc.AssetReference('textureAsset', this, this.app.assets, { * load: this.onTextureAssetLoad, * add: this.onTextureAssetAdd, * remove: this.onTextureAssetRemove * }, this); * reference.id = this.textureAsset.id; */ class AssetReference { constructor(propertyName: string, parent: pc.Asset | any, registry: pc.AssetRegistry, callbacks: { load?: any; add?: any; remove?: any; }, scope?: any); /** * Get or set the asset id which this references. One of either id or url must be set to initialize an asset reference. */ id: number; /** * Get or set the asset url which this references. One of either id or url must be called to initialize an asset reference. */ url: string; } /** * @class * @name pc.AssetRegistry * @augments pc.EventHandler * @classdesc Container for all assets that are available to this application. * @description Create an instance of an AssetRegistry. * Note: PlayCanvas scripts are provided with an AssetRegistry instance as 'app.assets'. * @param {pc.ResourceLoader} loader - The ResourceLoader used to load the asset files. * @property {string} prefix A URL prefix that will be added to all asset loading requests. */ class AssetRegistry extends pc.EventHandler { constructor(loader: pc.ResourceLoader); /** * @function * @name pc.AssetRegistry#list * @description Create a filtered list of assets from the registry. * @param {object} filters - Properties to filter on, currently supports: 'preload: true|false'. * @returns {pc.Asset[]} The filtered list of assets. */ list(filters: any): pc.Asset[]; /** * @function * @name pc.AssetRegistry#add * @description Add an asset to the registry. * @param {pc.Asset} asset - The asset to add. * @example * var asset = new pc.Asset("My Asset", "texture", { * url: "../path/to/image.jpg" * }); * app.assets.add(asset); */ add(asset: pc.Asset): void; /** * @function * @name pc.AssetRegistry#remove * @description Remove an asset from the registry. * @param {pc.Asset} asset - The asset to remove. * @returns {boolean} True if the asset was successfully removed and false otherwise. * @example * var asset = app.assets.get(100); * app.assets.remove(asset); */ remove(asset: pc.Asset): boolean; /** * @function * @name pc.AssetRegistry#get * @description Retrieve an asset from the registry by its id field. * @param {number} id - The id of the asset to get. * @returns {pc.Asset} The asset. * @example * var asset = app.assets.get(100); */ get(id: number): pc.Asset; /** * @function * @name pc.AssetRegistry#getByUrl * @description Retrieve an asset from the registry by it's file's URL field. * @param {string} url - The url of the asset to get. * @returns {pc.Asset} The asset. * @example * var asset = app.assets.getByUrl("../path/to/image.jpg"); */ getByUrl(url: string): pc.Asset; /** * @function * @name pc.AssetRegistry#load * @description Load the asset's file from a remote source. Listen for "load" events on the asset to find out when it is loaded. * @param {pc.Asset} asset - The asset to load. * @example * // load some assets * var assetsToLoad = [ * app.assets.find("My Asset"), * app.assets.find("Another Asset") * ]; * var count = 0; * assetsToLoad.forEach(function (assetToLoad) { * assetToLoad.ready(function (asset) { * count++; * if (count === assetsToLoad.length) { * // done * } * }); * app.assets.load(assetToLoad); * }); */ load(asset: pc.Asset): void; /** * @function * @name pc.AssetRegistry#loadFromUrl * @description Use this to load and create an asset if you don't have assets created. Usually you would only use this * if you are not integrated with the PlayCanvas Editor. * @param {string} url - The url to load. * @param {string} type - The type of asset to load. * @param {pc.callbacks.LoadAsset} callback - Function called when asset is loaded, passed (err, asset), where err is null if no errors were encountered. * @param {string} [filename] - Optional asset filename. * @example * app.assets.loadFromUrl("../path/to/texture.jpg", "texture", function (err, asset) { * var texture = asset.resource; * }); */ loadFromUrl(url: string, type: string, callback: pc.callbacks.LoadAsset, filename?: string): void; /** * @function * @name pc.AssetRegistry#findAll * @description Return all Assets with the specified name and type found in the registry. * @param {string} name - The name of the Assets to find. * @param {string} [type] - The type of the Assets to find. * @returns {pc.Asset[]} A list of all Assets found. * @example * var assets = app.assets.findAll("myTextureAsset", "texture"); * console.log("Found " + assets.length + " assets called " + name); */ findAll(name: string, type?: string): pc.Asset[]; /** * @function * @name pc.AssetRegistry#findByTag * @description Return all Assets that satisfy the search query. * Query can be simply a string, or comma separated strings, * to have inclusive results of assets that match at least one query. * A query that consists of an array of tags can be used to match assets that have each tag of array. * @param {...*} query - Name of a tag or array of tags. * @returns {pc.Asset[]} A list of all Assets matched query. * @example * var assets = app.assets.findByTag("level-1"); * // returns all assets that tagged by `level-1` * @example * var assets = app.assets.findByTag("level-1", "level-2"); * // returns all assets that tagged by `level-1` OR `level-2` * @example * var assets = app.assets.findByTag(["level-1", "monster"]); * // returns all assets that tagged by `level-1` AND `monster` * @example * var assets = app.assets.findByTag(["level-1", "monster"], ["level-2", "monster"]); * // returns all assets that tagged by (`level-1` AND `monster`) OR (`level-2` AND `monster`) */ findByTag(...query: any[]): pc.Asset[]; /** * @function * @name pc.AssetRegistry#filter * @description Return all Assets that satisfy filter callback. * @param {pc.callbacks.FilterAsset} callback - The callback function that is used to filter assets, return `true` to include asset to result list. * @returns {pc.Asset[]} A list of all Assets found. * @example * var assets = app.assets.filter(function (asset) { * return asset.name.indexOf('monster') !== -1; * }); * console.log("Found " + assets.length + " assets, where names contains 'monster'"); */ filter(callback: pc.callbacks.FilterAsset): pc.Asset[]; /** * @function * @name pc.AssetRegistry#find * @description Return the first Asset with the specified name and type found in the registry. * @param {string} name - The name of the Asset to find. * @param {string} [type] - The type of the Asset to find. * @returns {pc.Asset} A single Asset or null if no Asset is found. * @example * var asset = app.assets.find("myTextureAsset", "texture"); */ find(name: string, type?: string): pc.Asset; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * A URL prefix that will be added to all asset loading requests. */ prefix: string; } /** * @class * @name pc.Asset * @augments pc.EventHandler * @classdesc An asset record of a file or data resource that can be loaded by the engine. * The asset contains three important fields: * * * `file`: contains the details of a file (filename, url) which contains the resource data, e.g. an image file for a texture asset. * * `data`: contains a JSON blob which contains either the resource data for the asset (e.g. material data) or additional data for the file (e.g. material mappings for a model). * * `resource`: contains the final resource when it is loaded. (e.g. a {@link pc.StandardMaterial} or a {@link pc.Texture}). * * See the {@link pc.AssetRegistry} for details on loading resources from assets. * @description Create a new Asset record. Generally, Assets are created in the loading process and you won't need to create them by hand. * @param {string} name - A non-unique but human-readable name which can be later used to retrieve the asset. * @param {string} type - Type of asset. One of ["animation", "audio", "binary", "cubemap", "css", "font", "json", "html", "material", "model", "script", "shader", "text", "texture"] * @param {object} [file] - Details about the file the asset is made from. At the least must contain the 'url' field. For assets that don't contain file data use null. * @example * var file = { * filename: "filename.txt", * url: "/example/filename.txt" * }; * @param {object} [data] - JSON object with additional data about the asset (e.g. for texture and model assets) or contains the asset data itself (e.g. in the case of materials) * @example * var asset = new pc.Asset("a texture", "texture", { * url: "http://example.com/my/assets/here/texture.png" * }); * @property {string} name The name of the asset * @property {number} id The asset id * @property {string} type The type of the asset. One of ["animation", "audio", "binary", "cubemap", "css", "font", "json", "html", "material", "model", "script", "shader", "text", "texture"] * @property {pc.Tags} tags Interface for tagging. Allows to find assets by tags using {@link pc.AssetRegistry#findByTag} method. * @property {object} file The file details or null if no file * @property {string} [file.url] The URL of the resource file that contains the asset data * @property {string} [file.filename] The filename of the resource file * @property {number} [file.size] The size of the resource file * @property {string} [file.hash] The MD5 hash of the resource file data and the Asset data field * @property {object} data JSON data that contains either the complete resource data (e.g. in the case of a material) or additional data (e.g. in the case of a model it contains mappings from mesh to material) * @property {object} resource A reference to the resource when the asset is loaded. e.g. a {@link pc.Texture} or a {@link pc.Model} * @property {Array} resources A reference to the resources of the asset when it's loaded. An asset can hold more runtime resources than one e.g. cubemaps * @property {boolean} preload If true the asset will be loaded during the preload phase of application set up. * @property {boolean} loaded True if the resource is loaded. e.g. if asset.resource is not null * @property {boolean} loading True if the resource is currently being loaded * @property {pc.AssetRegistry} registry The asset registry that this Asset belongs to */ class Asset extends pc.EventHandler { constructor(name: string, type: string, file?: any, data?: any); /** * @name pc.Asset#getFileUrl * @function * @description Return the URL required to fetch the file for this asset. * @returns {string} The URL. * @example * var assets = app.assets.find("My Image", "texture"); * var img = "<img src='" + assets[0].getFileUrl() + "'>"; */ getFileUrl(): string; /** * @function * @name pc.Asset#ready * @description Take a callback which is called as soon as the asset is loaded. If the asset is already loaded the callback is called straight away. * @param {pc.callbacks.AssetReady} callback - The function called when the asset is ready. Passed the (asset) arguments. * @param {object} [scope] - Scope object to use when calling the callback. * @example * var asset = app.assets.find("My Asset"); * asset.ready(function (asset) { * // asset loaded * }); * app.assets.load(asset); */ ready(callback: pc.callbacks.AssetReady, scope?: any): void; /** * @function * @name pc.Asset#unload * @description Destroys the associated resource and marks asset as unloaded. * @example * var asset = app.assets.find("My Asset"); * asset.unload(); * // asset.resource is null */ unload(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The name of the asset */ name: string; /** * The asset id */ id: number; /** * The type of the asset. One of ["animation", "audio", "binary", "cubemap", "css", "font", "json", "html", "material", "model", "script", "shader", "text", "texture"] */ type: string; /** * Interface for tagging. Allows to find assets by tags using {@link pc.AssetRegistry#findByTag} method. */ tags: pc.Tags; /** * The file details or null if no file */ file: { url?: string; filename?: string; size?: number; hash?: string; }; /** * JSON data that contains either the complete resource data (e.g. in the case of a material) or additional data (e.g. in the case of a model it contains mappings from mesh to material) */ data: any; /** * A reference to the resource when the asset is loaded. e.g. a {@link pc.Texture} or a {@link pc.Model} */ resource: any; /** * A reference to the resources of the asset when it's loaded. An asset can hold more runtime resources than one e.g. cubemaps */ resources: any[]; /** * If true the asset will be loaded during the preload phase of application set up. */ preload: boolean; /** * True if the resource is loaded. e.g. if asset.resource is not null */ loaded: boolean; /** * True if the resource is currently being loaded */ loading: boolean; /** * The asset registry that this Asset belongs to */ registry: pc.AssetRegistry; } /** * @constant * @type {string} * @name pc.ASSET_ANIMATION * @description Asset type name for animation. */ const ASSET_ANIMATION: string; /** * @constant * @type {string} * @name pc.ASSET_AUDIO * @description Asset type name for audio. */ const ASSET_AUDIO: string; /** * @constant * @type {string} * @name pc.ASSET_IMAGE * @description Asset type name for image. */ const ASSET_IMAGE: string; /** * @constant * @type {string} * @name pc.ASSET_JSON * @description Asset type name for json. */ const ASSET_JSON: string; /** * @constant * @type {string} * @name pc.ASSET_MODEL * @description Asset type name for model. */ const ASSET_MODEL: string; /** * @constant * @type {string} * @name pc.ASSET_MATERIAL * @description Asset type name for material. */ const ASSET_MATERIAL: string; /** * @constant * @type {string} * @name pc.ASSET_TEXT * @description Asset type name for text. */ const ASSET_TEXT: string; /** * @constant * @type {string} * @name pc.ASSET_TEXTURE * @description Asset type name for texture. */ const ASSET_TEXTURE: string; /** * @constant * @type {string} * @name pc.ASSET_CUBEMAP * @description Asset type name for cubemap. */ const ASSET_CUBEMAP: string; /** * @constant * @type {string} * @name pc.ASSET_SHADER * @description Asset type name for shader. */ const ASSET_SHADER: string; /** * @constant * @type {string} * @name pc.ASSET_CSS * @description Asset type name for CSS. */ const ASSET_CSS: string; /** * @constant * @type {string} * @name pc.ASSET_HTML * @description Asset type name for HTML. */ const ASSET_HTML: string; /** * @constant * @type {string} * @name pc.ASSET_SCRIPT * @description Asset type name for script. */ const ASSET_SCRIPT: string; /** * @name pc.callbacks * @namespace * @description Namespace for callback definitions. */ namespace callbacks { /** * @callback pc.callbacks.HandleEvent * @description Callback used by {@link pc.events} functions. Note the callback is limited to 8 arguments. * @param {*} [arg1] - First argument that is passed from caller. * @param {*} [arg2] - Second argument that is passed from caller. * @param {*} [arg3] - Third argument that is passed from caller. * @param {*} [arg4] - Fourth argument that is passed from caller. * @param {*} [arg5] - Fifth argument that is passed from caller. * @param {*} [arg6] - Sixth argument that is passed from caller. * @param {*} [arg7] - Seventh argument that is passed from caller. * @param {*} [arg8] - Eighth argument that is passed from caller. */ type HandleEvent = (arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any) => void; /** * @callback pc.callbacks.LoadAsset * @description Callback used by {@link pc.AssetRegistry#loadFromUrl} and called when an asset is loaded (or an error occurs). * @param {string|null} err - The error message is null if no errors were encountered. * @param {pc.Asset} [asset] - The loaded asset if no errors were encountered. */ type LoadAsset = (err: string | null, asset?: pc.Asset) => void; /** * @callback pc.callbacks.FilterAsset * @description Callback used by {@link pc.AssetRegistry#filter} to filter assets. * @param {pc.Asset} asset - The current asset to filter. * @returns {boolean} Return `true` to include asset to result list. */ type FilterAsset = (asset: pc.Asset) => boolean; /** * @callback pc.callbacks.AssetReady * @description Callback used by {@link pc.Asset#ready} and called when an asset is ready. * @param {pc.Asset} asset - The ready asset. */ type AssetReady = (asset: pc.Asset) => void; /** * @callback pc.callbacks.ConfigureApp * @description Callback used by {@link pc.Application#configure} when configuration file is loaded and parsed (or an error occurs). * @param {string|null} err - The error message in the case where the loading or parsing fails. */ type ConfigureApp = (err: string | null) => void; /** * @callback pc.callbacks.PreloadApp * @description Callback used by {@link pc.Application#preload} when all assets (marked as 'preload') are loaded. */ type PreloadApp = () => void; /** * @callback pc.callbacks.LoadHierarchy * @description Callback used by {@link pc.Application#loadSceneHierarchy}. * @param {string|null} err - The error message in the case where the loading or parsing fails. * @param {pc.Entity} [entity] - The loaded root entity if no errors were encountered. */ type LoadHierarchy = (err: string | null, entity?: pc.Entity) => void; /** * @callback pc.callbacks.LoadSettings * @description Callback used by {@link pc.Application#loadSceneSettings}. * @param {string|null} err - The error message in the case where the loading or parsing fails. */ type LoadSettings = (err: string | null) => void; /** * @callback pc.callbacks.CalculateMatrix * @description Callback used by {@link pc.CameraComponent#calculateTransform} and {@link pc.CameraComponent#calculateProjection}. * @param {pc.Mat4} transformMatrix - Output of the function. * @param {number} view - Type of view. Can be pc.VIEW_CENTER, pc.VIEW_LEFT or pc.VIEW_RIGHT. Left and right are only used in stereo rendering. */ type CalculateMatrix = (transformMatrix: pc.Mat4, view: number) => void; /** * @callback pc.callbacks.CalculateSortDistance * @description Callback used by {@link pc.Layer} to calculate the "sort distance" for a {@link pc.MeshInstance}, which determines its place in the render order. * @param {pc.MeshInstance} meshInstance - The mesh instance. * @param {pc.Vec3} cameraPosition - The position of the camera. * @param {pc.Vec3} cameraForward - The forward vector of the camera. */ type CalculateSortDistance = (meshInstance: pc.MeshInstance, cameraPosition: pc.Vec3, cameraForward: pc.Vec3) => void; /** * @callback pc.callbacks.VrCamera * @description Callback used by {@link pc.CameraComponent#enterVr} and {@link pc.CameraComponent#exitVr}. * @param {string|null} err - On success it is null on failure it is the error message. */ type VrCamera = (err: string | null) => void; /** * @callback pc.callbacks.CreateScreen * @description Callback used by {@link pc.script.createLoadingScreen}. * @param {pc.Application} app - The application. */ type CreateScreen = (app: pc.Application) => void; /** * @callback pc.callbacks.LockMouse * @description Callback used by {@link pc.Mouse#enablePointerLock} and {@link pc.Application#disablePointerLock}. */ type LockMouse = () => void; /** * @callback pc.callbacks.HttpResponse * @description Callback used by {@link pc.Http#get}, {@link pc.Http#post}, {@link pc.Http#put}, {@link pc.Http#del}, and {@link pc.Http#request}. * @param {number|string|Error|null} err - The error code, message, or exception in the case where the request fails. * @param {*} [response] - The response data if no errors were encountered. (format depends on response type: text, Object, ArrayBuffer, XML). */ type HttpResponse = (err: number | string | Error | null, response?: any) => void; /** * @callback pc.callbacks.ResourceHandler * @description Callback used by {@link pc.ResourceHandler#load} when a resource is loaded (or an error occurs). * @param {string|null} err - The error message in the case where the load fails. * @param {*} [response] - The raw data that has been successfully loaded. */ type ResourceHandler = (err: string | null, response?: any) => void; /** * @callback pc.callbacks.ResourceLoader * @description Callback used by {@link pc.ResourceLoader#load} when a resource is loaded (or an error occurs). * @param {string|null} err - The error message in the case where the load fails. * @param {*} [resource] - The resource that has been successfully loaded. */ type ResourceLoader = (err: string | null, resource?: any) => void; /** * @callback pc.callbacks.AddParser * @description Callback used by {@link pc.ModelHandler#addParser} to decide on which parser to use. * @param {string} url - The resource url. * @param {object} data - The raw model data. * @returns {boolean} Return true if this parser should be used to parse the data into a {@link pc.Model}. */ type AddParser = (url: string, data: any) => boolean; /** * @callback pc.callbacks.FindNode * @description Callback used by {@link pc.GraphNode#find} and {@link pc.GraphNode#findOne} to search through a graph node and all of its descendants. * @param {pc.GraphNode} node - The current graph node. * @returns {boolean} Returning `true` will result in that node being returned from {@link pc.GraphNode#find} or {@link pc.GraphNode#findOne}. */ type FindNode = (node: pc.GraphNode) => boolean; /** * @callback pc.callbacks.ForEach * @description Callback used by {@link pc.GraphNode#forEach} to iterate through a graph node and all of its descendants. * @param {pc.GraphNode} node - The current graph node. */ type ForEach = (node: pc.GraphNode) => void; /** * @callback pc.callbacks.UpdateShader * @description Callback used by {@link pc.StandardMaterial#onUpdateShader}. * @param {object} options - An object with shader generator settings (based on current material and scene properties), that you can change and then return. * Properties of the object passed into this function are documented in {@link pc.StandardMaterial#onUpdateShader}. * @returns {object} Returned settings will be used by the shader. */ type UpdateShader = (options: any) => any; /** * @callback pc.callbacks.VrDisplay * @description Callback used by {@link pc.VrDisplay#requestPresent} and {@link pc.VrDisplay#exitPresent}. * @param {string|null} err - The error message if presenting fails, or null if the call succeeds. */ type VrDisplay = (err: string | null) => void; /** * @callback pc.callbacks.VrFrame * @description Callback used by {@link pc.VrDisplay#requestAnimationFrame}. */ type VrFrame = () => void; /** * @callback pc.callbacks.XrError * @description Callback used by {@link pc.XrManager#endXr} and {@link pc.XrManager#startXr}. * @param {Error|null} err - The Error object or null if operation was successfull. */ type XrError = (err: Error | null) => void; } /** * @class * @name pc.Color * @classdesc Representation of an RGBA color. * @description Create a new Color object. * @param {number|number[]} [r] - The value of the red component (0-1). If r is an array of length 3 or 4, the array will be used to populate all components. * @param {number} [g] - The value of the green component (0-1). * @param {number} [b] - The value of the blue component (0-1). * @param {number} [a] - The value of the alpha component (0-1). * @property {number} r The red component of the color. * @property {number} g The green component of the color. * @property {number} b The blue component of the color. * @property {number} a The alpha component of the color. */ class Color { constructor(r?: number | number[], g?: number, b?: number, a?: number); /** * @function * @name pc.Color#clone * @description Returns a clone of the specified color. * @returns {pc.Color} A duplicate color object. */ clone(): pc.Color; /** * @function * @name pc.Color#copy * @description Copies the contents of a source color to a destination color. * @param {pc.Color} rhs - A color to copy to the specified color. * @returns {pc.Color} Self for chaining. * @example * var src = new pc.Color(1, 0, 0, 1); * var dst = new pc.Color(); * * dst.copy(src); * * console.log("The two colors are " + (dst.equals(src) ? "equal" : "different")); */ copy(rhs: pc.Color): pc.Color; /** * @function * @name pc.Color#set * @description Assign values to the color components, including alpha. * @param {number} r - The value for red (0-1). * @param {number} g - The value for blue (0-1). * @param {number} b - The value for green (0-1). * @param {number} [a] - The value for the alpha (0-1), defaults to 1. * @returns {pc.Color} Self for chaining. */ set(r: number, g: number, b: number, a?: number): pc.Color; /** * @function * @name pc.Color#lerp * @description Returns the result of a linear interpolation between two specified colors. * @param {pc.Color} lhs - The color to interpolate from. * @param {pc.Color} rhs - The color to interpolate to. * @param {number} alpha - The value controlling the point of interpolation. Between 0 and 1, the linear interpolant * will occur on a straight line between lhs and rhs. Outside of this range, the linear interpolant will occur on * a ray extrapolated from this line. * @returns {pc.Color} Self for chaining. * @example * var a = new pc.Color(0, 0, 0); * var b = new pc.Color(1, 1, 0.5); * var r = new pc.Color(); * * r.lerp(a, b, 0); // r is equal to a * r.lerp(a, b, 0.5); // r is 0.5, 0.5, 0.25 * r.lerp(a, b, 1); // r is equal to b */ lerp(lhs: pc.Color, rhs: pc.Color, alpha: number): pc.Color; /** * @function * @name pc.Color#fromString * @description Set the values of the color from a string representation '#11223344' or '#112233'. * @param {string} hex - A string representation in the format '#RRGGBBAA' or '#RRGGBB'. Where RR, GG, BB, AA are red, green, blue and alpha values. * This is the same format used in HTML/CSS. * @returns {pc.Color} Self for chaining. */ fromString(hex: string): pc.Color; /** * @function * @name pc.Color#toString * @description Converts the color to string form. The format is '#RRGGBBAA', where * RR, GG, BB, AA are the red, green, blue and alpha values. When the alpha value is not * included (the default), this is the same format as used in HTML/CSS. * @param {boolean} alpha - If true, the output string will include the alpha value. * @returns {string} The color in string form. * @example * var c = new pc.Color(1, 1, 1); * // Should output '#ffffffff' * console.log(c.toString()); */ toString(alpha: boolean): string; /** * The red component of the color. */ r: number; /** * The green component of the color. */ g: number; /** * The blue component of the color. */ b: number; /** * The alpha component of the color. */ a: number; } /** * @class * @name pc.EventHandler * @classdesc Abstract base class that implements functionality for event handling. * @description Create a new event handler. * @example * var obj = new EventHandlerSubclass(); * * // subscribe to an event * obj.on('hello', function (str) { * console.log('event hello is fired', str); * }); * * // fire event * obj.fire('hello', 'world'); */ class EventHandler { /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @name pc.guid * @namespace * @description Basically a very large random number (128-bit) which means the probability of creating two that clash is vanishingly small. * GUIDs are used as the unique identifiers for Entities. */ namespace guid { /** * @function * @name pc.guid.create * @description Create an RFC4122 version 4 compliant GUID. * @returns {string} A new GUID. */ function create(): string; } /** * @namespace pc.path * @description File path API. */ namespace path { /** * @constant * @type {string} * @name pc.path.delimiter * @description The character that separates path segments. */ const delimiter: string; /** * @function * @name pc.path.join * @description Join two or more sections of file path together, inserting a * delimiter if needed. * @param {...string} section - Section of path to join. 2 or more can be * provided as parameters. * @returns {string} The joined file path. * @example * var path = pc.path.join('foo', 'bar'); * console.log(path); // Prints 'foo/bar' * @example * var path = pc.path.join('alpha', 'beta', 'gamma'); * console.log(path); // Prints 'alpha/beta/gamma' */ function join(...section: string[]): string; /** * @function * @name pc.path.normalize * @description Normalize the path by removing '.' and '..' instances. * @param {string} path - The path to normalize. * @returns {string} The normalized path. */ function normalize(path: string): string; /** * @function * @name pc.path.split * @description Split the pathname path into a pair [head, tail] where tail is the final part of the path * after the last delimiter and head is everything leading up to that. tail will never contain a slash. * @param {string} path - The path to split. * @returns {string[]} The split path which is an array of two strings, the path and the filename. */ function split(path: string): string[]; /** * @function * @name pc.path.getBasename * @description Return the basename of the path. That is the second element of the pair returned by * passing path into {@link pc.path.split}. * @param {string} path - The path to process. * @returns {string} The basename. * @example * pc.path.getBasename("/path/to/file.txt"); // returns "path.txt" * pc.path.getBasename("/path/to/dir"); // returns "dir" */ function getBasename(path: string): string; /** * @function * @name pc.path.getDirectory * @description Get the directory name from the path. This is everything up to the final instance of pc.path.delimiter. * @param {string} path - The path to get the directory from. * @returns {string} The directory part of the path. */ function getDirectory(path: string): string; /** * @function * @name pc.path.getExtension * @description Return the extension of the path. Pop the last value of a list after path is split by question mark and comma. * @param {string} path - The path to process. * @returns {string} The extension. * @example * pc.path.getExtension("/path/to/file.txt"); // returns ".txt" * pc.path.getExtension("/path/to/file.jpg"); // returns ".jpg" * pc.path.getExtension("/path/to/file.txt?function=getExtension"); // returns ".txt" */ function getExtension(path: string): string; /** * @function * @name pc.path.isRelativePath * @description Check if a string s is relative path. * @param {string} s - The path to process. * @returns {boolean} True if s doesn't start with slash and doesn't include colon and double slash. * @example * pc.path.isRelativePath("file.txt"); // returns true * pc.path.isRelativePath("path/to/file.txt"); // returns true * pc.path.isRelativePath("./path/to/file.txt"); // returns true * pc.path.isRelativePath("../path/to/file.jpg"); // returns true * pc.path.isRelativePath("/path/to/file.jpg"); // returns false * pc.path.isRelativePath("http://path/to/file.jpg"); // returns false */ function isRelativePath(s: string): boolean; /** * @function * @name pc.path.extractPath * @description Return the path without file name. If path is relative path, start with period. * @param {string} s - The full path to process. * @returns {string} The path without a last element from list split by slash. * @example * pc.path.extractPath("path/to/file.txt"); // returns "./path/to" * pc.path.extractPath("./path/to/file.txt"); // returns "./path/to" * pc.path.extractPath("../path/to/file.txt"); // returns "../path/to" * pc.path.extractPath("/path/to/file.txt"); // returns "/path/to" */ function extractPath(s: string): string; } /** * @namespace * @name pc.platform * @description Global namespace that stores flags regarding platform environment and features support. * @example * if (pc.platform.touch) { * // touch is supported * } */ namespace platform { /** * @static * @readonly * @type {boolean} * @name pc.platform.desktop * @description Is it a desktop or laptop device. */ const desktop: boolean; /** * @static * @readonly * @type {boolean} * @name pc.platform.mobile * @description Is it a mobile or tablet device. */ const mobile: boolean; /** * @static * @readonly * @type {boolean} * @name pc.platform.ios * @description If it is iOS. */ const ios: boolean; /** * @static * @readonly * @type {boolean} * @name pc.platform.android * @description If it is Android. */ const android: boolean; /** * @static * @readonly * @type {boolean} * @name pc.platform.windows * @description If it is Windows. */ const windows: boolean; /** * @static * @readonly * @type {boolean} * @name pc.platform.xbox * @description If it is Xbox. */ const xbox: boolean; /** * @static * @readonly * @type {boolean} * @name pc.platform.gamepads * @description If platform supports gamepads. */ const gamepads: boolean; /** * @static * @readonly * @type {boolean} * @name pc.platform.touch * @description If platform supports touch input. */ const touch: boolean; /** * @static * @readonly * @type {boolean} * @name pc.platform.workers * @description If the platform supports Web Workers. */ const workers: boolean; } /** * @namespace * @name pc.string * @description Extended String API. */ namespace string { /** * @constant * @type {string} * @name pc.string.ASCII_LOWERCASE * @description All lowercase letters. */ const ASCII_LOWERCASE: string; /** * @constant * @type {string} * @name pc.string.ASCII_UPPERCASE * @description All uppercase letters. */ const ASCII_UPPERCASE: string; /** * @constant * @type {string} * @name pc.string.ASCII_LETTERS * @description All ASCII letters. */ const ASCII_LETTERS: string; /** * @function * @name pc.string.format * @description Return a string with {n} replaced with the n-th argument. * @param {string} s - The string to format. * @param {object} [arguments] - All other arguments are substituted into the string. * @returns {string} The formatted string. * @example * var s = pc.string.format("Hello {0}", "world"); * console.log(s); // Prints "Hello world" */ function format(s: string, arguments?: any): string; /** * @function * @name pc.string.toBool * @description Convert a string value to a boolean. In non-strict mode (the default), 'true' is converted to true, all other values * are converted to false. In strict mode, 'true' is converted to true, 'false' is converted to false, all other values will throw * an Exception. * @param {string} s - The string to convert. * @param {boolean} [strict] - In strict mode an Exception is thrown if s is not an accepted string value. Defaults to false. * @returns {boolean} The converted value. */ function toBool(s: string, strict?: boolean): boolean; /** * @function * @name pc.string.getCodePoint * @description Get the code point number for a character in a string. Polyfill for * [`codePointAt`]{@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/codePointAt}. * @param {string} string - The string to get the code point from. * @param {number} [i] - The index in the string. * @returns {number} The code point value for the character in the string. */ function getCodePoint(string: string, i?: number): number; /** * @function * @name pc.string.getCodePoints * @description Gets an array of all code points in a string. * @param {string} string - The string to get code points from. * @returns {number[]} The code points in the string. */ function getCodePoints(string: string): number[]; /** * @function * @name pc.string.getSymbols * @description Gets an array of all grapheme clusters (visible symbols) in a string. This is needed because * some symbols (such as emoji or accented characters) are actually made up of multiple character codes. * @param {string} string - The string to break into symbols. * @returns {string[]} The symbols in the string. * @see {@link https://mathiasbynens.be/notes/javascript-unicode Unicode strings in JavaScript} */ function getSymbols(string: string): string[]; /** * @function * @name pc.string.fromCodePoint * @description Get the string for a given code point or set of code points. Polyfill for * [`fromCodePoint`]{@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCodePoint}. * @param {...number} args - The code points to convert to a string. * @returns {string} The converted string. */ function fromCodePoint(...args: number[]): string; } /** * @class * @name pc.Tags * @augments pc.EventHandler * @classdesc Set of tag names. * @description Create an instance of a Tags. * @param {object} [parent] - Parent object who tags belong to. * Note: Tags are used as addition of `pc.Entity` and `pc.Asset` as `tags` field. */ class Tags extends pc.EventHandler { constructor(parent?: any); /** * @function * @name pc.Tags#add * @description Add a tag, duplicates are ignored. Can be array or comma separated arguments for multiple tags. * @param {string} name - Name of a tag, or array of tags. * @returns {boolean} True if any tag were added. * @example * tags.add('level-1'); * @example * tags.add('ui', 'settings'); * @example * tags.add(['level-2', 'mob']); */ add(name: string): boolean; /** * @function * @name pc.Tags#remove * @description Remove tag. * @param {string} name - Name of a tag or array of tags. * @returns {boolean} True if any tag were removed. * @example * tags.remove('level-1'); * @example * tags.remove('ui', 'settings'); * @example * tags.remove(['level-2', 'mob']); */ remove(name: string): boolean; /** * @function * @name pc.Tags#clear * @description Remove all tags. * @example * tags.clear(); */ clear(): void; /** * @function * @name pc.Tags#has * @description Check if tags satisfy filters. * Filters can be provided by simple name of tag, as well as by array of tags. * When an array is provided it will check if tags contain each tag within the array. * If any of comma separated argument is satisfied, then it will return true. * Any number of combinations are valid, and order is irrelevant. * @param {...*} query - Name of a tag or array of tags. * @returns {boolean} True if filters are satisfied. * @example * tags.has('player'); // player * @example * tags.has('mob', 'player'); // player OR mob * @example * tags.has(['level-1', 'mob']); // monster AND level-1 * @example * tags.has(['ui', 'settings'], ['ui', 'levels']); // (ui AND settings) OR (ui AND levels) */ has(...query: any[]): boolean; /** * @function * @name pc.Tags#list * @description Returns immutable array of tags. * @returns {string[]} Copy of tags array. */ list(): string[]; /** * @field * @readonly * @name pc.Tags#size * @type {number} * @description Number of tags in set. */ readonly size: number; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.Application * @augments pc.EventHandler * @classdesc A pc.Application represents and manages your PlayCanvas application. * If you are developing using the PlayCanvas Editor, the pc.Application is created * for you. You can access your pc.Application instance in your scripts. Below is a * skeleton script which shows how you can access the application 'app' property inside * the initialize and update functions: * * ```javascript * // Editor example: accessing the pc.Application from a script * var MyScript = pc.createScript('myScript'); * * MyScript.prototype.initialize = function() { * // Every script instance has a property 'this.app' accessible in the initialize... * var app = this.app; * }; * * MyScript.prototype.update = function(dt) { * // ...and update functions. * var app = this.app; * }; * ``` * * If you are using the Engine without the Editor, you have to create the application * instance manually. * @description Create a new Application. * @param {Element} canvas - The canvas element. * @param {object} options * @param {pc.ElementInput} [options.elementInput] - Input handler for {@link pc.ElementComponent}s. * @param {pc.Keyboard} [options.keyboard] - Keyboard handler for input. * @param {pc.Mouse} [options.mouse] - Mouse handler for input. * @param {pc.TouchDevice} [options.touch] - TouchDevice handler for input. * @param {pc.GamePads} [options.gamepads] - Gamepad handler for input. * @param {string} [options.scriptPrefix] - Prefix to apply to script urls before loading. * @param {string} [options.assetPrefix] - Prefix to apply to asset urls before loading. * @param {object} [options.graphicsDeviceOptions] - Options object that is passed into the {@link pc.GraphicsDevice} constructor. * @param {string[]} [options.scriptsOrder] - Scripts in order of loading first. * @example * // Engine-only example: create the application manually * var app = new pc.Application(canvas, options); * * // Start the application's main loop * app.start(); */ class Application extends pc.EventHandler { constructor(canvas: Element, options: { elementInput?: pc.ElementInput; keyboard?: pc.Keyboard; mouse?: pc.Mouse; touch?: pc.TouchDevice; gamepads?: pc.GamePads; scriptPrefix?: string; assetPrefix?: string; graphicsDeviceOptions?: any; scriptsOrder?: string[]; }); /** * @name pc.Application#scene * @type {pc.Scene} * @description The scene managed by the application. * @example * // Set the tone mapping property of the application's scene * this.app.scene.toneMapping = pc.TONEMAP_FILMIC; */ scene: pc.Scene; /** * @name pc.Application#timeScale * @type {number} * @description Scales the global time delta. Defaults to 1. * @example * // Set the app to run at half speed * this.app.timeScale = 0.5; */ timeScale: number; /** * @name pc.Application#maxDeltaTime * @type {number} * @description Clamps per-frame delta time to an upper bound. Useful since returning from a tab * deactivation can generate huge values for dt, which can adversely affect game state. Defaults * to 0.1 (seconds). * @example * // Don't clamp inter-frame times of 200ms or less * this.app.maxDeltaTime = 0.2; */ maxDeltaTime: number; /** * @name pc.Application#assets * @type {pc.AssetRegistry} * @description The asset registry managed by the application. * @example * // Search the asset registry for all assets with the tag 'vehicle' * var vehicleAssets = this.app.assets.findByTag('vehicle'); */ assets: pc.AssetRegistry; /** * @name pc.Application#graphicsDevice * @type {pc.GraphicsDevice} * @description The graphics device used by the application. */ graphicsDevice: pc.GraphicsDevice; /** * @name pc.Application#systems * @type {pc.ComponentSystemRegistry} * @description The application's component system registry. The pc.Application * constructor adds the following component systems to its component system registry: * * * animation ({@link pc.AnimationComponentSystem}) * * audiolistener ({@link pc.AudioListenerComponentSystem}) * * button ({@link pc.ButtonComponentSystem}) * * camera ({@link pc.CameraComponentSystem}) * * collision ({@link pc.CollisionComponentSystem}) * * element ({@link pc.ElementComponentSystem}) * * layoutchild ({@link pc.LayoutChildComponentSystem}) * * layoutgroup ({@link pc.LayoutGroupComponentSystem}) * * light ({@link pc.LightComponentSystem}) * * model ({@link pc.ModelComponentSystem}) * * particlesystem ({@link pc.ParticleSystemComponentSystem}) * * rigidbody ({@link pc.RigidBodyComponentSystem}) * * screen ({@link pc.ScreenComponentSystem}) * * script ({@link pc.ScriptComponentSystem}) * * scrollbar ({@link pc.ScrollbarComponentSystem}) * * scrollview ({@link pc.ScrollViewComponentSystem}) * * sound ({@link pc.SoundComponentSystem}) * * sprite ({@link pc.SpriteComponentSystem}) * @example * // Set global gravity to zero * this.app.systems.rigidbody.gravity.set(0, 0, 0); * @example * // Set the global sound volume to 50% * this.app.systems.sound.volume = 0.5; */ systems: pc.ComponentSystemRegistry; /** * @name pc.Application#xr * @type {pc.XrManager} * @description The XR Manager that provides ability to start VR/AR sessions. * @example * // check if VR is available * if (app.xr.isAvailable(pc.XRTYPE_VR)) { * // VR is available * } */ xr: pc.XrManager; /** * @name pc.Application#loader * @type {pc.ResourceLoader} * @description The resource loader. */ loader: pc.ResourceLoader; /** * @name pc.Application#root * @type {pc.Entity} * @description The root entity of the application. * @example * // Return the first entity called 'Camera' in a depth-first search of the scene hierarchy * var camera = this.app.root.findByName('Camera'); */ root: pc.Entity; /** * @name pc.Application#keyboard * @type {pc.Keyboard} * @description The keyboard device. */ keyboard: pc.Keyboard; /** * @name pc.Application#mouse * @type {pc.Mouse} * @description The mouse device. */ mouse: pc.Mouse; /** * @name pc.Application#touch * @type {pc.TouchDevice} * @description Used to get touch events input. */ touch: pc.TouchDevice; /** * @name pc.Application#gamepads * @type {pc.GamePads} * @description Used to access GamePad input. */ gamepads: pc.GamePads; /** * @name pc.Application#elementInput * @type {pc.ElementInput} * @description Used to handle input for {@link pc.ElementComponent}s. */ elementInput: pc.ElementInput; /** * @name pc.Application#scripts * @type {pc.ScriptRegistry} * @description The application's script registry. */ scripts: pc.ScriptRegistry; /** * @name pc.Application#batcher * @type {pc.BatchManager} * @description The application's batch manager. The batch manager is used to * merge mesh instances in the scene, which reduces the overall number of draw * calls, thereby boosting performance. */ batcher: pc.BatchManager; /** * @name pc.Application#autoRender * @type {boolean} * @description When true, the application's render function is called every frame. * Setting autoRender to false is useful to applications where the rendered image * may often be unchanged over time. This can heavily reduce the application's * load on the CPU and GPU. Defaults to true. * @example * // Disable rendering every frame and only render on a keydown event * this.app.autoRender = false; * this.app.keyboard.on('keydown', function (event) { * this.app.renderNextFrame = true; * }, this); */ autoRender: boolean; /** * @name pc.Application#renderNextFrame * @type {boolean} * @description Set to true to render the scene on the next iteration of the main loop. * This only has an effect if {@link pc.Application#autoRender} is set to false. The * value of renderNextFrame is set back to false again as soon as the scene has been * rendered. * @example * // Render the scene only while space key is pressed * if (this.app.keyboard.isPressed(pc.KEY_SPACE)) { * this.app.renderNextFrame = true; * } */ renderNextFrame: boolean; /** * @name pc.Application#i18n * @type {pc.I18n} * @description Handles localization. */ i18n: pc.I18n; /** * @static * @function * @name pc.Application.getApplication * @description Get the current application. In the case where there are multiple running * applications, the function can get an application based on a supplied canvas id. This * function is particularly useful when the current pc.Application is not readily available. * For example, in the JavaScript console of the browser's developer tools. * @param {string} [id] - If defined, the returned application should use the canvas which has this id. Otherwise current application will be returned. * @returns {pc.Application|undefined} The running application, if any. * @example * var app = pc.Application.getApplication(); */ static getApplication(id?: string): pc.Application | undefined; /** * @function * @name pc.Application#configure * @description Load the application configuration file and apply application properties and fill the asset registry. * @param {string} url - The URL of the configuration file to load. * @param {pc.callbacks.ConfigureApp} callback - The Function called when the configuration file is loaded and parsed (or an error occurs). */ configure(url: string, callback: pc.callbacks.ConfigureApp): void; /** * @function * @name pc.Application#preload * @description Load all assets in the asset registry that are marked as 'preload'. * @param {pc.callbacks.PreloadApp} callback - Function called when all assets are loaded. */ preload(callback: pc.callbacks.PreloadApp): void; /** * @function * @name pc.Application#getSceneUrl * @description Look up the URL of the scene hierarchy file via the name given to the scene in the editor. Use this to in {@link pc.Application#loadSceneHierarchy}. * @param {string} name - The name of the scene file given in the Editor. * @returns {string} The URL of the scene file. */ getSceneUrl(name: string): string; /** * @function * @name pc.Application#loadSceneHierarchy * @description Load a scene file, create and initialize the Entity hierarchy * and add the hierarchy to the application root Entity. * @param {string} url - The URL of the scene file. Usually this will be "scene_id.json". * @param {pc.callbacks.LoadHierarchy} callback - The function to call after loading, passed (err, entity) where err is null if no errors occurred. * @example * * app.loadSceneHierarchy("1000.json", function (err, entity) { * if (!err) { * var e = app.root.find("My New Entity"); * } else { * // error * } * }); */ loadSceneHierarchy(url: string, callback: pc.callbacks.LoadHierarchy): void; /** * @function * @name pc.Application#loadSceneSettings * @description Load a scene file and automatically apply the scene settings to the current scene. * @param {string} url - The URL of the scene file. Usually this will be "scene_id.json". * @param {pc.callbacks.LoadSettings} callback - The function called after the settings are applied. Passed (err) where err is null if no error occurred. * @example * app.loadSceneSettings("1000.json", function (err) { * if (!err) { * // success * } else { * // error * } * }); */ loadSceneSettings(url: string, callback: pc.callbacks.LoadSettings): void; /** * @function * @name pc.Application#start * @description Start the application. This function does the following: * 1. Fires an event on the application named 'start' * 2. Calls initialize for all components on entities in the hierachy * 3. Fires an event on the application named 'initialize' * 4. Calls postInitialize for all components on entities in the hierachy * 5. Fires an event on the application named 'postinitialize' * 6. Starts executing the main loop of the application * This function is called internally by PlayCanvas applications made in the Editor * but you will need to call start yourself if you are using the engine stand-alone. * @example * app.start(); */ start(): void; /** * @function * @name pc.Application#update * @description Update the application. This function will call the update * functions and then the postUpdate functions of all enabled components. It * will then update the current state of all connected input devices. * This function is called internally in the application's main loop and * does not need to be called explicitly. * @param {number} dt - The time delta since the last frame. */ update(dt: number): void; /** * @function * @name pc.Application#render * @description Render the application's scene. More specifically, the scene's * {@link pc.LayerComposition} is rendered by the application's {@link pc.ForwardRenderer}. * This function is called internally in the application's main loop and * does not need to be called explicitly. */ render(): void; /** * @function * @name pc.Application#setCanvasFillMode * @description Controls how the canvas fills the window and resizes when the window changes. * @param {string} mode - The mode to use when setting the size of the canvas. Can be: * * * {@link pc.FILLMODE_NONE}: the canvas will always match the size provided. * * {@link pc.FILLMODE_FILL_WINDOW}: the canvas will simply fill the window, changing aspect ratio. * * {@link pc.FILLMODE_KEEP_ASPECT}: the canvas will grow to fill the window as best it can while maintaining the aspect ratio. * @param {number} [width] - The width of the canvas (only used when mode is pc.FILLMODE_NONE). * @param {number} [height] - The height of the canvas (only used when mode is pc.FILLMODE_NONE). */ setCanvasFillMode(mode: string, width?: number, height?: number): void; /** * @function * @name pc.Application#setCanvasResolution * @description Change the resolution of the canvas, and set the way it behaves when the window is resized. * @param {string} mode - The mode to use when setting the resolution. Can be: * * * {@link pc.RESOLUTION_AUTO}: if width and height are not provided, canvas will be resized to match canvas client size. * * {@link pc.RESOLUTION_FIXED}: resolution of canvas will be fixed. * @param {number} [width] - The horizontal resolution, optional in AUTO mode, if not provided canvas clientWidth is used. * @param {number} [height] - The vertical resolution, optional in AUTO mode, if not provided canvas clientHeight is used. */ setCanvasResolution(mode: string, width?: number, height?: number): void; /** * @function * @name pc.Application#isHidden * @description Queries the visibility of the window or tab in which the application is running. * @returns {boolean} True if the application is not visible and false otherwise. */ isHidden(): boolean; /** * @function * @name pc.Application#resizeCanvas * @description Resize the application's canvas element in line with the current fill mode. * In {@link pc.FILLMODE_KEEP_ASPECT} mode, the canvas will grow to fill the window as best it can while maintaining the aspect ratio. * In {@link pc.FILLMODE_FILL_WINDOW} mode, the canvas will simply fill the window, changing aspect ratio. * In {@link pc.FILLMODE_NONE} mode, the canvas will always match the size provided. * @param {number} [width] - The width of the canvas. Only used if current fill mode is {@link pc.FILLMODE_NONE}. * @param {number} [height] - The height of the canvas. Only used if current fill mode is {@link pc.FILLMODE_NONE}. * @returns {object} A object containing the values calculated to use as width and height. */ resizeCanvas(width?: number, height?: number): any; /** * @function * @name pc.Application#applySceneSettings * @description Apply scene settings to the current scene. Useful when your scene settings are parsed or generated from a non-URL source. * @param {object} settings - The scene settings to be applied. * @param {object} settings.physics - The physics settings to be applied. * @param {number[]} settings.physics.gravity - The world space vector representing global gravity in the physics simulation. Must be a fixed size array with three number elements, corresponding to each axis [ X, Y, Z ]. * @param {object} settings.render - The rendering settings to be applied. * @param {number[]} settings.render.global_ambient - The color of the scene's ambient light. Must be a fixed size array with three number elements, corresponding to each color channel [ R, G, B ]. * @param {string} settings.render.fog - The type of fog used by the scene. Can be: * * * {@link pc.FOG_NONE} * * {@link pc.FOG_LINEAR} * * {@link pc.FOG_EXP} * * {@link pc.FOG_EXP2} * @param {number[]} settings.render.fog_color - The color of the fog (if enabled). Must be a fixed size array with three number elements, corresponding to each color channel [ R, G, B ]. * @param {number} settings.render.fog_density - The density of the fog (if enabled). This property is only valid if the fog property is set to pc.FOG_EXP or pc.FOG_EXP2. * @param {number} settings.render.fog_start - The distance from the viewpoint where linear fog begins. This property is only valid if the fog property is set to pc.FOG_LINEAR. * @param {number} settings.render.fog_end - The distance from the viewpoint where linear fog reaches its maximum. This property is only valid if the fog property is set to pc.FOG_LINEAR. * @param {number} settings.render.gamma_correction - The gamma correction to apply when rendering the scene. Can be: * * * {@link pc.GAMMA_NONE} * * {@link pc.GAMMA_SRGB} * @param {number} settings.render.tonemapping - The tonemapping transform to apply when writing fragments to the * frame buffer. Can be: * * * {@link pc.TONEMAP_LINEAR} * * {@link pc.TONEMAP_FILMIC} * * {@link pc.TONEMAP_HEJL} * * {@link pc.TONEMAP_ACES} * @param {number} settings.render.exposure - The exposure value tweaks the overall brightness of the scene. * @param {number|null} [settings.render.skybox] - The asset ID of the cube map texture to be used as the scene's skybox. Defaults to null. * @param {number} settings.render.skyboxIntensity - Multiplier for skybox intensity. * @param {number} settings.render.skyboxMip - The mip level of the skybox to be displayed. Only valid for prefiltered cubemap skyboxes. * @param {number} settings.render.lightmapSizeMultiplier - The lightmap resolution multiplier. * @param {number} settings.render.lightmapMaxResolution - The maximum lightmap resolution. * @param {number} settings.render.lightmapMode - The lightmap baking mode. Can be: * * * {@link pc.BAKE_COLOR}: single color lightmap * * {@link pc.BAKE_COLORDIR}: single color lightmap + dominant light direction (used for bump/specular) * * Only lights with bakeDir=true will be used for generating the dominant light direction. Defaults to. * @example * * var settings = { * physics: { * gravity: [0, -9.8, 0] * }, * render: { * fog_end: 1000, * tonemapping: 0, * skybox: null, * fog_density: 0.01, * gamma_correction: 1, * exposure: 1, * fog_start: 1, * global_ambient: [0, 0, 0], * skyboxIntensity: 1, * fog_color: [0, 0, 0], * lightmapMode: 1, * fog: 'none', * lightmapMaxResolution: 2048, * skyboxMip: 2, * lightmapSizeMultiplier: 16 * } * }; * app.applySceneSettings(settings); */ applySceneSettings(settings: { physics: { gravity: number[]; }; render: { global_ambient: number[]; fog: string; fog_color: number[]; fog_density: number; fog_start: number; fog_end: number; gamma_correction: number; tonemapping: number; exposure: number; skybox?: number | null; skyboxIntensity: number; skyboxMip: number; lightmapSizeMultiplier: number; lightmapMaxResolution: number; lightmapMode: number; }; }): void; /** * @function * @name pc.Application#setSkybox * @description Sets the skybox asset to current scene, and subscribes to asset load/change events. * @param {pc.Asset} asset - Asset of type `skybox` to be set to, or null to remove skybox. */ setSkybox(asset: pc.Asset): void; /** * @function * @name pc.Application#destroy * @description Destroys application and removes all event listeners. * @example * this.app.destroy(); */ destroy(): void; /** * @function * @name pc.Application#renderLine * @description Renders a line. Line start and end coordinates are specified in * world-space. If a single color is supplied, the line will be flat-shaded with * that color. If two colors are supplied, the line will be smooth shaded between * those colors. It is also possible to control which scene layer the line is * rendered into. By default, lines are rendered into the immediate layer * {@link pc.LAYERID_IMMEDIATE}. * @param {pc.Vec3} start - The start world-space coordinate of the line. * @param {pc.Vec3} end - The end world-space coordinate of the line. * @param {pc.Color} color - The start color of the line. * @param {pc.Color} [endColor] - The end color of the line. * @param {object} [options] - Options to set rendering properties. * @param {pc.Layer} [options.layer] - The layer to render the line into. Defaults * to {@link pc.LAYERID_IMMEDIATE}. * @example * // Render a 1-unit long white line * var start = new pc.Vec3(0, 0, 0); * var end = new pc.Vec3(1, 0, 0); * var color = new pc.Color(1, 1, 1); * app.renderLine(start, end, color); * @example * // Render a 1-unit long line that is smooth-shaded from white to red * var start = new pc.Vec3(0, 0, 0); * var end = new pc.Vec3(1, 0, 0); * var startColor = new pc.Color(1, 1, 1); * var endColor = new pc.Color(1, 0, 0); * app.renderLine(start, end, startColor, endColor); * @example * // Render a 1-unit long white line into the world layer * var start = new pc.Vec3(0, 0, 0); * var end = new pc.Vec3(1, 0, 0); * var color = new pc.Color(1, 1, 1); * var worldLayer = app.scene.layers.getLayerById(pc.LAYERID_WORLD); * app.renderLine(start, end, color, { * layer: worldLayer * }); * @example * // Render a 1-unit long line that is smooth-shaded from white to red into the world layer * var start = new pc.Vec3(0, 0, 0); * var end = new pc.Vec3(1, 0, 0); * var startColor = new pc.Color(1, 1, 1); * var endColor = new pc.Color(1, 0, 0); * var worldLayer = app.scene.layers.getLayerById(pc.LAYERID_WORLD); * app.renderLine(start, end, color, { * layer: worldLayer * }); */ renderLine(start: pc.Vec3, end: pc.Vec3, color: pc.Color, endColor?: pc.Color, options?: { layer?: pc.Layer; }): void; /** * @function * @name pc.Application#renderLines * @description Draw an array of lines. * @param {pc.Vec3[]} position - An array of points to draw lines between. * @param {pc.Color[]} color - An array of colors to color the lines. This must be the same size as the position array. * @param {object} [options] - Options to set rendering properties. * @param {pc.Layer} [options.layer] - The layer to render the line into. * @example * var points = [new pc.Vec3(0, 0, 0), new pc.Vec3(1, 0, 0), new pc.Vec3(1, 1, 0), new pc.Vec3(1, 1, 1)]; * var colors = [new pc.Color(1, 0, 0), new pc.Color(1, 1, 0), new pc.Color(0, 1, 1), new pc.Color(0, 0, 1)]; * app.renderLines(points, colors); */ renderLines(position: pc.Vec3[], color: pc.Color[], options?: { layer?: pc.Layer; }): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @constant * @type {string} * @name pc.FILLMODE_NONE * @description When resizing the window the size of the canvas will not change. */ const FILLMODE_NONE: string; /** * @constant * @type {string} * @name pc.FILLMODE_FILL_WINDOW * @description When resizing the window the size of the canvas will change to fill the window exactly. */ const FILLMODE_FILL_WINDOW: string; /** * @constant * @type {string} * @name pc.FILLMODE_KEEP_ASPECT * @description When resizing the window the size of the canvas will change to fill the window as best it can, while maintaining the same aspect ratio. */ const FILLMODE_KEEP_ASPECT: string; /** * @constant * @type {string} * @name pc.RESOLUTION_AUTO * @description When the canvas is resized the resolution of the canvas will change to match the size of the canvas. */ const RESOLUTION_AUTO: string; /** * @constant * @type {string} * @name pc.RESOLUTION_FIXED * @description When the canvas is resized the resolution of the canvas will remain at the same value and the output will just be scaled to fit the canvas. */ const RESOLUTION_FIXED: string; /** * @component Animation * @class * @name pc.AnimationComponent * @augments pc.Component * @classdesc The Animation Component allows an Entity to playback animations on models. * @description Create a new AnimationComponent. * @param {pc.AnimationComponentSystem} system - The {@link pc.ComponentSystem} that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {number} speed Speed multiplier for animation play back speed. 1.0 is playback at normal speed, 0.0 pauses the animation. * @property {boolean} loop If true the animation will restart from the beginning when it reaches the end. * @property {boolean} activate If true the first animation asset will begin playing when the scene is loaded. * @property {pc.Asset[]|number[]} assets The array of animation assets - can also be an array of asset ids. * @property {number} currentTime Get or Set the current time position (in seconds) of the animation. * @property {number} duration Get the duration in seconds of the current animation. */ class AnimationComponent extends pc.Component { constructor(system: pc.AnimationComponentSystem, entity: pc.Entity); /** * @function * @name pc.AnimationComponent#play * @description Start playing an animation. * @param {string} name - The name of the animation asset to begin playing. * @param {number} [blendTime] - The time in seconds to blend from the current * animation state to the start of the animation being set. */ play(name: string, blendTime?: number): void; /** * @function * @name pc.AnimationComponent#getAnimation * @description Return an animation. * @param {string} name - The name of the animation asset. * @returns {pc.Animation} An Animation. */ getAnimation(name: string): pc.Animation; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Speed multiplier for animation play back speed. 1.0 is playback at normal speed, 0.0 pauses the animation. */ speed: number; /** * If true the animation will restart from the beginning when it reaches the end. */ loop: boolean; /** * If true the first animation asset will begin playing when the scene is loaded. */ activate: boolean; /** * The array of animation assets - can also be an array of asset ids. */ assets: pc.Asset[] | number[]; /** * Get or Set the current time position (in seconds) of the animation. */ currentTime: number; /** * Get the duration in seconds of the current animation. */ duration: number; } /** * @class * @name pc.AnimationComponentSystem * @augments pc.ComponentSystem * @classdesc The AnimationComponentSystem manages creating and deleting AnimationComponents. * @description Create an AnimationComponentSystem. * @param {pc.Application} app - The application managing this system. */ class AnimationComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.AudioListenerComponent * @augments pc.Component * @classdesc Represents the audio listener in the 3D world, so that 3D positioned audio sources are heard correctly. * @description Create new AudioListenerComponent. * @param {pc.AudioListenerComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. */ class AudioListenerComponent extends pc.Component { constructor(system: pc.AudioListenerComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.AudioListenerComponentSystem * @augments pc.ComponentSystem * @classdesc Component System for adding and removing {@link pc.AudioComponent} objects to Entities. * @description Create a new AudioListenerComponentSystem. * @param {pc.Application} app - The application managing this system. * @param {pc.SoundManager} manager - A sound manager instance. */ class AudioListenerComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application, manager: pc.SoundManager); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.ButtonComponent * @augments pc.Component * @classdesc A ButtonComponent enables a group of entities to behave like a button, with different visual states for hover and press interactions. * @description Create a new ButtonComponent. * @param {pc.ButtonComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {boolean} active If set to false, the button will be visible but will not respond to hover or touch interactions. * @property {pc.Entity} imageEntity A reference to the entity to be used as the button background. The entity must have an ImageElement component. * @property {pc.Vec4} hitPadding Padding to be used in hit-test calculations. Can be used to expand the bounding box so that the button is easier to tap. * @property {number} transitionMode Controls how the button responds when the user hovers over it/presses it. * @property {pc.Color} hoverTint Color to be used on the button image when the user hovers over it. * @property {pc.Color} pressedTint Color to be used on the button image when the user presses it. * @property {pc.Color} inactiveTint Color to be used on the button image when the button is not interactive. * @property {number} fadeDuration Duration to be used when fading between tints, in milliseconds. * @property {pc.Asset} hoverSpriteAsset Sprite to be used as the button image when the user hovers over it. * @property {number} hoverSpriteFrame Frame to be used from the hover sprite. * @property {pc.Asset} pressedSpriteAsset Sprite to be used as the button image when the user presses it. * @property {number} pressedSpriteFrame Frame to be used from the pressed sprite. * @property {pc.Asset} inactiveSpriteAsset Sprite to be used as the button image when the button is not interactive. * @property {number} inactiveSpriteFrame Frame to be used from the inactive sprite. */ class ButtonComponent extends pc.Component { constructor(system: pc.ButtonComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * If set to false, the button will be visible but will not respond to hover or touch interactions. */ active: boolean; /** * A reference to the entity to be used as the button background. The entity must have an ImageElement component. */ imageEntity: pc.Entity; /** * Padding to be used in hit-test calculations. Can be used to expand the bounding box so that the button is easier to tap. */ hitPadding: pc.Vec4; /** * Controls how the button responds when the user hovers over it/presses it. */ transitionMode: number; /** * Color to be used on the button image when the user hovers over it. */ hoverTint: pc.Color; /** * Color to be used on the button image when the user presses it. */ pressedTint: pc.Color; /** * Color to be used on the button image when the button is not interactive. */ inactiveTint: pc.Color; /** * Duration to be used when fading between tints, in milliseconds. */ fadeDuration: number; /** * Sprite to be used as the button image when the user hovers over it. */ hoverSpriteAsset: pc.Asset; /** * Frame to be used from the hover sprite. */ hoverSpriteFrame: number; /** * Sprite to be used as the button image when the user presses it. */ pressedSpriteAsset: pc.Asset; /** * Frame to be used from the pressed sprite. */ pressedSpriteFrame: number; /** * Sprite to be used as the button image when the button is not interactive. */ inactiveSpriteAsset: pc.Asset; /** * Frame to be used from the inactive sprite. */ inactiveSpriteFrame: number; } /** * @constant * @type {number} * @name pc.BUTTON_TRANSITION_MODE_TINT * @description Specifies different color tints for the hover, pressed and inactive states. */ const BUTTON_TRANSITION_MODE_TINT: number; /** * @constant * @type {number} * @name pc.BUTTON_TRANSITION_MODE_SPRITE_CHANGE * @description Specifies different sprites for the hover, pressed and inactive states. */ const BUTTON_TRANSITION_MODE_SPRITE_CHANGE: number; /** * @class * @name pc.ButtonComponentSystem * @augments pc.ComponentSystem * @classdesc Manages creation of {@link pc.ButtonComponent}s. * @description Create a new ButtonComponentSystem. * @param {pc.Application} app - The application. */ class ButtonComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.CameraComponent * @augments pc.Component * @classdesc The Camera Component enables an Entity to render the scene. A scene requires at least one * enabled camera component to be rendered. Note that multiple camera components can be enabled * simultaneously (for split-screen or offscreen rendering, for example). * @description Create a new Camera Component. * @param {pc.CameraComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @example * // Add a pc.CameraComponent to an entity * var entity = new pc.Entity(); * entity.addComponent('camera', { * nearClip: 1, * farClip: 100, * fov: 55 * }); * @example * // Get the pc.CameraComponent on an entity * var cameraComponent = entity.camera; * @example * // Update a property on a camera component * entity.camera.nearClip = 2; * @property {number} projection The type of projection used to render the camera. Can be: * * * {@link pc.PROJECTION_PERSPECTIVE}: A perspective projection. The camera frustum resembles a truncated pyramid. * * {@link pc.PROJECTION_ORTHOGRAPHIC}: An orthographic projection. The camera frustum is a cuboid. * * Defaults to pc.PROJECTION_PERSPECTIVE. * @property {number} nearClip The distance from the camera before which no rendering will take place. * @property {number} farClip The distance from the camera after which no rendering will take place. * @property {number} aspectRatioMode The aspect ratio mode of the camera. Can be pc.ASPECT_AUTO (default) or pc.ASPECT_MANUAL. ASPECT_AUTO will always be current render target's width divided by height. ASPECT_MANUAL will use the aspectRatio value instead. * @property {number} aspectRatio The aspect ratio (width divided by height) of the camera. If aspectRatioMode is ASPECT_AUTO, then this value will be automatically calculated every frame, and you can only read it. If it's ASPECT_MANUAL, you can set the value. * @property {boolean} horizontalFov Set which axis to use for the Field of View calculation. Defaults to false (use Y-axis). * @property {number} fov The field of view of the camera in degrees. Usually this is the Y-axis field of * view, see {@link pc.CameraComponent#horizontalFov}. Used for {@link pc.PROJECTION_PERSPECTIVE} cameras only. Defaults to 45. * @property {number} orthoHeight The half-height of the orthographic view window (in the Y-axis). Used for * {@link pc.PROJECTION_ORTHOGRAPHIC} cameras only. Defaults to 10. * @property {number} priority Controls the order in which cameras are rendered. Cameras with smaller values for priority are rendered first. * @property {pc.Color} clearColor The color used to clear the canvas to before the camera starts to render. * @property {boolean} clearColorBuffer If true the camera will clear the color buffer to the color set in clearColor. * @property {boolean} clearDepthBuffer If true the camera will clear the depth buffer. * @property {boolean} clearStencilBuffer If true the camera will clear the stencil buffer. * @property {pc.Vec4} rect Controls where on the screen the camera will be rendered in normalized screen coordinates. * @property {pc.Vec4} scissorRect Clips all pixels which are not in the rectangle. * The order of the values is [x, y, width, height]. * @property {pc.PostEffectQueue} postEffects The post effects queue for this camera. Use this to add or remove post effects from the camera. * @property {boolean} frustumCulling Controls the culling of mesh instances against the camera frustum, i.e. if objects outside of camera should be omitted from rendering. * If true, culling is enabled. * If false, all mesh instances in the scene are rendered by the camera, regardless of visibility. Defaults to false. * @property {pc.callbacks.CalculateMatrix} calculateTransform Custom function you can provide to calculate the camera transformation matrix manually. Can be used for complex effects like reflections. Function is called using component's scope. * Arguments: * * * {pc.Mat4} transformMatrix: output of the function. * * {number} view: Type of view. Can be pc.VIEW_CENTER, pc.VIEW_LEFT or pc.VIEW_RIGHT. Left and right are only used in stereo rendering. * @property {pc.callbacks.CalculateMatrix} calculateProjection Custom function you can provide to calculate the camera projection matrix manually. Can be used for complex effects like doing oblique projection. Function is called using component's scope. * Arguments: * * * {pc.Mat4} transformMatrix: output of the function * * {number} view: Type of view. Can be pc.VIEW_CENTER, pc.VIEW_LEFT or pc.VIEW_RIGHT. Left and right are only used in stereo rendering. * @property {boolean} cullFaces If true the camera will take material.cull into account. Otherwise both front and back faces will be rendered. * @property {boolean} flipFaces If true the camera will invert front and back faces. Can be useful for reflection rendering. * @property {number[]} layers An array of layer IDs ({@link pc.Layer#id}) to which this camera should belong. * Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ class CameraComponent extends pc.Component { constructor(system: pc.CameraComponentSystem, entity: pc.Entity); /** * @readonly * @name pc.CameraComponent#projectionMatrix * @type {pc.Mat4} * @description Queries the camera's projection matrix. */ readonly projectionMatrix: pc.Mat4; /** * @readonly * @name pc.CameraComponent#viewMatrix * @type {pc.Mat4} * @description Queries the camera's view matrix. */ readonly viewMatrix: pc.Mat4; /** * @readonly * @name pc.CameraComponent#frustum * @type {pc.Frustum} * @description Queries the camera's frustum shape. */ readonly frustum: pc.Frustum; /** * @readonly * @name pc.CameraComponent#node * @type {pc.GraphNode} * @description Queries the camera's GraphNode. Can be used to get position and rotation. */ readonly node: pc.GraphNode; /** * @function * @name pc.CameraComponent#screenToWorld * @description Convert a point from 2D screen space to 3D world space. * @param {number} screenx - X coordinate on PlayCanvas' canvas element. * @param {number} screeny - Y coordinate on PlayCanvas' canvas element. * @param {number} cameraz - The distance from the camera in world space to create the new point. * @param {pc.Vec3} [worldCoord] - 3D vector to receive world coordinate result. * @example * // Get the start and end points of a 3D ray fired from a screen click position * var start = entity.camera.screenToWorld(clickX, clickY, entity.camera.nearClip); * var end = entity.camera.screenToWorld(clickX, clickY, entity.camera.farClip); * * // Use the ray coordinates to perform a raycast * app.systems.rigidbody.raycastFirst(start, end, function (result) { * console.log("Entity " + result.entity.name + " was selected"); * }); * @returns {pc.Vec3} The world space coordinate. */ screenToWorld(screenx: number, screeny: number, cameraz: number, worldCoord?: pc.Vec3): pc.Vec3; /** * @function * @name pc.CameraComponent#worldToScreen * @description Convert a point from 3D world space to 2D screen space. * @param {pc.Vec3} worldCoord - The world space coordinate. * @param {pc.Vec3} [screenCoord] - 3D vector to receive screen coordinate result. * @returns {pc.Vec3} The screen space coordinate. */ worldToScreen(worldCoord: pc.Vec3, screenCoord?: pc.Vec3): pc.Vec3; /** * @function * @name pc.CameraComponent#calculateAspectRatio * @description Calculates aspect ratio value for a given render target. * @param {pc.RenderTarget} [rt] - Optional render target. If unspecified, the backbuffer is assumed. * @returns {number} The aspect ratio of the render target (or backbuffer). */ calculateAspectRatio(rt?: pc.RenderTarget): number; /** * @function * @name pc.CameraComponent#startXr * @description Attempt to start XR session with this camera * @param {string} type - The type of session. Can be one of the following: * * * {@link pc.XRTYPE_INLINE}: Inline - always available type of session. It has limited feature availability and is rendered into HTML element. * * {@link pc.XRTYPE_VR}: Immersive VR - session that provides exclusive access to the VR device with the best available tracking features. * * {@link pc.XRTYPE_AR}: Immersive AR - session that provides exclusive access to the VR/AR device that is intended to be blended with the real-world environment. * * @param {string} spaceType - reference space type. Can be one of the following: * * * {@link pc.XRSPACE_VIEWER}: Viewer - always supported space with some basic tracking capabilities. * * {@link pc.XRSPACE_LOCAL}: Local - represents a tracking space with a native origin near the viewer at the time of creation. It is meant for seated or basic local XR sessions. * * {@link pc.XRSPACE_LOCALFLOOR}: Local Floor - represents a tracking space with a native origin at the floor in a safe position for the user to stand. The y axis equals 0 at floor level. Floor level value might be estimated by the underlying platform. It is meant for seated or basic local XR sessions. * * {@link pc.XRSPACE_BOUNDEDFLOOR}: Bounded Floor - represents a tracking space with its native origin at the floor, where the user is expected to move within a pre-established boundary. * * {@link pc.XRSPACE_UNBOUNDED}: Unbounded - represents a tracking space where the user is expected to move freely around their environment, potentially long distances from their starting point. * * @param {pc.callbacks.XrError} [callback] - Optional callback function called once the session is started. The callback has one argument Error - it is null if the XR session started successfully. * @example * // On an entity with a camera component * this.entity.camera.startXr(pc.XRTYPE_VR, pc.XRSPACE_LOCAL, function (err) { * if (err) { * // failed to start XR session * } else { * // in XR * } * }); */ startXr(type: string, spaceType: string, callback?: pc.callbacks.XrError): void; /** * @function * @name pc.CameraComponent#endXr * @description Attempt to end XR session of this camera * @param {pc.callbacks.XrError} [callback] - Optional callback function called once session is ended. The callback has one argument Error - it is null if successfully ended XR session. * @example * // On an entity with a camera component * this.entity.camera.endXr(function (err) { * // not anymore in XR * }); */ endXr(callback?: pc.callbacks.XrError): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The type of projection used to render the camera. Can be: * * {@link pc.PROJECTION_PERSPECTIVE}: A perspective projection. The camera frustum resembles a truncated pyramid. * * {@link pc.PROJECTION_ORTHOGRAPHIC}: An orthographic projection. The camera frustum is a cuboid. * Defaults to pc.PROJECTION_PERSPECTIVE. */ projection: number; /** * The distance from the camera before which no rendering will take place. */ nearClip: number; /** * The distance from the camera after which no rendering will take place. */ farClip: number; /** * The aspect ratio mode of the camera. Can be pc.ASPECT_AUTO (default) or pc.ASPECT_MANUAL. ASPECT_AUTO will always be current render target's width divided by height. ASPECT_MANUAL will use the aspectRatio value instead. */ aspectRatioMode: number; /** * The aspect ratio (width divided by height) of the camera. If aspectRatioMode is ASPECT_AUTO, then this value will be automatically calculated every frame, and you can only read it. If it's ASPECT_MANUAL, you can set the value. */ aspectRatio: number; /** * Set which axis to use for the Field of View calculation. Defaults to false (use Y-axis). */ horizontalFov: boolean; /** * The field of view of the camera in degrees. Usually this is the Y-axis field of * view, see {@link pc.CameraComponent#horizontalFov}. Used for {@link pc.PROJECTION_PERSPECTIVE} cameras only. Defaults to 45. */ fov: number; /** * The half-height of the orthographic view window (in the Y-axis). Used for * {@link pc.PROJECTION_ORTHOGRAPHIC} cameras only. Defaults to 10. */ orthoHeight: number; /** * Controls the order in which cameras are rendered. Cameras with smaller values for priority are rendered first. */ priority: number; /** * The color used to clear the canvas to before the camera starts to render. */ clearColor: pc.Color; /** * If true the camera will clear the color buffer to the color set in clearColor. */ clearColorBuffer: boolean; /** * If true the camera will clear the depth buffer. */ clearDepthBuffer: boolean; /** * If true the camera will clear the stencil buffer. */ clearStencilBuffer: boolean; /** * Controls where on the screen the camera will be rendered in normalized screen coordinates. */ rect: pc.Vec4; /** * Clips all pixels which are not in the rectangle. * The order of the values is [x, y, width, height]. */ scissorRect: pc.Vec4; /** * The post effects queue for this camera. Use this to add or remove post effects from the camera. */ postEffects: pc.PostEffectQueue; /** * Controls the culling of mesh instances against the camera frustum, i.e. if objects outside of camera should be omitted from rendering. * If true, culling is enabled. * If false, all mesh instances in the scene are rendered by the camera, regardless of visibility. Defaults to false. */ frustumCulling: boolean; /** * Custom function you can provide to calculate the camera transformation matrix manually. Can be used for complex effects like reflections. Function is called using component's scope. * Arguments: * * {pc.Mat4} transformMatrix: output of the function. * * {number} view: Type of view. Can be pc.VIEW_CENTER, pc.VIEW_LEFT or pc.VIEW_RIGHT. Left and right are only used in stereo rendering. */ calculateTransform: pc.callbacks.CalculateMatrix; /** * Custom function you can provide to calculate the camera projection matrix manually. Can be used for complex effects like doing oblique projection. Function is called using component's scope. * Arguments: * * {pc.Mat4} transformMatrix: output of the function * * {number} view: Type of view. Can be pc.VIEW_CENTER, pc.VIEW_LEFT or pc.VIEW_RIGHT. Left and right are only used in stereo rendering. */ calculateProjection: pc.callbacks.CalculateMatrix; /** * If true the camera will take material.cull into account. Otherwise both front and back faces will be rendered. */ cullFaces: boolean; /** * If true the camera will invert front and back faces. Can be useful for reflection rendering. */ flipFaces: boolean; /** * An array of layer IDs ({@link pc.Layer#id}) to which this camera should belong. * Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ layers: number[]; } /** * @class * @name pc.PostEffectQueue * @classdesc Used to manage multiple post effects for a camera. * @description Create a new PostEffectQueue. * @param {pc.Application} app - The application. * @param {pc.CameraComponent} camera - The camera component. */ class PostEffectQueue { constructor(app: pc.Application, camera: pc.CameraComponent); /** * @function * @name pc.PostEffectQueue#addEffect * @description Adds a post effect to the queue. If the queue is disabled adding a post effect will * automatically enable the queue. * @param {pc.PostEffect} effect - The post effect to add to the queue. */ addEffect(effect: pc.PostEffect): void; /** * @function * @name pc.PostEffectQueue#removeEffect * @description Removes a post effect from the queue. If the queue becomes empty it will be disabled automatically. * @param {pc.PostEffect} effect - The post effect to remove. */ removeEffect(effect: pc.PostEffect): void; /** * @function * @name pc.PostEffectQueue#destroy * @description Removes all the effects from the queue and disables it. */ destroy(): void; /** * @function * @name pc.PostEffectQueue#enable * @description Enables the queue and all of its effects. If there are no effects then the queue will not be enabled. */ enable(): void; /** * @function * @name pc.PostEffectQueue#disable * @description Disables the queue and all of its effects. */ disable(): void; } /** * @class * @name pc.CameraComponentSystem * @augments pc.ComponentSystem * @classdesc Used to add and remove {@link pc.CameraComponent}s from Entities. It also holds an * array of all active cameras. * @description Create a new CameraComponentSystem. * @param {pc.Application} app - The Application. * @property {pc.CameraComponent[]} cameras Holds all the active camera components. */ class CameraComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Holds all the active camera components. */ cameras: pc.CameraComponent[]; } /** * @component * @class * @name pc.CollisionComponent * @augments pc.Component * @classdesc A collision volume. Use this in conjunction with a {@link pc.RigidBodyComponent} * to make a collision volume that can be simulated using the physics engine. * * If the {@link pc.Entity} does not have a {@link pc.RigidBodyComponent} then this collision * volume will act as a trigger volume. When an entity with a dynamic or kinematic body enters * or leaves an entity with a trigger volume, both entities will receive trigger events. * * The following table shows all the events that can be fired between two Entities: * * | | Rigid Body (Static) | Rigid Body (Dynamic or Kinematic) | Trigger Volume | * | ------------------------------------- | --------------------------------------------------------------------- | --------------------------------------------------------------------- | --------------------------------------------------- | * | **Rigid Body (Static)** | | | | * | **Rigid Body (Dynamic or Kinematic)** | | | | * | **Trigger Volume** | | | | * * @description Create a new CollisionComponent. * @param {pc.CollisionComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {string} type The type of the collision volume. Can be: * * * "box": A box-shaped collision volume. * * "capsule": A capsule-shaped collision volume. * * "compound": A compound shape. Any descendent entities with a collision component * of type box, capsule, cone, cylinder or sphere will be combined into a single, rigid * shape. * * "cone": A cone-shaped collision volume. * * "cylinder": A cylinder-shaped collision volume. * * "mesh": A collision volume that uses a model asset as its shape. * * "sphere": A sphere-shaped collision volume. * * Defaults to "box". * @property {pc.Vec3} halfExtents The half-extents of the box-shaped collision volume in the * x, y and z axes. Defaults to [0.5, 0.5, 0.5]. * @property {number} radius The radius of the sphere, capsule, cylinder or cone-shaped collision * volumes. Defaults to 0.5. * @property {number} axis The local space axis with which the capsule, cylinder or cone-shaped * collision volume's length is aligned. 0 for X, 1 for Y and 2 for Z. Defaults to 1 (Y-axis). * @property {number} height The total height of the capsule, cylinder or cone-shaped collision * volume from tip to tip. Defaults to 2. * @property {pc.Asset} asset The asset for the model of the mesh collision volume - can also be * an asset id. Defaults to null. * @property {pc.Model} model The model that is added to the scene graph for the mesh collision * volume. */ class CollisionComponent extends pc.Component { constructor(system: pc.CollisionComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The type of the collision volume. Can be: * "box": A box-shaped collision volume. * "capsule": A capsule-shaped collision volume. * "compound": A compound shape. Any descendent entities with a collision component of type box, capsule, cone, cylinder or sphere will be combined into a single, rigid shape. * "cone": A cone-shaped collision volume. * "cylinder": A cylinder-shaped collision volume. * "mesh": A collision volume that uses a model asset as its shape. * "sphere": A sphere-shaped collision volume. Defaults to "box". */ type: string; /** * The half-extents of the box-shaped collision volume in the x, y and z axes. Defaults to [0.5, 0.5, 0.5]. */ halfExtents: pc.Vec3; /** * The radius of the sphere, capsule, cylinder or cone-shaped collision volumes. Defaults to 0.5. */ radius: number; /** * The local space axis with which the capsule, cylinder or cone-shaped collision volume's length is aligned. 0 for X, 1 for Y and 2 for Z. Defaults to 1 (Y-axis). */ axis: number; /** * The total height of the capsule, cylinder or cone-shaped collision volume from tip to tip. Defaults to 2. */ height: number; /** * The asset for the model of the mesh collision volume - can also be an asset id. Defaults to null. */ asset: pc.Asset; /** * The model that is added to the scene graph for the mesh collision volume. */ model: pc.Model; } /** * @class * @name pc.CollisionComponentSystem * @augments pc.ComponentSystem * @classdesc Manages creation of {@link pc.CollisionComponent}s. * @description Creates a new CollisionComponentSystem. * @param {pc.Application} app - The running {pc.Application}. */ class CollisionComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.Component * @augments pc.EventHandler * @classdesc Components are used to attach functionality on a {@link pc.Entity}. Components * can receive update events each frame, and expose properties to the PlayCanvas Editor. * @description Base constructor for a Component. * @param {pc.ComponentSystem} system - The ComponentSystem used to create this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {pc.ComponentSystem} system The ComponentSystem used to create this Component. * @property {pc.Entity} entity The Entity that this Component is attached to. * @property {boolean} enabled Enables or disables the component. */ class Component extends pc.EventHandler { constructor(system: pc.ComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The ComponentSystem used to create this Component. */ system: pc.ComponentSystem; /** * The Entity that this Component is attached to. */ entity: pc.Entity; /** * Enables or disables the component. */ enabled: boolean; } /** * @constant * @type {string} * @name pc.ELEMENTTYPE_GROUP * @description A {@link pc.ElementComponent} that contains child {@link pc.ElementComponent}s. */ const ELEMENTTYPE_GROUP: string; /** * @constant * @type {string} * @name pc.ELEMENTTYPE_IMAGE * @description A {@link pc.ElementComponent} that displays an image. */ const ELEMENTTYPE_IMAGE: string; /** * @constant * @type {string} * @name pc.ELEMENTTYPE_TEXT * @description A {@link pc.ElementComponent} that displays text. */ const ELEMENTTYPE_TEXT: string; /** * @component * @class * @name pc.ElementComponent * @augments pc.Component * @classdesc Enables an Entity to be positioned using anchors and screen coordinates under a {@link pc.ScreenComponent} or under other ElementComponents. * Depending on its type it can be used to render images, text or just as a layout mechanism to build 2D and 3D user interfaces. * If the component is a descendant of a {@link pc.ScreenComponent}, then the Entity's {@link pc.Entity.setLocalPosition} is in the {@link pc.ScreenComponent}'s coordinate system. * @param {pc.ElementComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {string} type The type of the ElementComponent. Can be: * * * {@link pc.ELEMENTTYPE_GROUP}: The component can be used as a layout mechanism to create groups of ElementComponents e.g. panels. * * {@link pc.ELEMENTTYPE_IMAGE}: The component will render an image * * {@link pc.ELEMENTTYPE_TEXT}: The component will render text * * @property {pc.Entity} screen The Entity with a {@link pc.ScreenComponent} that this component belongs to. This is automatically set when the component is a child of a ScreenComponent. * @property {number} drawOrder The draw order of the component. A higher value means that the component will be rendered on top of other components. * @property {pc.Vec4} anchor Specifies where the left, bottom, right and top edges of the component are anchored relative to its parent. Each value * ranges from 0 to 1. E.g. a value of [0,0,0,0] means that the element will be anchored to the bottom left of its parent. A value of [1, 1, 1, 1] means * it will be anchored to the top right. A split anchor is when the left-right or top-bottom pairs of the anchor are not equal. In that case the component will be resized to cover that entire area. E.g. a value of [0,0,1,1] will make the component resize exactly as its parent. * @property {pc.Vec2} pivot The position of the pivot of the component relative to its anchor. Each value ranges from 0 to 1 where [0,0] is the bottom left and [1,1] is the top right. * @property {pc.Vec4} margin The distance from the left, bottom, right and top edges of the anchor. For example if we are using a split anchor like [0,0,1,1] and the margin is [0,0,0,0] then the component will be the same width and height as its parent. * @property {number} left The distance from the left edge of the anchor. Can be used in combination with a split anchor to make the component's left edge always be 'left' units away from the left. * @property {number} right The distance from the right edge of the anchor. Can be used in combination with a split anchor to make the component's right edge always be 'right' units away from the right. * @property {number} bottom The distance from the bottom edge of the anchor. Can be used in combination with a split anchor to make the component's top edge always be 'top' units away from the top. * @property {number} top The distance from the top edge of the anchor. Can be used in combination with a split anchor to make the component's bottom edge always be 'bottom' units away from the bottom. * @property {number} width The width of the element as set in the editor. Note that in some cases this may not reflect the true width at which the element is rendered, such as when the element is under the control of a {@link pc.LayoutGroupComponent}. See `calculatedWidth` in order to ensure you are reading the true width at which the element will be rendered. * @property {number} height The height of the element as set in the editor. Note that in some cases this may not reflect the true height at which the element is rendered, such as when the element is under the control of a {@link pc.LayoutGroupComponent}. See `calculatedHeight` in order to ensure you are reading the true height at which the element will be rendered. * @property {number} calculatedWidth The width at which the element will be rendered. In most cases this will be the same as `width`. However, in some cases the engine may calculate a different width for the element, such as when the element is under the control of a {@link pc.LayoutGroupComponent}. In these scenarios, `calculatedWidth` may be smaller or larger than the width that was set in the editor. * @property {number} calculatedHeight The height at which the element will be rendered. In most cases this will be the same as `height`. However, in some cases the engine may calculate a different height for the element, such as when the element is under the control of a {@link pc.LayoutGroupComponent}. In these scenarios, `calculatedHeight` may be smaller or larger than the height that was set in the editor. * @property {pc.Vec3[]} screenCorners An array of 4 {@link pc.Vec3}s that represent the bottom left, bottom right, top right and top left corners of the component relative to its parent {@link pc.ScreenComponent}. * @property {pc.Vec3[]} worldCorners An array of 4 {@link pc.Vec3}s that represent the bottom left, bottom right, top right and top left corners of the component in world space. Only works for 3D ElementComponents. * @property {pc.Vec2[]} canvasCorners An array of 4 {@link pc.Vec2}s that represent the bottom left, bottom right, top right and top left corners of the component in canvas pixels. Only works for screen space ElementComponents. * @property {boolean} useInput If true then the component will receive Mouse or Touch input events. * @property {pc.Color} color The color of the image for {@link pc.ELEMENTTYPE_IMAGE} types or the color of the text for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} opacity The opacity of the image for {@link pc.ELEMENTTYPE_IMAGE} types or the text for {@link pc.ELEMENTTYPE_TEXT} types. * @property {pc.Color} outlineColor The text outline effect color and opacity. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} outlineThickness The width of the text outline effect. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {pc.Color} shadowColor The text shadow effect color and opacity. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {pc.Vec2} shadowOffset The text shadow effect shift amount from original text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} textWidth The width of the text rendered by the component. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} textHeight The height of the text rendered by the component. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} autoWidth Automatically set the width of the component to be the same as the textWidth. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} autoHeight Automatically set the height of the component to be the same as the textHeight. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} fontAsset The id of the font asset used for rendering the text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {pc.Font} font The font used for rendering the text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} fontSize The size of the font. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {boolean} autoFitWidth When true the font size and line height will scale so that the text fits inside the width of the Element. The font size will be scaled between minFontSize and maxFontSize. The value of autoFitWidth will be ignored if autoWidth is true. * @property {boolean} autoFitHeight When true the font size and line height will scale so that the text fits inside the height of the Element. The font size will be scaled between minFontSize and maxFontSize. The value of autoFitHeight will be ignored if autoHeight is true. * @property {number} minFontSize The minimum size that the font can scale to when autoFitWidth or autoFitHeight are true. * @property {number} maxFontSize The maximum size that the font can scale to when autoFitWidth or autoFitHeight are true. * @property {number} spacing The spacing between the letters of the text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} lineHeight The height of each line of text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {boolean} wrapLines Whether to automatically wrap lines based on the element width. Only works for {@link pc.ELEMENTTYPE_TEXT} types, and when autoWidth is set to false. * @property {number} maxLines The maximum number of lines that the Element can wrap to. Any leftover text will be appended to the last line. Set this to null to allow unlimited lines. * @property {pc.Vec2} alignment The horizontal and vertical alignment of the text. Values range from 0 to 1 where [0,0] is the bottom left and [1,1] is the top right. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {string} text The text to render. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {string} key The localization key to use to get the localized text from {@link pc.Application#i18n}. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} textureAsset The id of the texture asset to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. * @property {pc.Texture} texture The texture to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. * @property {number} spriteAsset The id of the sprite asset to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types which can render either a texture or a sprite. * @property {pc.Sprite} sprite The sprite to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types which can render either a texture or a sprite. * @property {number} spriteFrame The frame of the sprite to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types who have a sprite assigned. * @property {number} pixelsPerUnit The number of pixels that map to one PlayCanvas unit. Only works for {@link pc.ELEMENTTYPE_IMAGE} types who have a sliced sprite assigned. * @property {number} materialAsset The id of the material asset to use when rendering an image. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. * @property {pc.Material} material The material to use when rendering an image. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. * @property {pc.Vec4} rect Specifies which region of the texture to use in order to render an image. Values range from 0 to 1 and indicate u, v, width, height. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. * @property {boolean} rtlReorder Reorder the text for RTL languages using a function registered by `app.systems.element.registerUnicodeConverter`. * @property {boolean} unicodeConverter Convert unicode characters using a function registered by `app.systems.element.registerUnicodeConverter`. * @property {number} batchGroupId Assign element to a specific batch group (see {@link pc.BatchGroup}). Default value is -1 (no group). * @property {number[]} layers An array of layer IDs ({@link pc.Layer#id}) to which this element should belong. * Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. * @property {boolean} enableMarkup Flag for enabling markup processing. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} rangeStart Index of the first character to render. Only works for {@link pc.ELEMENTTYPE_TEXT} types. * @property {number} rangeEnd Index of the last character to render. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ class ElementComponent extends pc.Component { constructor(system: pc.ElementComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The type of the ElementComponent. Can be: * {@link pc.ELEMENTTYPE_GROUP}: The component can be used as a layout mechanism to create groups of ElementComponents e.g. panels. * {@link pc.ELEMENTTYPE_IMAGE}: The component will render an image * {@link pc.ELEMENTTYPE_TEXT}: The component will render text */ type: string; /** * The Entity with a {@link pc.ScreenComponent} that this component belongs to. This is automatically set when the component is a child of a ScreenComponent. */ screen: pc.Entity; /** * The draw order of the component. A higher value means that the component will be rendered on top of other components. */ drawOrder: number; /** * Specifies where the left, bottom, right and top edges of the component are anchored relative to its parent. Each value ranges from 0 to 1. E.g. a value of [0,0,0,0] means that the element will be anchored to the bottom left of its parent. A value of [1, 1, 1, 1] means it will be anchored to the top right. A split anchor is when the left-right or top-bottom pairs of the anchor are not equal. In that case the component will be resized to cover that entire area. E.g. a value of [0,0,1,1] will make the component resize exactly as its parent. */ anchor: pc.Vec4; /** * The position of the pivot of the component relative to its anchor. Each value ranges from 0 to 1 where [0,0] is the bottom left and [1,1] is the top right. */ pivot: pc.Vec2; /** * The distance from the left, bottom, right and top edges of the anchor. For example if we are using a split anchor like [0,0,1,1] and the margin is [0,0,0,0] then the component will be the same width and height as its parent. */ margin: pc.Vec4; /** * The distance from the left edge of the anchor. Can be used in combination with a split anchor to make the component's left edge always be 'left' units away from the left. */ left: number; /** * The distance from the right edge of the anchor. Can be used in combination with a split anchor to make the component's right edge always be 'right' units away from the right. */ right: number; /** * The distance from the bottom edge of the anchor. Can be used in combination with a split anchor to make the component's top edge always be 'top' units away from the top. */ bottom: number; /** * The distance from the top edge of the anchor. Can be used in combination with a split anchor to make the component's bottom edge always be 'bottom' units away from the bottom. */ top: number; /** * The width of the element as set in the editor. Note that in some cases this may not reflect the true width at which the element is rendered, such as when the element is under the control of a {@link pc.LayoutGroupComponent}. See `calculatedWidth` in order to ensure you are reading the true width at which the element will be rendered. */ width: number; /** * The height of the element as set in the editor. Note that in some cases this may not reflect the true height at which the element is rendered, such as when the element is under the control of a {@link pc.LayoutGroupComponent}. See `calculatedHeight` in order to ensure you are reading the true height at which the element will be rendered. */ height: number; /** * The width at which the element will be rendered. In most cases this will be the same as `width`. However, in some cases the engine may calculate a different width for the element, such as when the element is under the control of a {@link pc.LayoutGroupComponent}. In these scenarios, `calculatedWidth` may be smaller or larger than the width that was set in the editor. */ calculatedWidth: number; /** * The height at which the element will be rendered. In most cases this will be the same as `height`. However, in some cases the engine may calculate a different height for the element, such as when the element is under the control of a {@link pc.LayoutGroupComponent}. In these scenarios, `calculatedHeight` may be smaller or larger than the height that was set in the editor. */ calculatedHeight: number; /** * An array of 4 {@link pc.Vec3}s that represent the bottom left, bottom right, top right and top left corners of the component relative to its parent {@link pc.ScreenComponent}. */ screenCorners: pc.Vec3[]; /** * An array of 4 {@link pc.Vec3}s that represent the bottom left, bottom right, top right and top left corners of the component in world space. Only works for 3D ElementComponents. */ worldCorners: pc.Vec3[]; /** * An array of 4 {@link pc.Vec2}s that represent the bottom left, bottom right, top right and top left corners of the component in canvas pixels. Only works for screen space ElementComponents. */ canvasCorners: pc.Vec2[]; /** * If true then the component will receive Mouse or Touch input events. */ useInput: boolean; /** * The color of the image for {@link pc.ELEMENTTYPE_IMAGE} types or the color of the text for {@link pc.ELEMENTTYPE_TEXT} types. */ color: pc.Color; /** * The opacity of the image for {@link pc.ELEMENTTYPE_IMAGE} types or the text for {@link pc.ELEMENTTYPE_TEXT} types. */ opacity: number; /** * The text outline effect color and opacity. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ outlineColor: pc.Color; /** * The width of the text outline effect. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ outlineThickness: number; /** * The text shadow effect color and opacity. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ shadowColor: pc.Color; /** * The text shadow effect shift amount from original text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ shadowOffset: pc.Vec2; /** * The width of the text rendered by the component. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ textWidth: number; /** * The height of the text rendered by the component. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ textHeight: number; /** * Automatically set the width of the component to be the same as the textWidth. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ autoWidth: number; /** * Automatically set the height of the component to be the same as the textHeight. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ autoHeight: number; /** * The id of the font asset used for rendering the text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ fontAsset: number; /** * The font used for rendering the text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ font: pc.Font; /** * The size of the font. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ fontSize: number; /** * When true the font size and line height will scale so that the text fits inside the width of the Element. The font size will be scaled between minFontSize and maxFontSize. The value of autoFitWidth will be ignored if autoWidth is true. */ autoFitWidth: boolean; /** * When true the font size and line height will scale so that the text fits inside the height of the Element. The font size will be scaled between minFontSize and maxFontSize. The value of autoFitHeight will be ignored if autoHeight is true. */ autoFitHeight: boolean; /** * The minimum size that the font can scale to when autoFitWidth or autoFitHeight are true. */ minFontSize: number; /** * The maximum size that the font can scale to when autoFitWidth or autoFitHeight are true. */ maxFontSize: number; /** * The spacing between the letters of the text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ spacing: number; /** * The height of each line of text. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ lineHeight: number; /** * Whether to automatically wrap lines based on the element width. Only works for {@link pc.ELEMENTTYPE_TEXT} types, and when autoWidth is set to false. */ wrapLines: boolean; /** * The maximum number of lines that the Element can wrap to. Any leftover text will be appended to the last line. Set this to null to allow unlimited lines. */ maxLines: number; /** * The horizontal and vertical alignment of the text. Values range from 0 to 1 where [0,0] is the bottom left and [1,1] is the top right. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ alignment: pc.Vec2; /** * The text to render. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ text: string; /** * The localization key to use to get the localized text from {@link pc.Application#i18n}. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ key: string; /** * The id of the texture asset to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. */ textureAsset: number; /** * The texture to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. */ texture: pc.Texture; /** * The id of the sprite asset to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types which can render either a texture or a sprite. */ spriteAsset: number; /** * The sprite to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types which can render either a texture or a sprite. */ sprite: pc.Sprite; /** * The frame of the sprite to render. Only works for {@link pc.ELEMENTTYPE_IMAGE} types who have a sprite assigned. */ spriteFrame: number; /** * The number of pixels that map to one PlayCanvas unit. Only works for {@link pc.ELEMENTTYPE_IMAGE} types who have a sliced sprite assigned. */ pixelsPerUnit: number; /** * The id of the material asset to use when rendering an image. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. */ materialAsset: number; /** * The material to use when rendering an image. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. */ material: pc.Material; /** * Specifies which region of the texture to use in order to render an image. Values range from 0 to 1 and indicate u, v, width, height. Only works for {@link pc.ELEMENTTYPE_IMAGE} types. */ rect: pc.Vec4; /** * Reorder the text for RTL languages using a function registered by `app.systems.element.registerUnicodeConverter`. */ rtlReorder: boolean; /** * Convert unicode characters using a function registered by `app.systems.element.registerUnicodeConverter`. */ unicodeConverter: boolean; /** * Assign element to a specific batch group (see {@link pc.BatchGroup}). Default value is -1 (no group). */ batchGroupId: number; /** * An array of layer IDs ({@link pc.Layer#id}) to which this element should belong. Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ layers: number[]; /** * Flag for enabling markup processing. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ enableMarkup: boolean; /** * Index of the first character to render. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ rangeStart: number; /** * Index of the last character to render. Only works for {@link pc.ELEMENTTYPE_TEXT} types. */ rangeEnd: number; } /** * @component * @class * @name pc.ElementDragHelper * @augments pc.EventHandler * @description Create a new ElementDragHelper. * @classdesc Helper class that makes it easy to create Elements that can be dragged by the mouse or touch. * @param {pc.ElementComponent} element - The Element that should become draggable. * @param {string} [axis] - Optional axis to constrain to, either 'x', 'y' or null. */ class ElementDragHelper extends pc.EventHandler { constructor(element: pc.ElementComponent, axis?: string); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.ElementComponentSystem * @augments pc.ComponentSystem * @classdesc Manages creation of {@link pc.ElementComponent}s. * @param {pc.Application} app - The application. */ class ElementComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.LayoutChildComponent * @augments pc.Component * @description Create a new LayoutChildComponent. * @classdesc A LayoutChildComponent enables the Entity to control the sizing applied to it by its parent {@link pc.LayoutGroupComponent}. * @param {pc.LayoutChildComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {number} minWidth The minimum width the element should be rendered at. * @property {number} minHeight The minimum height the element should be rendered at. * @property {number} maxWidth The maximum width the element should be rendered at. * @property {number} maxHeight The maximum height the element should be rendered at. * @property {number} fitWidthProportion The amount of additional horizontal space that the element should take up, if necessary to satisfy a Stretch/Shrink fitting calculation. This is specified as a proportion, taking into account the proportion values of other siblings. * @property {number} fitHeightProportion The amount of additional vertical space that the element should take up, if necessary to satisfy a Stretch/Shrink fitting calculation. This is specified as a proportion, taking into account the proportion values of other siblings. * @property {number} excludeFromLayout If set to true, the child will be excluded from all layout calculations. */ class LayoutChildComponent extends pc.Component { constructor(system: pc.LayoutChildComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The minimum width the element should be rendered at. */ minWidth: number; /** * The minimum height the element should be rendered at. */ minHeight: number; /** * The maximum width the element should be rendered at. */ maxWidth: number; /** * The maximum height the element should be rendered at. */ maxHeight: number; /** * The amount of additional horizontal space that the element should take up, if necessary to satisfy a Stretch/Shrink fitting calculation. This is specified as a proportion, taking into account the proportion values of other siblings. */ fitWidthProportion: number; /** * The amount of additional vertical space that the element should take up, if necessary to satisfy a Stretch/Shrink fitting calculation. This is specified as a proportion, taking into account the proportion values of other siblings. */ fitHeightProportion: number; /** * If set to true, the child will be excluded from all layout calculations. */ excludeFromLayout: number; } /** * @class * @name pc.LayoutChildComponentSystem * @augments pc.ComponentSystem * @description Create a new LayoutChildComponentSystem. * @classdesc Manages creation of {@link pc.LayoutChildComponent}s. * @param {pc.Application} app - The application. */ class LayoutChildComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.LayoutGroupComponent * @augments pc.Component * @description Create a new LayoutGroupComponent. * @classdesc A LayoutGroupComponent enables the Entity to position and scale child * {@link pc.ElementComponent}s according to configurable layout rules. * @param {pc.LayoutGroupComponentSystem} system - The ComponentSystem that created * this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {number} orientation Whether the layout should run horizontally or * vertically. Can be: * * * {@link pc.ORIENTATION_HORIZONTAL} * * {@link pc.ORIENTATION_VERTICAL} * * Defaults to pc.ORIENTATION_HORIZONTAL. * @property {boolean} reverseX Reverses the order of children along the x axis. * Defaults to false. * @property {boolean} reverseY Reverses the order of children along the y axis. * Defaults to true. * @property {pc.Vec2} alignment Specifies the horizontal and vertical alignment of * child elements. Values range from 0 to 1 where [0, 0] is the bottom left and * [1, 1] is the top right. Defaults to [0, 1]. * @property {pc.Vec4} padding Padding to be applied inside the container before * positioning any children. Specified as left, bottom, right and top values. * Defaults to [0, 0, 0, 0] (no padding). * @property {pc.Vec2} spacing Spacing to be applied between each child element. * Defaults to [0, 0] (no spacing). * @property {number} widthFitting Fitting logic to be applied when positioning and * scaling child elements. Can be: * * * {@link pc.FITTING_NONE}: Child elements will be rendered at their natural size. * * {@link pc.FITTING_STRETCH}: When the natural size of all child elements does not * fill the width of the container, children will be stretched to fit. The rules for how * each child will be stretched are outlined below: * 1. Sum the {@link pc.LayoutChildComponent#fitWidthProportion} values of each child * and normalize so that all values sum to 1. * 2. Apply the natural width of each child. * 3. If there is space remaining in the container, distribute it to each child based * on the normalized {@link pc.LayoutChildComponent#fitWidthProportion} values, but do * not exceed the {@link pc.LayoutChildComponent#maxWidth} of each child. * * {@link pc.FITTING_SHRINK}: When the natural size of all child elements overflows the * width of the container, children will be shrunk to fit. The rules for how each child * will be stretched are outlined below: * 1. Sum the {@link pc.LayoutChildComponent#fitWidthProportion} values of each child * and normalize so that all values sum to 1. * 2. Apply the natural width of each child. * 3. If the new total width of all children exceeds the available space of the * container, reduce each child's width proportionally based on the normalized {@link * pc.LayoutChildComponent#fitWidthProportion} values, but do not exceed the {@link * pc.LayoutChildComponent#minWidth} of each child. * * {@link pc.FITTING_BOTH}: Applies both STRETCH and SHRINK logic as necessary. * * Defaults to pc.FITTING_NONE. * @property {number} heightFitting Identical to {@link pc.LayoutGroupComponent#widthFitting} * but for the Y axis. Defaults to pc.FITTING_NONE. * @property {boolean} wrap Whether or not to wrap children onto a new row/column when the * size of the container is exceeded. Defaults to false, which means that children will be * be rendered in a single row (horizontal orientation) or column (vertical orientation). * Note that setting wrap to true makes it impossible for the {@link pc.FITTING_BOTH} * fitting mode to operate in any logical manner. For this reason, when wrap is true, a * {@link pc.LayoutGroupComponent#widthFitting} or {@link pc.LayoutGroupComponent#heightFitting} * mode of {@link pc.FITTING_BOTH} will be coerced to {@link pc.FITTING_STRETCH}. */ class LayoutGroupComponent extends pc.Component { constructor(system: pc.LayoutGroupComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Whether the layout should run horizontally or vertically. Can be: * {@link pc.ORIENTATION_HORIZONTAL} * {@link pc.ORIENTATION_VERTICAL} Defaults to pc.ORIENTATION_HORIZONTAL. */ orientation: number; /** * Reverses the order of children along the x axis. Defaults to false. */ reverseX: boolean; /** * Reverses the order of children along the y axis. Defaults to true. */ reverseY: boolean; /** * Specifies the horizontal and vertical alignment of child elements. Values range from 0 to 1 where [0, 0] is the bottom left and [1, 1] is the top right. Defaults to [0, 1]. */ alignment: pc.Vec2; /** * Padding to be applied inside the container before positioning any children. Specified as left, bottom, right and top values. Defaults to [0, 0, 0, 0] (no padding). */ padding: pc.Vec4; /** * Spacing to be applied between each child element. Defaults to [0, 0] (no spacing). */ spacing: pc.Vec2; /** * Fitting logic to be applied when positioning and scaling child elements. Can be: * {@link pc.FITTING_NONE}: Child elements will be rendered at their natural size. * {@link pc.FITTING_STRETCH}: When the natural size of all child elements does not fill the width of the container, children will be stretched to fit. The rules for how each child will be stretched are outlined below: 1. Sum the {@link pc.LayoutChildComponent#fitWidthProportion} values of each child and normalize so that all values sum to 1. 2. Apply the natural width of each child. 3. If there is space remaining in the container, distribute it to each child based on the normalized {@link pc.LayoutChildComponent#fitWidthProportion} values, but do not exceed the {@link pc.LayoutChildComponent#maxWidth} of each child. * {@link pc.FITTING_SHRINK}: When the natural size of all child elements overflows the width of the container, children will be shrunk to fit. The rules for how each child will be stretched are outlined below: 1. Sum the {@link pc.LayoutChildComponent#fitWidthProportion} values of each child and normalize so that all values sum to 1. 2. Apply the natural width of each child. 3. If the new total width of all children exceeds the available space of the container, reduce each child's width proportionally based on the normalized {@link pc.LayoutChildComponent#fitWidthProportion} values, but do not exceed the {@link pc.LayoutChildComponent#minWidth} of each child. * {@link pc.FITTING_BOTH}: Applies both STRETCH and SHRINK logic as necessary. Defaults to pc.FITTING_NONE. */ widthFitting: number; /** * Identical to {@link pc.LayoutGroupComponent#widthFitting} but for the Y axis. Defaults to pc.FITTING_NONE. */ heightFitting: number; /** * Whether or not to wrap children onto a new row/column when the size of the container is exceeded. Defaults to false, which means that children will be be rendered in a single row (horizontal orientation) or column (vertical orientation). Note that setting wrap to true makes it impossible for the {@link pc.FITTING_BOTH} fitting mode to operate in any logical manner. For this reason, when wrap is true, a {@link pc.LayoutGroupComponent#widthFitting} or {@link pc.LayoutGroupComponent#heightFitting} mode of {@link pc.FITTING_BOTH} will be coerced to {@link pc.FITTING_STRETCH}. */ wrap: boolean; } /** * @constant * @type {number} * @name pc.FITTING_NONE * @description Disable all fitting logic. */ const FITTING_NONE: number; /** * @constant * @type {number} * @name pc.FITTING_STRETCH * @description Stretch child elements to fit the parent container. */ const FITTING_STRETCH: number; /** * @constant * @type {number} * @name pc.FITTING_SHRINK * @description Shrink child elements to fit the parent container. */ const FITTING_SHRINK: number; /** * @constant * @type {number} * @name pc.FITTING_BOTH * @description Apply both STRETCH and SHRINK fitting logic where applicable. */ const FITTING_BOTH: number; /** * @class * @name pc.LayoutGroupComponentSystem * @augments pc.ComponentSystem * @description Create a new LayoutGroupComponentSystem. * @classdesc Manages creation of {@link pc.LayoutGroupComponent}s. * @param {pc.Application} app - The application. */ class LayoutGroupComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.LightComponent * @augments pc.Component * @classdesc The Light Component enables the Entity to light the scene. There are three types * of light: directional, point and spot. Directional lights are global in that they are * considered to be infinitely far away and light the entire scene. Point and spot lights * are local in that they have a position and a range. A spot light is a specialization of * a point light where light is emitted in a cone rather than in all directions. Lights * also have the ability to cast shadows to add realism to your scenes. * @description Creates a new Light Component. * @param {pc.LightComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @example * // Add a pc.LightComponent to an entity * var entity = new pc.Entity(); * entity.addComponent('light', { * type: "point", * color: new pc.Color(1, 0, 0), * range: 10 * }); * @example * // Get the pc.LightComponent on an entity * var lightComponent = entity.light; * @example * // Update a property on a light component * entity.light.range = 20; * @property {string} type The type of light. Can be: * * "directional": A light that is infinitely far away and lights the entire scene from one direction. * * "point": A light that illuminates in all directions from a point. * * "spot": A light that illuminates in all directions from a point and is bounded by a cone. * Defaults to "directional". * @property {pc.Color} color The Color of the light. The alpha component of the color is * ignored. Defaults to white (1, 1, 1). * @property {number} intensity The brightness of the light. Defaults to 1. * @property {boolean} castShadows If enabled the light will cast shadows. Defaults to false. * @property {number} shadowDistance The distance from the viewpoint beyond which shadows * are no longer rendered. Affects directional lights only. Defaults to 40. * @property {number} shadowResolution The size of the texture used for the shadow map. * Valid sizes are 64, 128, 256, 512, 1024, 2048. Defaults to 1024. * @property {number} shadowBias The depth bias for tuning the appearance of the shadow * mapping generated by this light. Defaults to 0.05. * @property {number} normalOffsetBias Normal offset depth bias. Defaults to 0. * @property {number} range The range of the light. Affects point and spot lights only. * Defaults to 10. * @property {number} innerConeAngle The angle at which the spotlight cone starts * to fade off. The angle is specified in degrees. Affects spot lights only. Defaults * to 40. * @property {number} outerConeAngle The angle at which the spotlight cone has faded * to nothing. The angle is specified in degrees. Affects spot lights only. Defaults * to 45. * @property {number} falloffMode Controls the rate at which a light attentuates from * its position. Can be: * * {@link pc.LIGHTFALLOFF_LINEAR}: Linear. * * {@link pc.LIGHTFALLOFF_INVERSESQUARED}: Inverse squared. * Affects point and spot lights only. Defaults to pc.LIGHTFALLOFF_LINEAR. * @property {number} mask Defines a mask to determine which {@link pc.MeshInstance}s are * lit by this light. Defaults to 1. * @property {boolean} affectDynamic If enabled the light will affect non-lightmapped objects * @property {boolean} affectLightmapped If enabled the light will affect lightmapped objects * @property {boolean} bake If enabled the light will be rendered into lightmaps * @property {boolean} bakeDir If enabled and bake=true, the light's direction will contribute to directional lightmaps. * Be aware, that directional lightmap is an approximation and can only hold single direction per pixel. * Intersecting multiple lights with bakeDir=true may lead to incorrect look of specular/bump-mapping in the area of intersection. * The error is not always visible though, and highly scene-dependent. * @property {number} shadowUpdateMode Tells the renderer how often shadows must be updated for this light. Options: * * {@link pc.SHADOWUPDATE_NONE}: Don't render shadows. * * {@link pc.SHADOWUPDATE_THISFRAME}: Render shadows only once (then automatically switches to pc.SHADOWUPDATE_NONE). * * {@link pc.SHADOWUPDATE_REALTIME}: Render shadows every frame (default). * @property {number} shadowType Type of shadows being rendered by this light. Options: * * {@link pc.SHADOW_PCF3}: Render depth (color-packed on WebGL 1.0), can be used for PCF 3x3 sampling. * * {@link pc.SHADOW_VSM8}: Render packed variance shadow map. All shadow receivers must also cast shadows for this mode to work correctly. * * {@link pc.SHADOW_VSM16}: Render 16-bit exponential variance shadow map. Requires OES_texture_half_float extension. Falls back to pc.SHADOW_VSM8, if not supported. * * {@link pc.SHADOW_VSM32}: Render 32-bit exponential variance shadow map. Requires OES_texture_float extension. Falls back to pc.SHADOW_VSM16, if not supported. * * {@link pc.SHADOW_PCF5}: Render depth buffer only, can be used for hardware-accelerated PCF 5x5 sampling. Requires WebGL2. Falls back to pc.SHADOW_PCF3 on WebGL 1.0. * @property {number} vsmBlurMode Blurring mode for variance shadow maps: * * {@link pc.BLUR_BOX}: Box filter. * * {@link pc.BLUR_GAUSSIAN}: Gaussian filter. May look smoother than box, but requires more samples. * @property {number} vsmBlurSize Number of samples used for blurring a variance shadow map. Only uneven numbers work, even are incremented. Minimum value is 1, maximum is 25. * @property {number} cookieAsset Asset that has texture that will be assigned to cookie internally once asset resource is available. * @property {pc.Texture} cookie Projection texture. Must be 2D for spot and cubemap for point (ignored if incorrect type is used). * @property {number} cookieIntensity Projection texture intensity (default is 1). * @property {boolean} cookieFalloff Toggle normal spotlight falloff when projection texture is used. When set to false, spotlight will work like a pure texture projector (only fading with distance). Default is false. * @property {string} cookieChannel Color channels of the projection texture to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * @property {number} cookieAngle Angle for spotlight cookie rotation. * @property {pc.Vec2} cookieScale Spotlight cookie scale. * @property {pc.Vec2} cookieOffset Spotlight cookie position offset. * @property {boolean} isStatic Mark light as non-movable (optimization) * @property {number[]} layers An array of layer IDs ({@link pc.Layer#id}) to which this light should belong. * Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ class LightComponent extends pc.Component { constructor(system: pc.LightComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The type of light. Can be: * "directional": A light that is infinitely far away and lights the entire scene from one direction. * "point": A light that illuminates in all directions from a point. * "spot": A light that illuminates in all directions from a point and is bounded by a cone. Defaults to "directional". */ type: string; /** * The Color of the light. The alpha component of the color is ignored. Defaults to white (1, 1, 1). */ color: pc.Color; /** * The brightness of the light. Defaults to 1. */ intensity: number; /** * If enabled the light will cast shadows. Defaults to false. */ castShadows: boolean; /** * The distance from the viewpoint beyond which shadows are no longer rendered. Affects directional lights only. Defaults to 40. */ shadowDistance: number; /** * The size of the texture used for the shadow map. Valid sizes are 64, 128, 256, 512, 1024, 2048. Defaults to 1024. */ shadowResolution: number; /** * The depth bias for tuning the appearance of the shadow mapping generated by this light. Defaults to 0.05. */ shadowBias: number; /** * Normal offset depth bias. Defaults to 0. */ normalOffsetBias: number; /** * The range of the light. Affects point and spot lights only. Defaults to 10. */ range: number; /** * The angle at which the spotlight cone starts to fade off. The angle is specified in degrees. Affects spot lights only. Defaults to 40. */ innerConeAngle: number; /** * The angle at which the spotlight cone has faded to nothing. The angle is specified in degrees. Affects spot lights only. Defaults to 45. */ outerConeAngle: number; /** * Controls the rate at which a light attentuates from its position. Can be: * {@link pc.LIGHTFALLOFF_LINEAR}: Linear. * {@link pc.LIGHTFALLOFF_INVERSESQUARED}: Inverse squared. Affects point and spot lights only. Defaults to pc.LIGHTFALLOFF_LINEAR. */ falloffMode: number; /** * Defines a mask to determine which {@link pc.MeshInstance}s are lit by this light. Defaults to 1. */ mask: number; /** * If enabled the light will affect non-lightmapped objects */ affectDynamic: boolean; /** * If enabled the light will affect lightmapped objects */ affectLightmapped: boolean; /** * If enabled the light will be rendered into lightmaps */ bake: boolean; /** * If enabled and bake=true, the light's direction will contribute to directional lightmaps. Be aware, that directional lightmap is an approximation and can only hold single direction per pixel. Intersecting multiple lights with bakeDir=true may lead to incorrect look of specular/bump-mapping in the area of intersection. The error is not always visible though, and highly scene-dependent. */ bakeDir: boolean; /** * Tells the renderer how often shadows must be updated for this light. Options: * {@link pc.SHADOWUPDATE_NONE}: Don't render shadows. * {@link pc.SHADOWUPDATE_THISFRAME}: Render shadows only once (then automatically switches to pc.SHADOWUPDATE_NONE). * {@link pc.SHADOWUPDATE_REALTIME}: Render shadows every frame (default). */ shadowUpdateMode: number; /** * Type of shadows being rendered by this light. Options: * {@link pc.SHADOW_PCF3}: Render depth (color-packed on WebGL 1.0), can be used for PCF 3x3 sampling. * {@link pc.SHADOW_VSM8}: Render packed variance shadow map. All shadow receivers must also cast shadows for this mode to work correctly. * {@link pc.SHADOW_VSM16}: Render 16-bit exponential variance shadow map. Requires OES_texture_half_float extension. Falls back to pc.SHADOW_VSM8, if not supported. * {@link pc.SHADOW_VSM32}: Render 32-bit exponential variance shadow map. Requires OES_texture_float extension. Falls back to pc.SHADOW_VSM16, if not supported. * {@link pc.SHADOW_PCF5}: Render depth buffer only, can be used for hardware-accelerated PCF 5x5 sampling. Requires WebGL2. Falls back to pc.SHADOW_PCF3 on WebGL 1.0. */ shadowType: number; /** * Blurring mode for variance shadow maps: * {@link pc.BLUR_BOX}: Box filter. * {@link pc.BLUR_GAUSSIAN}: Gaussian filter. May look smoother than box, but requires more samples. */ vsmBlurMode: number; /** * Number of samples used for blurring a variance shadow map. Only uneven numbers work, even are incremented. Minimum value is 1, maximum is 25. */ vsmBlurSize: number; /** * Asset that has texture that will be assigned to cookie internally once asset resource is available. */ cookieAsset: number; /** * Projection texture. Must be 2D for spot and cubemap for point (ignored if incorrect type is used). */ cookie: pc.Texture; /** * Projection texture intensity (default is 1). */ cookieIntensity: number; /** * Toggle normal spotlight falloff when projection texture is used. When set to false, spotlight will work like a pure texture projector (only fading with distance). Default is false. */ cookieFalloff: boolean; /** * Color channels of the projection texture to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ cookieChannel: string; /** * Angle for spotlight cookie rotation. */ cookieAngle: number; /** * Spotlight cookie scale. */ cookieScale: pc.Vec2; /** * Spotlight cookie position offset. */ cookieOffset: pc.Vec2; /** * Mark light as non-movable (optimization) */ isStatic: boolean; /** * An array of layer IDs ({@link pc.Layer#id}) to which this light should belong. Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ layers: number[]; } /** * @class * @name pc.LightComponentSystem * @augments pc.ComponentSystem * @classdesc A Light Component is used to dynamically light the scene. * @description Create a new LightComponentSystem. * @param {pc.Application} app - The application. */ class LightComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.ModelComponent * @augments pc.Component * @classdesc Enables an Entity to render a model or a primitive shape. This Component attaches additional model * geometry in to the scene graph below the Entity. * @description Create a new ModelComponent. * @param {pc.ModelComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {string} type The type of the model. Can be one of the following: * * "asset": The component will render a model asset * * "box": The component will render a box (1 unit in each dimension) * * "capsule": The component will render a capsule (radius 0.5, height 2) * * "cone": The component will render a cone (radius 0.5, height 1) * * "cylinder": The component will render a cylinder (radius 0.5, height 1) * * "plane": The component will render a plane (1 unit in each dimension) * * "sphere": The component will render a sphere (radius 0.5) * @property {pc.Asset|number} asset The asset for the model (only applies to models of type 'asset') - can also be an asset id. * @property {boolean} castShadows If true, this model will cast shadows for lights that have shadow casting enabled. * @property {boolean} receiveShadows If true, shadows will be cast on this model. * @property {pc.Material} material The material {@link pc.Material} that will be used to render the model. Setting * this property will apply the material to all mesh instances of the model. * @property {pc.Asset|number} materialAsset The material {@link pc.Asset} that will be used to render the model (not used on models of type 'asset'). * @property {pc.Model} model The model that is added to the scene graph. It can be not set or loaded, so will return null. * @property {object} mapping A dictionary that holds material overrides for each mesh instance. Only applies to model * components of type 'asset'. The mapping contains pairs of mesh instance index - material asset id. * @property {boolean} castShadowsLightmap If true, this model will cast shadows when rendering lightmaps. * @property {boolean} lightmapped If true, this model will be lightmapped after using lightmapper.bake(). * @property {number} lightmapSizeMultiplier Lightmap resolution multiplier. * @property {boolean} isStatic Mark model as non-movable (optimization). * @property {pc.MeshInstance[]} meshInstances An array of meshInstances contained in the component's model. If model is not set or loaded for component it will return null. * @property {number} batchGroupId Assign model to a specific batch group (see {@link pc.BatchGroup}). Default value is -1 (no group). * @property {number[]} layers An array of layer IDs ({@link pc.Layer#id}) to which this model should belong. * Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ class ModelComponent extends pc.Component { constructor(system: pc.ModelComponentSystem, entity: pc.Entity); /** * @function * @name pc.ModelComponent#hide * @description Stop rendering model without removing it from the scene hierarchy. * This method sets the {@link pc.MeshInstance#visible} property of every MeshInstance in the model to false * Note, this does not remove the model or mesh instances from the scene hierarchy or draw call list. * So the model component still incurs some CPU overhead. * @example * this.timer = 0; * this.visible = true; * // ... * // blink model every 0.1 seconds * this.timer += dt; * if (this.timer > 0.1) { * if (!this.visible) { * this.entity.model.show(); * this.visible = true; * } else { * this.entity.model.hide(); * this.visible = false; * } * this.timer = 0; * } */ hide(): void; /** * @function * @name pc.ModelComponent#show * @description Enable rendering of the model if hidden using {@link pc.ModelComponent#hide}. * This method sets all the {@link pc.MeshInstance#visible} property on all mesh instances to true. */ show(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The type of the model. Can be one of the following: * "asset": The component will render a model asset * "box": The component will render a box (1 unit in each dimension) * "capsule": The component will render a capsule (radius 0.5, height 2) * "cone": The component will render a cone (radius 0.5, height 1) * "cylinder": The component will render a cylinder (radius 0.5, height 1) * "plane": The component will render a plane (1 unit in each dimension) * "sphere": The component will render a sphere (radius 0.5) */ type: string; /** * The asset for the model (only applies to models of type 'asset') - can also be an asset id. */ asset: pc.Asset | number; /** * If true, this model will cast shadows for lights that have shadow casting enabled. */ castShadows: boolean; /** * If true, shadows will be cast on this model. */ receiveShadows: boolean; /** * The material {@link pc.Material} that will be used to render the model. Setting this property will apply the material to all mesh instances of the model. */ material: pc.Material; /** * The material {@link pc.Asset} that will be used to render the model (not used on models of type 'asset'). */ materialAsset: pc.Asset | number; /** * The model that is added to the scene graph. It can be not set or loaded, so will return null. */ model: pc.Model; /** * A dictionary that holds material overrides for each mesh instance. Only applies to model components of type 'asset'. The mapping contains pairs of mesh instance index - material asset id. */ mapping: any; /** * If true, this model will cast shadows when rendering lightmaps. */ castShadowsLightmap: boolean; /** * If true, this model will be lightmapped after using lightmapper.bake(). */ lightmapped: boolean; /** * Lightmap resolution multiplier. */ lightmapSizeMultiplier: number; /** * Mark model as non-movable (optimization). */ isStatic: boolean; /** * An array of meshInstances contained in the component's model. If model is not set or loaded for component it will return null. */ meshInstances: pc.MeshInstance[]; /** * Assign model to a specific batch group (see {@link pc.BatchGroup}). Default value is -1 (no group). */ batchGroupId: number; /** * An array of layer IDs ({@link pc.Layer#id}) to which this model should belong. Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ layers: number[]; } /** * @class * @name pc.ModelComponentSystem * @augments pc.ComponentSystem * @classdesc Allows an Entity to render a model or a primitive shape like a box, * capsule, sphere, cylinder, cone etc. * @description Create a new ModelComponentSystem. * @param {pc.Application} app - The Application. */ class ModelComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.ParticleSystemComponent * @augments pc.Component * @classdesc Used to simulate particles and produce renderable particle mesh on either CPU or GPU. * GPU simulation is generally much faster than its CPU counterpart, because it avoids slow CPU-GPU synchronization and takes advantage of many GPU cores. * However, it requires client to support reasonable uniform count, reading from multiple textures in vertex shader and OES_texture_float extension, including rendering into float textures. * Most mobile devices fail to satisfy these requirements, so it's not recommended to simulate thousands of particles on them. GPU version also can't sort particles, so enabling sorting forces CPU mode too. * Particle rotation is specified by a single angle parameter: default billboard particles rotate around camera facing axis, while mesh particles rotate around 2 different view-independent axes. * Most of the simulation parameters are specified with pc.Curve or pc.CurveSet. Curves are interpolated based on each particle's lifetime, therefore parameters are able to change over time. * Most of the curve parameters can also be specified by 2 minimum/maximum curves, this way each particle will pick a random value in-between. * @description Create a new ParticleSystemComponent. * @param {pc.ParticleSystemComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity this Component is attached to. * @property {boolean} autoPlay Controls whether the particle system plays automatically on creation. If set to false, it is necessary to call {@link pc.ParticleSystemComponent#play} for the particle system to play. Defaults to true. * @property {boolean} loop Enables or disables respawning of particles. * @property {boolean} preWarm If enabled, the particle system will be initialized as though it had already completed a full cycle. This only works with looping particle systems. * @property {boolean} lighting If enabled, particles will be lit by ambient and directional lights. * @property {boolean} halfLambert Enabling Half Lambert lighting avoids particles looking too flat in shadowed areas. It is a completely non-physical lighting model but can give more pleasing visual results. * @property {boolean} alignToMotion Orient particles in their direction of motion. * @property {boolean} depthWrite If enabled, the particles will write to the depth buffer. If disabled, the depth buffer is left unchanged and particles will be guaranteed to overwrite one another in the order in which they are rendered. * @property {boolean} noFog Disable fogging. * @property {boolean} localSpace Binds particles to emitter transformation rather then world space. * @property {number} numParticles Maximum number of simulated particles. * @property {number} rate Minimal interval in seconds between particle births. * @property {number} rate2 Maximal interval in seconds between particle births. * @property {number} startAngle Minimal initial Euler angle of a particle. * @property {number} startAngle2 Maximal initial Euler angle of a particle. * @property {number} lifetime The length of time in seconds between a particle's birth and its death. * @property {number} stretch A value in world units that controls the amount by which particles are stretched based on their velocity. Particles are stretched from their center towards their previous position. * @property {number} intensity Color multiplier. * @property {boolean} animLoop Controls whether the sprite sheet animation plays once or loops continuously. * @property {number} animTilesX Number of horizontal tiles in the sprite sheet. * @property {number} animTilesY Number of vertical tiles in the sprite sheet. * @property {number} animNumAnimations Number of sprite sheet animations contained within the current sprite sheet. The number of animations multiplied by number of frames should be a value less than animTilesX multiplied by animTilesY. * @property {number} animNumFrames Number of sprite sheet frames in the current sprite sheet animation. The number of animations multiplied by number of frames should be a value less than animTilesX multiplied by animTilesY. * @property {number} animStartFrame The sprite sheet frame that the animation should begin playing from. Indexed from the start of the current animation. * @property {number} animIndex When animNumAnimations is greater than 1, the sprite sheet animation index determines which animation the particle system should play. * @property {number} randomizeAnimIndex Each particle emitted by the system will play a random animation from the sprite sheet, up to animNumAnimations. * @property {number} animSpeed Sprite sheet animation speed. 1 = particle lifetime, 2 = twice during lifetime etc... * @property {number} depthSoftening Controls fading of particles near their intersections with scene geometry. This effect, when it's non-zero, requires scene depth map to be rendered. Multiple depth-dependent effects can share the same map, but if you only use it for particles, bear in mind that it can double engine draw calls. * @property {number} initialVelocity Defines magnitude of the initial emitter velocity. Direction is given by emitter shape. * @property {pc.Vec3} emitterExtents (Only for EMITTERSHAPE_BOX) The extents of a local space bounding box within which particles are spawned at random positions. * @property {pc.Vec3} emitterExtentsInner (Only for EMITTERSHAPE_BOX) The exception of extents of a local space bounding box within which particles are not spawned. Aligned to the center of EmitterExtents. * @property {number} emitterRadius (Only for EMITTERSHAPE_SPHERE) The radius within which particles are spawned at random positions. * @property {number} emitterRadiusInner (Only for EMITTERSHAPE_SPHERE) The inner radius within which particles are not spawned. * @property {pc.Vec3} wrapBounds The half extents of a world space box volume centered on the owner entity's position. If a particle crosses the boundary of one side of the volume, it teleports to the opposite side. * @property {pc.Asset} colorMapAsset The {@link pc.Asset} used to set the colorMap. * @property {pc.Asset} normalMapAsset The {@link pc.Asset} used to set the normalMap. * @property {pc.Asset} meshAsset The {@link pc.Asset} used to set the mesh. * @property {pc.Texture} colorMap The color map texture to apply to all particles in the system. If no texture is assigned, a default spot texture is used. * @property {pc.Texture} normalMap The normal map texture to apply to all particles in the system. If no texture is assigned, an approximate spherical normal is calculated for each vertex. * @property {number} emitterShape Shape of the emitter. Defines the bounds inside which particles are spawned. Also affects the direction of initial velocity. * * * {@link pc.EMITTERSHAPE_BOX}: Box shape parameterized by emitterExtents. Initial velocity is directed towards local Z axis. * * {@link pc.EMITTERSHAPE_SPHERE}: Sphere shape parameterized by emitterRadius. Initial velocity is directed outwards from the center. * * @property {number} sort Sorting mode. Forces CPU simulation, so be careful. * * * {@link pc.PARTICLESORT_NONE}: No sorting, particles are drawn in arbitary order. Can be simulated on GPU. * * {@link pc.PARTICLESORT_DISTANCE}: Sorting based on distance to the camera. CPU only. * * {@link pc.PARTICLESORT_NEWER_FIRST}: Newer particles are drawn first. CPU only. * * {@link pc.PARTICLESORT_OLDER_FIRST}: Older particles are drawn first. CPU only. * * @property {pc.Mesh} mesh Triangular mesh to be used as a particle. Only first vertex/index buffer is used. Vertex buffer must contain local position at first 3 floats of each vertex. * @property {number} blend Controls how particles are blended when being written to the currently active render target. * Can be: * * * {@link pc.BLEND_SUBTRACTIVE}: Subtract the color of the source fragment from the destination fragment and write the result to the frame buffer. * * {@link pc.BLEND_ADDITIVE}: Add the color of the source fragment to the destination fragment and write the result to the frame buffer. * * {@link pc.BLEND_NORMAL}: Enable simple translucency for materials such as glass. This is equivalent to enabling a source blend mode of pc.BLENDMODE_SRC_ALPHA and a destination blend mode of pc.BLENDMODE_ONE_MINUS_SRC_ALPHA. * * {@link pc.BLEND_NONE}: Disable blending. * * {@link pc.BLEND_PREMULTIPLIED}: Similar to pc.BLEND_NORMAL expect the source fragment is assumed to have already been multiplied by the source alpha value. * * {@link pc.BLEND_MULTIPLICATIVE}: Multiply the color of the source fragment by the color of the destination fragment and write the result to the frame buffer. * * {@link pc.BLEND_ADDITIVEALPHA}: Same as pc.BLEND_ADDITIVE except the source RGB is multiplied by the source alpha. * * @property {number} orientation Sorting mode. Forces CPU simulation, so be careful. * * * {@link pc.PARTICLEORIENTATION_SCREEN}: Particles are facing camera. * * {@link pc.PARTICLEORIENTATION_WORLD}: User defines world space normal (particleNormal) to set planes orientation. * * {@link pc.PARTICLEORIENTATION_EMITTER}: Similar to previous, but the normal is affected by emitter(entity) transformation. * * @property {pc.Vec3} particleNormal (Only for PARTICLEORIENTATION_WORLD and PARTICLEORIENTATION_EMITTER) The exception of extents of a local space bounding box within which particles are not spawned. Aligned to the center of EmitterExtents. * @property {pc.CurveSet} localVelocityGraph Velocity relative to emitter over lifetime. * @property {pc.CurveSet} localVelocityGraph2 If not null, particles pick random values between localVelocityGraph and localVelocityGraph2. * @property {pc.CurveSet} velocityGraph World-space velocity over lifetime. * @property {pc.CurveSet} velocityGraph2 If not null, particles pick random values between velocityGraph and velocityGraph2. * @property {pc.CurveSet} colorGraph Color over lifetime. * @property {pc.Curve} rotationSpeedGraph Rotation speed over lifetime. * @property {pc.Curve} rotationSpeedGraph2 If not null, particles pick random values between rotationSpeedGraph and rotationSpeedGraph2. * @property {pc.Curve} radialSpeedGraph Radial speed over lifetime, velocity vector points from emitter origin to particle pos. * @property {pc.Curve} radialSpeedGraph2 If not null, particles pick random values between radialSpeedGraph and radialSpeedGraph2. * @property {pc.Curve} scaleGraph Scale over lifetime. * @property {pc.Curve} scaleGraph2 If not null, particles pick random values between scaleGraph and scaleGraph2. * @property {pc.Curve} alphaGraph Alpha over lifetime. * @property {pc.Curve} alphaGraph2 If not null, particles pick random values between alphaGraph and alphaGraph2. * @property {number[]} layers An array of layer IDs ({@link pc.Layer#id}) to which this particle system should belong. * Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ class ParticleSystemComponent extends pc.Component { constructor(system: pc.ParticleSystemComponentSystem, entity: pc.Entity); /** * @function * @name pc.ParticleSystemComponent#reset * @description Resets particle state, doesn't affect playing. */ reset(): void; /** * @function * @name pc.ParticleSystemComponent#stop * @description Disables the emission of new particles, lets existing to finish their simulation. */ stop(): void; /** * @function * @name pc.ParticleSystemComponent#pause * @description Freezes the simulation. */ pause(): void; /** * @function * @name pc.ParticleSystemComponent#unpause * @description Unfreezes the simulation. */ unpause(): void; /** * @function * @name pc.ParticleSystemComponent#play * @description Enables/unfreezes the simulation. */ play(): void; /** * @function * @name pc.ParticleSystemComponent#isPlaying * @description Checks if simulation is in progress. * @returns {boolean} True if the particle system is currently playing and false otherwise. */ isPlaying(): boolean; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Controls whether the particle system plays automatically on creation. If set to false, it is necessary to call {@link pc.ParticleSystemComponent#play} for the particle system to play. Defaults to true. */ autoPlay: boolean; /** * Enables or disables respawning of particles. */ loop: boolean; /** * If enabled, the particle system will be initialized as though it had already completed a full cycle. This only works with looping particle systems. */ preWarm: boolean; /** * If enabled, particles will be lit by ambient and directional lights. */ lighting: boolean; /** * Enabling Half Lambert lighting avoids particles looking too flat in shadowed areas. It is a completely non-physical lighting model but can give more pleasing visual results. */ halfLambert: boolean; /** * Orient particles in their direction of motion. */ alignToMotion: boolean; /** * If enabled, the particles will write to the depth buffer. If disabled, the depth buffer is left unchanged and particles will be guaranteed to overwrite one another in the order in which they are rendered. */ depthWrite: boolean; /** * Disable fogging. */ noFog: boolean; /** * Binds particles to emitter transformation rather then world space. */ localSpace: boolean; /** * Maximum number of simulated particles. */ numParticles: number; /** * Minimal interval in seconds between particle births. */ rate: number; /** * Maximal interval in seconds between particle births. */ rate2: number; /** * Minimal initial Euler angle of a particle. */ startAngle: number; /** * Maximal initial Euler angle of a particle. */ startAngle2: number; /** * The length of time in seconds between a particle's birth and its death. */ lifetime: number; /** * A value in world units that controls the amount by which particles are stretched based on their velocity. Particles are stretched from their center towards their previous position. */ stretch: number; /** * Color multiplier. */ intensity: number; /** * Controls whether the sprite sheet animation plays once or loops continuously. */ animLoop: boolean; /** * Number of horizontal tiles in the sprite sheet. */ animTilesX: number; /** * Number of vertical tiles in the sprite sheet. */ animTilesY: number; /** * Number of sprite sheet animations contained within the current sprite sheet. The number of animations multiplied by number of frames should be a value less than animTilesX multiplied by animTilesY. */ animNumAnimations: number; /** * Number of sprite sheet frames in the current sprite sheet animation. The number of animations multiplied by number of frames should be a value less than animTilesX multiplied by animTilesY. */ animNumFrames: number; /** * The sprite sheet frame that the animation should begin playing from. Indexed from the start of the current animation. */ animStartFrame: number; /** * When animNumAnimations is greater than 1, the sprite sheet animation index determines which animation the particle system should play. */ animIndex: number; /** * Each particle emitted by the system will play a random animation from the sprite sheet, up to animNumAnimations. */ randomizeAnimIndex: number; /** * Sprite sheet animation speed. 1 = particle lifetime, 2 = twice during lifetime etc... */ animSpeed: number; /** * Controls fading of particles near their intersections with scene geometry. This effect, when it's non-zero, requires scene depth map to be rendered. Multiple depth-dependent effects can share the same map, but if you only use it for particles, bear in mind that it can double engine draw calls. */ depthSoftening: number; /** * Defines magnitude of the initial emitter velocity. Direction is given by emitter shape. */ initialVelocity: number; /** * (Only for EMITTERSHAPE_BOX) The extents of a local space bounding box within which particles are spawned at random positions. */ emitterExtents: pc.Vec3; /** * (Only for EMITTERSHAPE_BOX) The exception of extents of a local space bounding box within which particles are not spawned. Aligned to the center of EmitterExtents. */ emitterExtentsInner: pc.Vec3; /** * (Only for EMITTERSHAPE_SPHERE) The radius within which particles are spawned at random positions. */ emitterRadius: number; /** * (Only for EMITTERSHAPE_SPHERE) The inner radius within which particles are not spawned. */ emitterRadiusInner: number; /** * The half extents of a world space box volume centered on the owner entity's position. If a particle crosses the boundary of one side of the volume, it teleports to the opposite side. */ wrapBounds: pc.Vec3; /** * The {@link pc.Asset} used to set the colorMap. */ colorMapAsset: pc.Asset; /** * The {@link pc.Asset} used to set the normalMap. */ normalMapAsset: pc.Asset; /** * The {@link pc.Asset} used to set the mesh. */ meshAsset: pc.Asset; /** * The color map texture to apply to all particles in the system. If no texture is assigned, a default spot texture is used. */ colorMap: pc.Texture; /** * The normal map texture to apply to all particles in the system. If no texture is assigned, an approximate spherical normal is calculated for each vertex. */ normalMap: pc.Texture; /** * Shape of the emitter. Defines the bounds inside which particles are spawned. Also affects the direction of initial velocity. * {@link pc.EMITTERSHAPE_BOX}: Box shape parameterized by emitterExtents. Initial velocity is directed towards local Z axis. * {@link pc.EMITTERSHAPE_SPHERE}: Sphere shape parameterized by emitterRadius. Initial velocity is directed outwards from the center. */ emitterShape: number; /** * Sorting mode. Forces CPU simulation, so be careful. * {@link pc.PARTICLESORT_NONE}: No sorting, particles are drawn in arbitary order. Can be simulated on GPU. * {@link pc.PARTICLESORT_DISTANCE}: Sorting based on distance to the camera. CPU only. * {@link pc.PARTICLESORT_NEWER_FIRST}: Newer particles are drawn first. CPU only. * {@link pc.PARTICLESORT_OLDER_FIRST}: Older particles are drawn first. CPU only. */ sort: number; /** * Triangular mesh to be used as a particle. Only first vertex/index buffer is used. Vertex buffer must contain local position at first 3 floats of each vertex. */ mesh: pc.Mesh; /** * Controls how particles are blended when being written to the currently active render target. Can be: * {@link pc.BLEND_SUBTRACTIVE}: Subtract the color of the source fragment from the destination fragment and write the result to the frame buffer. * {@link pc.BLEND_ADDITIVE}: Add the color of the source fragment to the destination fragment and write the result to the frame buffer. * {@link pc.BLEND_NORMAL}: Enable simple translucency for materials such as glass. This is equivalent to enabling a source blend mode of pc.BLENDMODE_SRC_ALPHA and a destination blend mode of pc.BLENDMODE_ONE_MINUS_SRC_ALPHA. * {@link pc.BLEND_NONE}: Disable blending. * {@link pc.BLEND_PREMULTIPLIED}: Similar to pc.BLEND_NORMAL expect the source fragment is assumed to have already been multiplied by the source alpha value. * {@link pc.BLEND_MULTIPLICATIVE}: Multiply the color of the source fragment by the color of the destination fragment and write the result to the frame buffer. * {@link pc.BLEND_ADDITIVEALPHA}: Same as pc.BLEND_ADDITIVE except the source RGB is multiplied by the source alpha. */ blend: number; /** * Sorting mode. Forces CPU simulation, so be careful. * {@link pc.PARTICLEORIENTATION_SCREEN}: Particles are facing camera. * {@link pc.PARTICLEORIENTATION_WORLD}: User defines world space normal (particleNormal) to set planes orientation. * {@link pc.PARTICLEORIENTATION_EMITTER}: Similar to previous, but the normal is affected by emitter(entity) transformation. */ orientation: number; /** * (Only for PARTICLEORIENTATION_WORLD and PARTICLEORIENTATION_EMITTER) The exception of extents of a local space bounding box within which particles are not spawned. Aligned to the center of EmitterExtents. */ particleNormal: pc.Vec3; /** * Velocity relative to emitter over lifetime. */ localVelocityGraph: pc.CurveSet; /** * If not null, particles pick random values between localVelocityGraph and localVelocityGraph2. */ localVelocityGraph2: pc.CurveSet; /** * World-space velocity over lifetime. */ velocityGraph: pc.CurveSet; /** * If not null, particles pick random values between velocityGraph and velocityGraph2. */ velocityGraph2: pc.CurveSet; /** * Color over lifetime. */ colorGraph: pc.CurveSet; /** * Rotation speed over lifetime. */ rotationSpeedGraph: pc.Curve; /** * If not null, particles pick random values between rotationSpeedGraph and rotationSpeedGraph2. */ rotationSpeedGraph2: pc.Curve; /** * Radial speed over lifetime, velocity vector points from emitter origin to particle pos. */ radialSpeedGraph: pc.Curve; /** * If not null, particles pick random values between radialSpeedGraph and radialSpeedGraph2. */ radialSpeedGraph2: pc.Curve; /** * Scale over lifetime. */ scaleGraph: pc.Curve; /** * If not null, particles pick random values between scaleGraph and scaleGraph2. */ scaleGraph2: pc.Curve; /** * Alpha over lifetime. */ alphaGraph: pc.Curve; /** * If not null, particles pick random values between alphaGraph and alphaGraph2. */ alphaGraph2: pc.Curve; /** * An array of layer IDs ({@link pc.Layer#id}) to which this particle system should belong. Don't push/pop/splice or modify this array, if you want to change it - set a new one instead. */ layers: number[]; } /** * @class * @name pc.ParticleSystemComponentSystem * @augments pc.ComponentSystem * @classdesc Allows an Entity to render a particle system. * @description Create a new ParticleSystemComponentSystem. * @param {pc.Application} app - The Application. */ class ParticleSystemComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.ComponentSystemRegistry * @classdesc Store, access and delete instances of the various ComponentSystems. * @description Create a new ComponentSystemRegistry. */ class ComponentSystemRegistry { } /** * @component * @class * @name pc.RigidBodyComponent * @augments pc.Component * @classdesc The rigidbody component, when combined with a {@link pc.CollisionComponent}, allows your * entities to be simulated using realistic physics. * A rigidbody component will fall under gravity and collide with other rigid bodies. Using scripts, you * can apply forces and impulses to rigid bodies. * @description Create a new RigidBodyComponent. * @param {pc.RigidBodyComponentSystem} system - The ComponentSystem that created this component. * @param {pc.Entity} entity - The entity this component is attached to. * @property {number} mass The mass of the body. This is only relevant for {@link pc.BODYTYPE_DYNAMIC} * bodies, other types have infinite mass. Defaults to 1. * @property {pc.Vec3} linearVelocity Defines the speed of the body in a given direction. * @property {pc.Vec3} angularVelocity Defines the rotational speed of the body around each world axis. * @property {number} linearDamping Controls the rate at which a body loses linear velocity over time. * Defaults to 0. * @property {number} angularDamping Controls the rate at which a body loses angular velocity over time. * Defaults to 0. * @property {pc.Vec3} linearFactor Scaling factor for linear movement of the body in each axis. * Defaults to 1 in all axes. * @property {pc.Vec3} angularFactor Scaling factor for angular movement of the body in each axis. * Defaults to 1 in all axes. * @property {number} friction The friction value used when contacts occur between two bodies. A higher * value indicates more friction. Should be set in the range 0 to 1. Defaults to 0.5. * @property {number} restitution Influences the amount of energy lost when two rigid bodies collide. The * calculation multiplies the restitution values for both colliding bodies. A multiplied value of 0 means * that all energy is lost in the collision while a value of 1 means that no energy is lost. Should be * set in the range 0 to 1. Defaults to 0. * @property {number} group The collision group this body belongs to. Combine the group and the mask to * prevent bodies colliding with each other. Defaults to 1. * @property {number} mask The collision mask sets which groups this body collides with. It is a bitfield * of 16 bits, the first 8 bits are reserved for engine use. Defaults to 65535. * @property {string} type The rigid body type determines how the body is simulated. Can be: * * * {@link pc.BODYTYPE_STATIC}: infinite mass and cannot move. * * {@link pc.BODYTYPE_DYNAMIC}: simulated according to applied forces. * * {@link pc.BODYTYPE_KINEMATIC}: infinite mass and does not respond to forces but can still be moved by setting their velocity or position. * * Defaults to pc.BODYTYPE_STATIC. */ class RigidBodyComponent extends pc.Component { constructor(system: pc.RigidBodyComponentSystem, entity: pc.Entity); /** * @function * @name pc.RigidBodyComponent#isActive * @description Returns true if the rigid body is currently actively being simulated. I.e. Not 'sleeping'. * @returns {boolean} True if the body is active. */ isActive(): boolean; /** * @function * @name pc.RigidBodyComponent#activate * @description Forcibly activate the rigid body simulation. */ activate(): void; /** * @function * @name pc.RigidBodyComponent#applyForce * @description Apply an force to the body at a point. By default, the force is applied at the origin of the * body. However, the force can be applied at an offset this point by specifying a world space vector from * the body's origin to the point of application. This function has two valid signatures. You can either * specify the force (and optional relative point) via 3D-vector or numbers. * @param {pc.Vec3|number} x - A 3-dimensional vector representing the force in world-space or * the x-component of the force in world-space. * @param {pc.Vec3|number} [y] - An optional 3-dimensional vector representing the relative point at * which to apply the impulse in world-space or the y-component of the force in world-space. * @param {number} [z] - The z-component of the force in world-space. * @param {number} [px] - The x-component of a world-space offset from the body's position where the force is applied. * @param {number} [py] - The y-component of a world-space offset from the body's position where the force is applied. * @param {number} [pz] - The z-component of a world-space offset from the body's position where the force is applied. * @example * // Apply an approximation of gravity at the body's center * this.entity.rigidbody.applyForce(0, -10, 0); * @example * // Apply an approximation of gravity at 1 unit down the world Z from the center of the body * this.entity.rigidbody.applyForce(0, -10, 0, 0, 0, 1); * @example * // Apply a force at the body's center * // Calculate a force vector pointing in the world space direction of the entity * var force = this.entity.forward.clone().scale(100); * * // Apply the force * this.entity.rigidbody.applyForce(force); * @example * // Apply a force at some relative offset from the body's center * // Calculate a force vector pointing in the world space direction of the entity * var force = this.entity.forward.clone().scale(100); * * // Calculate the world space relative offset * var relativePos = new pc.Vec3(); * var childEntity = this.entity.findByName('Engine'); * relativePos.sub2(childEntity.getPosition(), this.entity.getPosition()); * * // Apply the force * this.entity.rigidbody.applyForce(force, relativePos); */ applyForce(x: pc.Vec3 | number, y?: pc.Vec3 | number, z?: number, px?: number, py?: number, pz?: number): void; /** * @function * @name pc.RigidBodyComponent#applyTorque * @description Apply torque (rotational force) to the body. This function has two valid signatures. * You can either specify the torque force with a 3D-vector or with 3 numbers. * @param {pc.Vec3|number} x - A 3-dimensional vector representing the torque force in world-space or * the x-component of the torque force in world-space. * @param {number} [y] - The y-component of the torque force in world-space. * @param {number} [z] - The z-component of the torque force in world-space. * @example * // Apply via vector * var torque = new pc.Vec3(0, 10, 0); * entity.rigidbody.applyTorque(torque); * @example * // Apply via numbers * entity.rigidbody.applyTorque(0, 10, 0); */ applyTorque(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.RigidBodyComponent#applyImpulse * @description Apply an impulse (instantaneous change of velocity) to the body at a point. * This function has two valid signatures. You can either specify the impulse (and optional relative * point) via 3D-vector or numbers. * @param {pc.Vec3|number} x - A 3-dimensional vector representing the impulse in world-space or * the x-component of the impulse in world-space. * @param {pc.Vec3|number} [y] - An optional 3-dimensional vector representing the relative point at * which to apply the impulse in the local-space of the entity or the y-component of the impulse to * apply in world-space. * @param {number} [z] - The z-component of the impulse to apply in world-space. * @param {number} [px=0] - The x-component of the point at which to apply the impulse in the local-space of the entity. * @param {number} [py=0] - The y-component of the point at which to apply the impulse in the local-space of the entity. * @param {number} [pz=0] - The z-component of the point at which to apply the impulse in the local-space of the entity. * @example * // Apply an impulse along the world-space positive y-axis at the entity's position. * var impulse = new pc.Vec3(0, 10, 0); * entity.rigidbody.applyImpulse(impulse); * @example * // Apply an impulse along the world-space positive y-axis at 1 unit down the positive * // z-axis of the entity's local-space. * var impulse = new pc.Vec3(0, 10, 0); * var relativePoint = new pc.Vec3(0, 0, 1); * entity.rigidbody.applyImpulse(impulse, relativePoint); * @example * // Apply an impulse along the world-space positive y-axis at the entity's position. * entity.rigidbody.applyImpulse(0, 10, 0); * @example * // Apply an impulse along the world-space positive y-axis at 1 unit down the positive * // z-axis of the entity's local-space. * entity.rigidbody.applyImpulse(0, 10, 0, 0, 0, 1); */ applyImpulse(x: pc.Vec3 | number, y?: pc.Vec3 | number, z?: number, px?: number, py?: number, pz?: number): void; /** * @function * @name pc.RigidBodyComponent#applyTorqueImpulse * @description Apply a torque impulse (rotational force applied instantaneously) to the body. * This function has two valid signatures. You can either specify the torque force with a 3D-vector * or with 3 numbers. * @param {pc.Vec3|number} x - A 3-dimensional vector representing the torque impulse in world-space or * the x-component of the torque impulse in world-space. * @param {number} [y] - The y-component of the torque impulse in world-space. * @param {number} [z] - The z-component of the torque impulse in world-space. * @example * // Apply via vector * var torque = new pc.Vec3(0, 10, 0); * entity.rigidbody.applyTorqueImpulse(torque); * @example * // Apply via numbers * entity.rigidbody.applyTorqueImpulse(0, 10, 0); */ applyTorqueImpulse(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.RigidBodyComponent#isStatic * @description Returns true if the rigid body is of type {@link pc.BODYTYPE_STATIC}. * @returns {boolean} True if static. */ isStatic(): boolean; /** * @function * @name pc.RigidBodyComponent#isStaticOrKinematic * @description Returns true if the rigid body is of type {@link pc.BODYTYPE_STATIC} or {@link pc.BODYTYPE_KINEMATIC}. * @returns {boolean} True if static or kinematic. */ isStaticOrKinematic(): boolean; /** * @function * @name pc.RigidBodyComponent#isKinematic * @description Returns true if the rigid body is of type {@link pc.BODYTYPE_KINEMATIC}. * @returns {boolean} True if kinematic. */ isKinematic(): boolean; /** * @function * @name pc.RigidBodyComponent#teleport * @description Teleport an entity to a new world-space position, optionally setting orientation. This function * should only be called for rigid bodies that are dynamic. This function has three valid signatures. * The first takes a 3-dimensional vector for the position and an optional 3-dimensional vector for Euler rotation. * The second takes a 3-dimensional vector for the position and an optional quaternion for rotation. * The third takes 3 numbers for the position and an optional 3 numbers for Euler rotation. * @param {pc.Vec3|number} x - A 3-dimensional vector holding the new position or the new position x-coordinate. * @param {pc.Vec3|pc.Quat|number} y - A 3-dimensional vector or quaternion holding the new rotation or the new * position y-coordinate. * @param {number} [z] - The new position z-coordinate. * @param {number} [rx] - The new Euler x-angle value. * @param {number} [ry] - The new Euler y-angle value. * @param {number} [rz] - The new Euler z-angle value. * @example * // Teleport the entity to the origin * entity.rigidbody.teleport(pc.Vec3.ZERO); * @example * // Teleport the entity to the origin * entity.rigidbody.teleport(0, 0, 0); * @example * // Teleport the entity to world-space coordinate [1, 2, 3] and reset orientation * var position = new pc.Vec3(1, 2, 3); * entity.rigidbody.teleport(position, pc.Vec3.ZERO); * @example * // Teleport the entity to world-space coordinate [1, 2, 3] and reset orientation * entity.rigidbody.teleport(1, 2, 3, 0, 0, 0); */ teleport(x: pc.Vec3 | number, y: pc.Vec3 | pc.Quat | number, z?: number, rx?: number, ry?: number, rz?: number): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The mass of the body. This is only relevant for {@link pc.BODYTYPE_DYNAMIC} bodies, other types have infinite mass. Defaults to 1. */ mass: number; /** * Defines the speed of the body in a given direction. */ linearVelocity: pc.Vec3; /** * Defines the rotational speed of the body around each world axis. */ angularVelocity: pc.Vec3; /** * Controls the rate at which a body loses linear velocity over time. Defaults to 0. */ linearDamping: number; /** * Controls the rate at which a body loses angular velocity over time. Defaults to 0. */ angularDamping: number; /** * Scaling factor for linear movement of the body in each axis. Defaults to 1 in all axes. */ linearFactor: pc.Vec3; /** * Scaling factor for angular movement of the body in each axis. Defaults to 1 in all axes. */ angularFactor: pc.Vec3; /** * The friction value used when contacts occur between two bodies. A higher value indicates more friction. Should be set in the range 0 to 1. Defaults to 0.5. */ friction: number; /** * Influences the amount of energy lost when two rigid bodies collide. The calculation multiplies the restitution values for both colliding bodies. A multiplied value of 0 means that all energy is lost in the collision while a value of 1 means that no energy is lost. Should be set in the range 0 to 1. Defaults to 0. */ restitution: number; /** * The collision group this body belongs to. Combine the group and the mask to prevent bodies colliding with each other. Defaults to 1. */ group: number; /** * The collision mask sets which groups this body collides with. It is a bitfield of 16 bits, the first 8 bits are reserved for engine use. Defaults to 65535. */ mask: number; /** * The rigid body type determines how the body is simulated. Can be: * {@link pc.BODYTYPE_STATIC}: infinite mass and cannot move. * {@link pc.BODYTYPE_DYNAMIC}: simulated according to applied forces. * {@link pc.BODYTYPE_KINEMATIC}: infinite mass and does not respond to forces but can still be moved by setting their velocity or position. Defaults to pc.BODYTYPE_STATIC. */ type: string; } /** * @constant * @type {string} * @name pc.BODYTYPE_STATIC * @description Rigid body has infinite mass and cannot move. */ const BODYTYPE_STATIC: string; /** * @constant * @type {string} * @name pc.BODYTYPE_DYNAMIC * @description Rigid body is simulated according to applied forces. */ const BODYTYPE_DYNAMIC: string; /** * @constant * @type {string} * @name pc.BODYTYPE_KINEMATIC * @description Rigid body has infinite mass and does not respond to forces but can still be moved by setting their velocity or position. */ const BODYTYPE_KINEMATIC: string; /** * @class * @name pc.RaycastResult * @classdesc Object holding the result of a successful raycast hit. * @description Create a new RaycastResult. * @param {pc.Entity} entity - The entity that was hit. * @param {pc.Vec3} point - The point at which the ray hit the entity in world space. * @param {pc.Vec3} normal - The normal vector of the surface where the ray hit in world space. * @property {pc.Entity} entity The entity that was hit. * @property {pc.Vec3} point The point at which the ray hit the entity in world space. * @property {pc.Vec3} normal The normal vector of the surface where the ray hit in world space. */ class RaycastResult { constructor(entity: pc.Entity, point: pc.Vec3, normal: pc.Vec3); /** * The entity that was hit. */ entity: pc.Entity; /** * The point at which the ray hit the entity in world space. */ point: pc.Vec3; /** * The normal vector of the surface where the ray hit in world space. */ normal: pc.Vec3; } /** * @class * @name pc.SingleContactResult * @classdesc Object holding the result of a contact between two rigid bodies. * @description Create a new SingleContactResult. * @param {pc.Entity} a - The first entity involved in the contact. * @param {pc.Entity} b - The second entity involved in the contact. * @param {pc.ContactPoint} contactPoint - The contact point between the two entities. * @property {pc.Entity} a The first entity involved in the contact. * @property {pc.Entity} b The second entity involved in the contact. * @property {pc.Vec3} localPointA The point on Entity A where the contact occurred, relative to A. * @property {pc.Vec3} localPointB The point on Entity B where the contact occurred, relative to B. * @property {pc.Vec3} pointA The point on Entity A where the contact occurred, in world space. * @property {pc.Vec3} pointB The point on Entity B where the contact occurred, in world space. * @property {pc.Vec3} normal The normal vector of the contact on Entity B, in world space. */ class SingleContactResult { constructor(a: pc.Entity, b: pc.Entity, contactPoint: pc.ContactPoint); /** * The first entity involved in the contact. */ a: pc.Entity; /** * The second entity involved in the contact. */ b: pc.Entity; /** * The point on Entity A where the contact occurred, relative to A. */ localPointA: pc.Vec3; /** * The point on Entity B where the contact occurred, relative to B. */ localPointB: pc.Vec3; /** * The point on Entity A where the contact occurred, in world space. */ pointA: pc.Vec3; /** * The point on Entity B where the contact occurred, in world space. */ pointB: pc.Vec3; /** * The normal vector of the contact on Entity B, in world space. */ normal: pc.Vec3; } /** * @class * @name pc.ContactPoint * @classdesc Object holding the result of a contact between two Entities. * @description Create a new ContactPoint. * @param {pc.Vec3} localPoint - The point on the entity where the contact occurred, relative to the entity. * @param {pc.Vec3} localPointOther - The point on the other entity where the contact occurred, relative to the other entity. * @param {pc.Vec3} point - The point on the entity where the contact occurred, in world space. * @param {pc.Vec3} pointOther - The point on the other entity where the contact occurred, in world space. * @param {pc.Vec3} normal - The normal vector of the contact on the other entity, in world space. * @property {pc.Vec3} localPoint The point on the entity where the contact occurred, relative to the entity. * @property {pc.Vec3} localPointOther The point on the other entity where the contact occurred, relative to the other entity. * @property {pc.Vec3} point The point on the entity where the contact occurred, in world space. * @property {pc.Vec3} pointOther The point on the other entity where the contact occurred, in world space. * @property {pc.Vec3} normal The normal vector of the contact on the other entity, in world space. */ class ContactPoint { constructor(localPoint: pc.Vec3, localPointOther: pc.Vec3, point: pc.Vec3, pointOther: pc.Vec3, normal: pc.Vec3); /** * The point on the entity where the contact occurred, relative to the entity. */ localPoint: pc.Vec3; /** * The point on the other entity where the contact occurred, relative to the other entity. */ localPointOther: pc.Vec3; /** * The point on the entity where the contact occurred, in world space. */ point: pc.Vec3; /** * The point on the other entity where the contact occurred, in world space. */ pointOther: pc.Vec3; /** * The normal vector of the contact on the other entity, in world space. */ normal: pc.Vec3; } /** * @class * @name pc.ContactResult * @classdesc Object holding the result of a contact between two Entities. * @description Create a new ContactResult. * @param {pc.Entity} other - The entity that was involved in the contact with this entity. * @param {pc.ContactPoint[]} contacts - An array of ContactPoints with the other entity. * @property {pc.Entity} other The entity that was involved in the contact with this entity. * @property {pc.ContactPoint[]} contacts An array of ContactPoints with the other entity. */ class ContactResult { constructor(other: pc.Entity, contacts: pc.ContactPoint[]); /** * The entity that was involved in the contact with this entity. */ other: pc.Entity; /** * An array of ContactPoints with the other entity. */ contacts: pc.ContactPoint[]; } /** * @class * @name pc.RigidBodyComponentSystem * @augments pc.ComponentSystem * @classdesc The RigidBodyComponentSystem maintains the dynamics world for simulating rigid bodies, * it also controls global values for the world such as gravity. Note: The RigidBodyComponentSystem * is only valid if 3D Physics is enabled in your application. You can enable this in the application * settings for your project. * @description Create a new RigidBodyComponentSystem. * @param {pc.Application} app - The Application. * @property {pc.Vec3} gravity The world space vector representing global gravity in the physics simulation. * Defaults to [0, -9.81, 0] which is an approximation of the gravitational force on Earth. */ class RigidBodyComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.RigidBodyComponentSystem#raycastFirst * @description Raycast the world and return the first entity the ray hits. Fire a ray into the world from start to end, * if the ray hits an entity with a collision component, it returns a {@link pc.RaycastResult}, otherwise returns null. * @param {pc.Vec3} start - The world space point where the ray starts. * @param {pc.Vec3} end - The world space point where the ray ends. * @returns {pc.RaycastResult} The result of the raycasting or null if there was no hit. */ raycastFirst(start: pc.Vec3, end: pc.Vec3): pc.RaycastResult; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The world space vector representing global gravity in the physics simulation. Defaults to [0, -9.81, 0] which is an approximation of the gravitational force on Earth. */ gravity: pc.Vec3; } /** * @constant * @type {string} * @name pc.SCALEMODE_NONE * @description Always use the application's resolution as the resolution for the {@link pc.ScreenComponent}. */ const SCALEMODE_NONE: string; /** * @constant * @type {string} * @name pc.SCALEMODE_BLEND * @description Scale the {@link pc.ScreenComponent} when the application's resolution is different than the ScreenComponent's referenceResolution. */ const SCALEMODE_BLEND: string; /** * @component * @class * @name pc.ScreenComponent * @augments pc.Component * @classdesc A ScreenComponent enables the Entity to render child {@link pc.ElementComponent}s using anchors and positions in the ScreenComponent's space. * @description Create a new ScreenComponent. * @param {pc.ScreenComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {boolean} screenSpace If true then the ScreenComponent will render its child {@link pc.ElementComponent}s in screen space instead of world space. Enable this to create 2D user interfaces. * @property {boolean} cull If true then elements inside this screen will be not be rendered when outside of the screen (only valid when screenSpace is true). * @property {string} scaleMode Can either be {@link pc.SCALEMODE_NONE} or {@link pc.SCALEMODE_BLEND}. See the description of referenceResolution for more information. * @property {number} scaleBlend A value between 0 and 1 that is used when scaleMode is equal to {@link pc.SCALEMODE_BLEND}. Scales the ScreenComponent with width as a reference (when value is 0), the height as a reference (when value is 1) or anything in between. * @property {pc.Vec2} resolution The width and height of the ScreenComponent. When screenSpace is true the resolution will always be equal to {@link pc.GraphicsDevice#width} x {@link pc.GraphicsDevice#height}. * @property {pc.Vec2} referenceResolution The resolution that the ScreenComponent is designed for. This is only taken into account when screenSpace is true and scaleMode is {@link pc.SCALEMODE_BLEND}. If the actual resolution is different then the ScreenComponent will be scaled according to the scaleBlend value. */ class ScreenComponent extends pc.Component { constructor(system: pc.ScreenComponentSystem, entity: pc.Entity); /** * @function * @name pc.ScreenComponent#syncDrawOrder * @description Set the drawOrder of each child {@link pc.ElementComponent} * so that ElementComponents which are last in the hierarchy are rendered on top. * Draw Order sync is queued and will be updated by the next update loop. */ syncDrawOrder(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * If true then the ScreenComponent will render its child {@link pc.ElementComponent}s in screen space instead of world space. Enable this to create 2D user interfaces. */ screenSpace: boolean; /** * If true then elements inside this screen will be not be rendered when outside of the screen (only valid when screenSpace is true). */ cull: boolean; /** * Can either be {@link pc.SCALEMODE_NONE} or {@link pc.SCALEMODE_BLEND}. See the description of referenceResolution for more information. */ scaleMode: string; /** * A value between 0 and 1 that is used when scaleMode is equal to {@link pc.SCALEMODE_BLEND}. Scales the ScreenComponent with width as a reference (when value is 0), the height as a reference (when value is 1) or anything in between. */ scaleBlend: number; /** * The width and height of the ScreenComponent. When screenSpace is true the resolution will always be equal to {@link pc.GraphicsDevice#width} x {@link pc.GraphicsDevice#height}. */ resolution: pc.Vec2; /** * The resolution that the ScreenComponent is designed for. This is only taken into account when screenSpace is true and scaleMode is {@link pc.SCALEMODE_BLEND}. If the actual resolution is different then the ScreenComponent will be scaled according to the scaleBlend value. */ referenceResolution: pc.Vec2; } /** * @class * @name pc.ScreenComponentSystem * @augments pc.ComponentSystem * @classdesc Manages creation of {@link pc.ScreenComponent}s. * @description Create a new ScreenComponentSystem. * @param {pc.Application} app - The application. */ class ScreenComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.ScriptComponent * @augments pc.Component * @classdesc The ScriptComponent allows you to extend the functionality of an Entity by attaching your own Script Types defined in JavaScript files * to be executed with access to the Entity. For more details on scripting see Scripting. * @param {pc.ScriptComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {pc.ScriptType[]} scripts An array of all script instances attached to an entity. This Array shall not be modified by developer. */ class ScriptComponent extends pc.Component { constructor(system: pc.ScriptComponentSystem, entity: pc.Entity); /** * @function * @name pc.ScriptComponent#has * @description Detect if script is attached to an entity using name of {@link pc.ScriptType}. * @param {string} name - The name of the Script Type. * @returns {boolean} If script is attached to an entity. * @example * if (entity.script.has('playerController')) { * // entity has script * } */ has(name: string): boolean; /** * @function * @name pc.ScriptComponent#create * @description Create a script instance using name of a {@link pc.ScriptType} and attach to an entity script component. * @param {string|Class} name - The name of the Script Type (or alternatively the {@link pc.ScriptType} to instantiate). * @param {object} [args] - Object with arguments for a script. * @param {boolean} [args.enabled] - If script instance is enabled after creation. Defaults to true. * @param {object} [args.attributes] - Object with values for attributes (if any), where key is name of an attribute. * @param {boolean} [args.preloading] - If script instance is created during preload. If true, script and attributes must be initialized manually. Defaults to false. * @param {number} [args.ind] - The index where to insert the script instance at. Defaults to -1, which means append it at the end. * @returns {pc.ScriptType} Returns an instance of a {@link pc.ScriptType} if successfully attached to an entity, * or null if it failed because a script with a same name has already been added * or if the {@link pc.ScriptType} cannot be found by name in the {@link pc.ScriptRegistry}. * @example * entity.script.create('playerController', { * attributes: { * speed: 4 * } * }); */ create(name: string | typeof pc.ScriptType, args?: { enabled?: boolean; attributes?: any; preloading?: boolean; ind?: number; }): pc.ScriptType; /** * @function * @name pc.ScriptComponent#destroy * @description Destroy the script instance that is attached to an entity. * @param {string} name - The name of the Script Type. * @returns {boolean} If it was successfully destroyed. * @example * entity.script.destroy('playerController'); */ destroy(name: string): boolean; /** * @function * @name pc.ScriptComponent#move * @description Move script instance to different position to alter update order of scripts within entity. * @param {string} name - The name of the Script Type. * @param {number} ind - New position index. * @returns {boolean} If it was successfully moved. * @example * entity.script.move('playerController', 0); */ move(name: string, ind: number): boolean; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * An array of all script instances attached to an entity. This Array shall not be modified by developer. */ scripts: pc.ScriptType[]; } /** * @class * @name pc.ScriptComponentSystem * @augments pc.ComponentSystem * @description Create a new ScriptComponentSystem. * @classdesc Allows scripts to be attached to an Entity and executed. * @param {pc.Application} app - The application. */ class ScriptComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.ScrollViewComponent * @augments pc.Component * @classdesc A ScrollViewComponent enables a group of entities to behave like a masked scrolling area, with optional horizontal and vertical scroll bars. * @description Create a new ScrollViewComponent. * @param {pc.ScrollViewComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {boolean} horizontal Whether to enable horizontal scrolling. * @property {boolean} vertical Whether to enable vertical scrolling. * @property {number} scrollMode Specifies how the scroll view should behave when the user scrolls past the end of the content. Modes are defined as follows: * * * {@link pc.SCROLL_MODE_CLAMP}: Content does not scroll any further than its bounds. * * {@link pc.SCROLL_MODE_BOUNCE}: Content scrolls past its bounds and then gently bounces back. * * {@link pc.SCROLL_MODE_INFINITE}: Content can scroll forever. * * @property {number} bounceAmount Controls how far the content should move before bouncing back. * @property {number} friction Controls how freely the content should move if thrown, i.e. By flicking on a phone or by flinging the scroll wheel on a mouse. A value of 1 means that content will stop immediately; 0 means that content will continue moving forever (or until the bounds of the content are reached, depending on the scrollMode). * @property {number} horizontalScrollbarVisibility Controls whether the horizontal scrollbar should be visible all the time, or only visible when the content exceeds the size of the viewport. * @property {number} verticalScrollbarVisibility Controls whether the vertical scrollbar should be visible all the time, or only visible when the content exceeds the size of the viewport. * @property {pc.Entity} viewportEntity The entity to be used as the masked viewport area, within which the content will scroll. This entity must have an ElementGroup component. * @property {pc.Entity} contentEntity The entity which contains the scrolling content itself. This entity must have an Element component. * @property {pc.Entity} horizontalScrollbarEntity The entity to be used as the vertical scrollbar. This entity must have a Scrollbar component. * @property {pc.Entity} verticalScrollbarEntity The entity to be used as the vertical scrollbar. This entity must have a Scrollbar component. */ class ScrollViewComponent extends pc.Component { constructor(system: pc.ScrollViewComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Whether to enable horizontal scrolling. */ horizontal: boolean; /** * Whether to enable vertical scrolling. */ vertical: boolean; /** * Specifies how the scroll view should behave when the user scrolls past the end of the content. Modes are defined as follows: * {@link pc.SCROLL_MODE_CLAMP}: Content does not scroll any further than its bounds. * {@link pc.SCROLL_MODE_BOUNCE}: Content scrolls past its bounds and then gently bounces back. * {@link pc.SCROLL_MODE_INFINITE}: Content can scroll forever. */ scrollMode: number; /** * Controls how far the content should move before bouncing back. */ bounceAmount: number; /** * Controls how freely the content should move if thrown, i.e. By flicking on a phone or by flinging the scroll wheel on a mouse. A value of 1 means that content will stop immediately; 0 means that content will continue moving forever (or until the bounds of the content are reached, depending on the scrollMode). */ friction: number; /** * Controls whether the horizontal scrollbar should be visible all the time, or only visible when the content exceeds the size of the viewport. */ horizontalScrollbarVisibility: number; /** * Controls whether the vertical scrollbar should be visible all the time, or only visible when the content exceeds the size of the viewport. */ verticalScrollbarVisibility: number; /** * The entity to be used as the masked viewport area, within which the content will scroll. This entity must have an ElementGroup component. */ viewportEntity: pc.Entity; /** * The entity which contains the scrolling content itself. This entity must have an Element component. */ contentEntity: pc.Entity; /** * The entity to be used as the vertical scrollbar. This entity must have a Scrollbar component. */ horizontalScrollbarEntity: pc.Entity; /** * The entity to be used as the vertical scrollbar. This entity must have a Scrollbar component. */ verticalScrollbarEntity: pc.Entity; } /** * @constant * @type {number} * @name pc.SCROLL_MODE_CLAMP * @description Content does not scroll any further than its bounds. */ const SCROLL_MODE_CLAMP: number; /** * @constant * @type {number} * @name pc.SCROLL_MODE_BOUNCE * @description Content scrolls past its bounds and then gently bounces back. */ const SCROLL_MODE_BOUNCE: number; /** * @constant * @type {number} * @name pc.SCROLL_MODE_INFINITE * @description Content can scroll forever. */ const SCROLL_MODE_INFINITE: number; /** * @constant * @type {number} * @name pc.SCROLLBAR_VISIBILITY_SHOW_ALWAYS * @description The scrollbar will be visible all the time. */ const SCROLLBAR_VISIBILITY_SHOW_ALWAYS: number; /** * @constant * @type {number} * @name pc.SCROLLBAR_VISIBILITY_SHOW_WHEN_REQUIRED * @description The scrollbar will be visible only when content exceeds the size of the viewport. */ const SCROLLBAR_VISIBILITY_SHOW_WHEN_REQUIRED: number; /** * @class * @name pc.ScrollViewComponentSystem * @augments pc.ComponentSystem * @classdesc Manages creation of {@link pc.ScrollViewComponent}s. * @description Create a new ScrollViewComponentSystem. * @param {pc.Application} app - The application. */ class ScrollViewComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.ScrollbarComponent * @augments pc.Component * @description Create a new ScrollbarComponent. * @classdesc A ScrollbarComponent enables a group of entities to behave like a draggable scrollbar. * @param {pc.ScrollbarComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {number} orientation Whether the scrollbar moves horizontally or vertically. Can be: * * * {@link pc.ORIENTATION_HORIZONTAL}: The scrollbar animates in the horizontal axis. * * {@link pc.ORIENTATION_VERTICAL}: The scrollbar animates in the vertical axis. * * Defaults to pc.ORIENTATION_HORIZONTAL. * @property {number} value The current position value of the scrollbar, in the range 0 to 1. Defaults to 0. * @property {number} handleSize The size of the handle relative to the size of the track, in the range * 0 to 1. For a vertical scrollbar, a value of 1 means that the handle will take up the full height of * the track. * @property {pc.Entity} handleEntity The entity to be used as the scrollbar handle. This entity must * have a Scrollbar component. */ class ScrollbarComponent extends pc.Component { constructor(system: pc.ScrollbarComponentSystem, entity: pc.Entity); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Whether the scrollbar moves horizontally or vertically. Can be: * {@link pc.ORIENTATION_HORIZONTAL}: The scrollbar animates in the horizontal axis. * {@link pc.ORIENTATION_VERTICAL}: The scrollbar animates in the vertical axis. Defaults to pc.ORIENTATION_HORIZONTAL. */ orientation: number; /** * The current position value of the scrollbar, in the range 0 to 1. Defaults to 0. */ value: number; /** * The size of the handle relative to the size of the track, in the range 0 to 1. For a vertical scrollbar, a value of 1 means that the handle will take up the full height of the track. */ handleSize: number; /** * The entity to be used as the scrollbar handle. This entity must have a Scrollbar component. */ handleEntity: pc.Entity; } /** * @class * @name pc.ScrollbarComponentSystem * @augments pc.ComponentSystem * @classdesc Manages creation of {@link pc.ScrollbarComponent}s. * @description Create a new ScrollbarComponentSystem. * @param {pc.Application} app - The application. */ class ScrollbarComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @component * @class * @name pc.SoundComponent * @augments pc.Component * @classdesc The Sound Component controls playback of {@link pc.Sound}s. * @description Create a new Sound Component. * @param {pc.SoundComponentSystem} system - The ComponentSystem that created this * component. * @param {pc.Entity} entity - The entity that the Component is attached to. * @property {number} volume The volume modifier to play the audio with. In range 0-1. * @property {number} pitch The pitch modifier to play the audio with. Must be larger * than 0.01. * @property {boolean} positional If true the audio will play back at the location * of the Entity in space, so the audio will be affected by the position of the * {@link pc.AudioListenerComponent}. * @property {string} distanceModel Determines which algorithm to use to reduce the * volume of the sound as it moves away from the listener. Can be: * * * {@link pc.DISTANCE_LINEAR} * * {@link pc.DISTANCE_INVERSE} * * {@link pc.DISTANCE_EXPONENTIAL} * * Default is {@link pc.DISTANCE_LINEAR}. * @property {number} refDistance The reference distance for reducing volume as the * sound source moves further from the listener. * @property {number} maxDistance The maximum distance from the listener at which audio * falloff stops. Note the volume of the audio is not 0 after this distance, but just * doesn't fall off anymore. * @property {number} rollOffFactor The factor used in the falloff equation. * @property {object} slots A dictionary that contains the {@link pc.SoundSlot}s managed * by this Component. */ class SoundComponent extends pc.Component { constructor(system: pc.SoundComponentSystem, entity: pc.Entity); /** * @function * @name pc.SoundComponent#addSlot * @description Creates a new {@link pc.SoundSlot} with the specified name. * @param {string} name - The name of the slot. * @param {object} [options] - Settings for the slot. * @param {number} [options.volume=1] - The playback volume, between 0 and 1. * @param {number} [options.pitch=1] - The relative pitch, default of 1, plays at normal pitch. * @param {boolean} [options.loop=false] - If true the sound will restart when it reaches the end. * @param {number} [options.startTime=0] - The start time from which the sound will start playing. * @param {number} [options.duration=null] - The duration of the sound that the slot will play starting from startTime. * @param {boolean} [options.overlap=false] - If true then sounds played from slot will be played independently of each other. Otherwise the slot will first stop the current sound before starting the new one. * @param {boolean} [options.autoPlay=false] - If true the slot will start playing as soon as its audio asset is loaded. * @param {number} [options.asset=null] - The asset id of the audio asset that is going to be played by this slot. * @returns {pc.SoundSlot} The new slot. * @example * // get an asset by id * var asset = app.assets.get(10); * // add a slot * this.entity.sound.addSlot('beep', { * asset: asset * }); * // play * this.entity.sound.play('beep'); */ addSlot(name: string, options?: { volume?: number; pitch?: number; loop?: boolean; startTime?: number; duration?: number; overlap?: boolean; autoPlay?: boolean; asset?: number; }): pc.SoundSlot; /** * @function * @name pc.SoundComponent#removeSlot * @description Removes the {@link pc.SoundSlot} with the specified name. * @param {string} name - The name of the slot. * @example * // remove a slot called 'beep' * this.entity.sound.removeSlot('beep'); */ removeSlot(name: string): void; /** * @function * @name pc.SoundComponent#slot * @description Returns the slot with the specified name. * @param {string} name - The name of the slot. * @returns {pc.SoundSlot} The slot. * @example * // get a slot and set its volume * this.entity.sound.slot('beep').volume = 0.5; * */ slot(name: string): pc.SoundSlot; /** * @function * @name pc.SoundComponent#play * @description Begins playing the sound slot with the specified name. The slot will restart playing if it is already playing unless the overlap field is true in which case a new sound will be created and played. * @param {string} name - The name of the {@link pc.SoundSlot} to play. * @example * // get asset by id * var asset = app.assets.get(10); * // create a slot and play it * this.entity.sound.addSlot('beep', { * asset: asset * }); * this.entity.sound.play('beep'); * @returns {pc.SoundInstance} The sound instance that will be played. */ play(name: string): pc.SoundInstance; /** * @function * @name pc.SoundComponent#pause * @description Pauses playback of the slot with the specified name. If the name is undefined then all slots currently played will be paused. The slots can be resumed by calling {@link pc.SoundComponent#resume}. * @param {string} [name] - The name of the slot to pause. Leave undefined to pause everything. * @example * // pause all sounds * this.entity.sound.pause(); * // pause a specific sound * this.entity.sound.pause('beep'); */ pause(name?: string): void; /** * @function * @name pc.SoundComponent#resume * @description Resumes playback of the sound slot with the specified name if it's paused. If no name is specified all slots will be resumed. * @param {string} name - The name of the slot to resume. Leave undefined to resume everything. * @example * // resume all sounds * this.entity.sound.resume(); * // resume a specific sound * this.entity.sound.resume('beep'); */ resume(name: string): void; /** * @function * @name pc.SoundComponent#stop * @description Stops playback of the sound slot with the specified name if it's paused. If no name is specified all slots will be stopped. * @param {string} name - The name of the slot to stop. Leave undefined to stop everything. * @example * // stop all sounds * this.entity.sound.stop(); * // stop a specific sound * this.entity.sound.stop('beep'); */ stop(name: string): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The volume modifier to play the audio with. In range 0-1. */ volume: number; /** * The pitch modifier to play the audio with. Must be larger than 0.01. */ pitch: number; /** * If true the audio will play back at the location of the Entity in space, so the audio will be affected by the position of the {@link pc.AudioListenerComponent}. */ positional: boolean; /** * Determines which algorithm to use to reduce the volume of the sound as it moves away from the listener. Can be: * {@link pc.DISTANCE_LINEAR} * {@link pc.DISTANCE_INVERSE} * {@link pc.DISTANCE_EXPONENTIAL} Default is {@link pc.DISTANCE_LINEAR}. */ distanceModel: string; /** * The reference distance for reducing volume as the sound source moves further from the listener. */ refDistance: number; /** * The maximum distance from the listener at which audio falloff stops. Note the volume of the audio is not 0 after this distance, but just doesn't fall off anymore. */ maxDistance: number; /** * The factor used in the falloff equation. */ rollOffFactor: number; /** * A dictionary that contains the {@link pc.SoundSlot}s managed by this Component. */ slots: any; } /** * @constant * @type {string} * @name pc.DISTANCE_LINEAR * @description Linear distance model. */ const DISTANCE_LINEAR: string; /** * @constant * @type {string} * @name pc.DISTANCE_INVERSE * @description Inverse distance model. */ const DISTANCE_INVERSE: string; /** * @constant * @type {string} * @name pc.DISTANCE_EXPONENTIAL * @description Exponential distance model. */ const DISTANCE_EXPONENTIAL: string; /** * @class * @name pc.SoundSlot * @augments pc.EventHandler * @classdesc The SoundSlot controls playback of an audio asset. * @description Create a new SoundSlot. * @param {pc.SoundComponent} component - The Component that created this slot. * @param {string} name - The name of the slot. * @param {object} options - Settings for the slot. * @param {number} [options.volume=1] - The playback volume, between 0 and 1. * @param {number} [options.pitch=1] - The relative pitch, default of 1, plays at normal pitch. * @param {boolean} [options.loop=false] - If true the sound will restart when it reaches the end. * @param {number} [options.startTime=0] - The start time from which the sound will start playing. * @param {number} [options.duration=null] - The duration of the sound that the slot will play starting from startTime. * @param {boolean} [options.overlap=false] - If true then sounds played from slot will be played independently of each other. Otherwise the slot will first stop the current sound before starting the new one. * @param {boolean} [options.autoPlay=false] - If true the slot will start playing as soon as its audio asset is loaded. * @param {number} [options.asset=null] - The asset id of the audio asset that is going to be played by this slot. * @property {string} name The name of the slot. * @property {number|null} asset The asset id. * @property {boolean} autoPlay If true the slot will begin playing as soon as it is loaded. * @property {number} volume The volume modifier to play the sound with. In range 0-1. * @property {number} pitch The pitch modifier to play the sound with. Must be larger than 0.01. * @property {number} startTime The start time from which the sound will start playing. * @property {number} duration The duration of the sound that the slot will play starting from startTime. * @property {boolean} loop If true the slot will restart when it finishes playing. * @property {boolean} overlap If true then sounds played from slot will be played independently of each other. Otherwise the slot will first stop the current sound before starting the new one. * @property {boolean} isLoaded Returns true if the asset of the slot is loaded. * @property {boolean} isPlaying Returns true if the slot is currently playing. * @property {boolean} isPaused Returns true if the slot is currently paused. * @property {boolean} isStopped Returns true if the slot is currently stopped. * @property {pc.SoundInstance[]} instances An array that contains all the {@link pc.SoundInstance}s currently being played by the slot. */ class SoundSlot extends pc.EventHandler { constructor(component: pc.SoundComponent, name: string, options: { volume?: number; pitch?: number; loop?: boolean; startTime?: number; duration?: number; overlap?: boolean; autoPlay?: boolean; asset?: number; }); /** * @function pc.SoundSlot#play * @description Plays a sound. If {@link pc.SoundSlot#overlap} is true the new sound * instance will be played independently of any other instances already playing. * Otherwise existing sound instances will stop before playing the new sound. * @returns {pc.SoundInstance} The new sound instance. */ play(): pc.SoundInstance; /** * @function * @name pc.SoundSlot#pause * @description Pauses all sound instances. To continue playback call {@link pc.SoundSlot#resume}. * @returns {boolean} True if the sound instances paused successfully, false otherwise. */ pause(): boolean; /** * @function * @name pc.SoundSlot#resume * @description Resumes playback of all paused sound instances. * @returns {boolean} True if any instances were resumed. */ resume(): boolean; /** * @function * @name pc.SoundSlot#stop * @description Stops playback of all sound instances. * @returns {boolean} True if any instances were stopped. */ stop(): boolean; /** * @function * @name pc.SoundSlot#load * @description Loads the asset assigned to this slot. */ load(): void; /** * @function * @name pc.SoundSlot#setExternalNodes * @description Connect external Web Audio API nodes. Any sound played by this slot will * automatically attach the specified nodes to the source that plays the sound. You need to pass * the first node of the node graph that you created externally and the last node of that graph. The first * node will be connected to the audio source and the last node will be connected to the destination of the AudioContext (e.g. speakers). * @param {AudioNode} firstNode - The first node that will be connected to the audio source of sound instances. * @param {AudioNode} [lastNode] - The last node that will be connected to the destination of the AudioContext. * If unspecified then the firstNode will be connected to the destination instead. * @example * var context = app.systems.sound.context; * var analyzer = context.createAnalyzer(); * var distortion = context.createWaveShaper(); * var filter = context.createBiquadFilter(); * analyzer.connect(distortion); * distortion.connect(filter); * slot.setExternalNodes(analyzer, filter); */ setExternalNodes(firstNode: AudioNode, lastNode?: AudioNode): void; /** * @function * @name pc.SoundSlot#clearExternalNodes * @description Clears any external nodes set by {@link pc.SoundSlot#setExternalNodes}. */ clearExternalNodes(): void; /** * @function * @name pc.SoundSlot#getExternalNodes * @description Gets an array that contains the two external nodes set by {@link pc.SoundSlot#setExternalNodes}. * @returns {AudioNode[]} An array of 2 elements that contains the first and last nodes set by {@link pc.SoundSlot#setExternalNodes}. */ getExternalNodes(): AudioNode[]; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The name of the slot. */ name: string; /** * The asset id. */ asset: number | null; /** * If true the slot will begin playing as soon as it is loaded. */ autoPlay: boolean; /** * The volume modifier to play the sound with. In range 0-1. */ volume: number; /** * The pitch modifier to play the sound with. Must be larger than 0.01. */ pitch: number; /** * The start time from which the sound will start playing. */ startTime: number; /** * The duration of the sound that the slot will play starting from startTime. */ duration: number; /** * If true the slot will restart when it finishes playing. */ loop: boolean; /** * If true then sounds played from slot will be played independently of each other. Otherwise the slot will first stop the current sound before starting the new one. */ overlap: boolean; /** * Returns true if the asset of the slot is loaded. */ isLoaded: boolean; /** * Returns true if the slot is currently playing. */ isPlaying: boolean; /** * Returns true if the slot is currently paused. */ isPaused: boolean; /** * Returns true if the slot is currently stopped. */ isStopped: boolean; /** * An array that contains all the {@link pc.SoundInstance}s currently being played by the slot. */ instances: pc.SoundInstance[]; } /** * @class * @name pc.SoundComponentSystem * @augments pc.ComponentSystem * @classdesc Manages creation of {@link pc.SoundComponent}s. * @description Create a SoundComponentSystem. * @param {pc.Application} app - The Application. * @param {pc.SoundManager} manager - The sound manager. * @property {number} volume Sets / gets the volume for the entire Sound system. All sounds will have their volume * multiplied by this value. Valid between [0, 1]. * @property {AudioContext} context Gets the AudioContext currently used by the sound manager. Requires Web Audio API support. * @property {pc.SoundManager} manager Gets / sets the sound manager. */ class SoundComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application, manager: pc.SoundManager); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Sets / gets the volume for the entire Sound system. All sounds will have their volume multiplied by this value. Valid between [0, 1]. */ volume: number; /** * Gets the AudioContext currently used by the sound manager. Requires Web Audio API support. */ context: AudioContext; /** * Gets / sets the sound manager. */ manager: pc.SoundManager; } /** * @constant * @type {string} * @name pc.SPRITETYPE_SIMPLE * @description A {@link pc.SpriteComponent} that displays a single frame from a sprite asset. */ const SPRITETYPE_SIMPLE: string; /** * @constant * @type {string} * @name pc.SPRITETYPE_ANIMATED * @description A {@link pc.SpriteComponent} that renders sprite animations. */ const SPRITETYPE_ANIMATED: string; /** * @component * @class * @name pc.SpriteComponent * @augments pc.Component * @classdesc Enables an Entity to render a simple static sprite or sprite animations. * @param {pc.SpriteComponentSystem} system - The ComponentSystem that created this Component. * @param {pc.Entity} entity - The Entity that this Component is attached to. * @property {string} type The type of the SpriteComponent. Can be: * * * {@link pc.SPRITETYPE_SIMPLE}: The component renders a single frame from a sprite asset. * * {@link pc.SPRITETYPE_ANIMATED}: The component can play sprite animation clips. * * @property {number} frame The frame counter of the sprite. Specifies which frame from the current sprite asset to render. * @property {number} spriteAsset The id of the sprite asset to render. Only works for {@link pc.SPRITETYPE_SIMPLE} types. * @property {pc.Sprite} sprite The current sprite. * @property {number} width The width of the sprite when rendering using 9-Slicing. The width and height are only used when the render mode of the sprite asset is Sliced or Tiled. * @property {number} height The height of the sprite when rendering using 9-Slicing. The width and height are only used when the render mode of the sprite asset is Sliced or Tiled. * @property {pc.Color} color The color tint of the sprite. * @property {number} opacity The opacity of the sprite. * @property {boolean} flipX Flip the X axis when rendering a sprite. * @property {boolean} flipY Flip the Y axis when rendering a sprite. * @property {object} clips A dictionary that contains {@link pc.SpriteAnimationClip}s. * @property {pc.SpriteAnimationClip} currentClip The current clip being played. * @property {number} speed A global speed modifier used when playing sprite animation clips. * @property {number} batchGroupId Assign sprite to a specific batch group (see {@link pc.BatchGroup}). Default value is -1 (no group). * @property {string} autoPlayClip The name of the clip to play automatically when the component is enabled and the clip exists. * @property {number[]} layers An array of layer IDs ({@link pc.Layer#id}) to which this sprite should belong. * @property {number} drawOrder The draw order of the component. A higher value means that the component will be rendered on top of other components in the same layer. */ class SpriteComponent extends pc.Component { constructor(system: pc.SpriteComponentSystem, entity: pc.Entity); /** * @function * @name pc.SpriteComponent#addClip * @description Creates and adds a new {@link pc.SpriteAnimationClip} to the component's clips. * @param {object} data - Data for the new animation clip. * @param {string} [data.name] - The name of the new animation clip. * @param {number} [data.fps] - Frames per second for the animation clip. * @param {object} [data.loop] - Whether to loop the animation clip. * @param {number} [data.spriteAsset] - The id of the sprite asset that this clip will play. * @returns {pc.SpriteAnimationClip} The new clip that was added. */ addClip(data: { name?: string; fps?: number; loop?: any; spriteAsset?: number; }): pc.SpriteAnimationClip; /** * @function * @name pc.SpriteComponent#removeClip * @description Removes a clip by name. * @param {string} name - The name of the animation clip to remove. */ removeClip(name: string): void; /** * @function * @name pc.SpriteComponent#clip * @description Get an animation clip by name. * @param {string} name - The name of the clip. * @returns {pc.SpriteAnimationClip} The clip. */ clip(name: string): pc.SpriteAnimationClip; /** * @function * @name pc.SpriteComponent#play * @description Plays a sprite animation clip by name. If the animation clip is already playing then this will do nothing. * @param {string} name - The name of the clip to play. * @returns {pc.SpriteAnimationClip} The clip that started playing. */ play(name: string): pc.SpriteAnimationClip; /** * @function * @name pc.SpriteComponent#pause * @description Pauses the current animation clip. */ pause(): void; /** * @function * @name pc.SpriteComponent#resume * @description Resumes the current paused animation clip. */ resume(): void; /** * @function * @name pc.SpriteComponent#stop * @description Stops the current animation clip and resets it to the first frame. */ stop(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The type of the SpriteComponent. Can be: * {@link pc.SPRITETYPE_SIMPLE}: The component renders a single frame from a sprite asset. * {@link pc.SPRITETYPE_ANIMATED}: The component can play sprite animation clips. */ type: string; /** * The frame counter of the sprite. Specifies which frame from the current sprite asset to render. */ frame: number; /** * The id of the sprite asset to render. Only works for {@link pc.SPRITETYPE_SIMPLE} types. */ spriteAsset: number; /** * The current sprite. */ sprite: pc.Sprite; /** * The width of the sprite when rendering using 9-Slicing. The width and height are only used when the render mode of the sprite asset is Sliced or Tiled. */ width: number; /** * The height of the sprite when rendering using 9-Slicing. The width and height are only used when the render mode of the sprite asset is Sliced or Tiled. */ height: number; /** * The color tint of the sprite. */ color: pc.Color; /** * The opacity of the sprite. */ opacity: number; /** * Flip the X axis when rendering a sprite. */ flipX: boolean; /** * Flip the Y axis when rendering a sprite. */ flipY: boolean; /** * A dictionary that contains {@link pc.SpriteAnimationClip}s. */ clips: any; /** * The current clip being played. */ currentClip: pc.SpriteAnimationClip; /** * A global speed modifier used when playing sprite animation clips. */ speed: number; /** * Assign sprite to a specific batch group (see {@link pc.BatchGroup}). Default value is -1 (no group). */ batchGroupId: number; /** * The name of the clip to play automatically when the component is enabled and the clip exists. */ autoPlayClip: string; /** * An array of layer IDs ({@link pc.Layer#id}) to which this sprite should belong. */ layers: number[]; /** * The draw order of the component. A higher value means that the component will be rendered on top of other components in the same layer. */ drawOrder: number; } /** * @class * @name pc.SpriteAnimationClip * @augments pc.EventHandler * @classdesc Handles playing of sprite animations and loading of relevant sprite assets. * @param {pc.SpriteComponent} component - The sprite component managing this clip. * @param {object} data - Data for the new animation clip. * @param {number} [data.fps] - Frames per second for the animation clip. * @param {object} [data.loop] - Whether to loop the animation clip. * @param {string} [data.name] - The name of the new animation clip. * @param {number} [data.spriteAsset] - The id of the sprite asset that this clip will play. * @property {number} spriteAsset The id of the sprite asset used to play the animation. * @property {pc.Sprite} sprite The current sprite used to play the animation. * @property {number} frame The index of the frame of the {@link pc.Sprite} currently being rendered. * @property {number} time The current time of the animation in seconds. * @property {number} duration The total duration of the animation in seconds. * @property {boolean} isPlaying Whether the animation is currently playing. * @property {boolean} isPaused Whether the animation is currently paused. */ class SpriteAnimationClip extends pc.EventHandler { constructor(component: pc.SpriteComponent, data: { fps?: number; loop?: any; name?: string; spriteAsset?: number; }); /** * @function * @name pc.SpriteAnimationClip#play * @description Plays the animation. If it's already playing then this does nothing. */ play(): void; /** * @function * @name pc.SpriteAnimationClip#pause * @description Pauses the animation. */ pause(): void; /** * @function * @name pc.SpriteAnimationClip#resume * @description Resumes the paused animation. */ resume(): void; /** * @function * @name pc.SpriteAnimationClip#stop * @description Stops the animation and resets the animation to the first frame. */ stop(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The id of the sprite asset used to play the animation. */ spriteAsset: number; /** * The current sprite used to play the animation. */ sprite: pc.Sprite; /** * The index of the frame of the {@link pc.Sprite} currently being rendered. */ frame: number; /** * The current time of the animation in seconds. */ time: number; /** * The total duration of the animation in seconds. */ duration: number; /** * Whether the animation is currently playing. */ isPlaying: boolean; /** * Whether the animation is currently paused. */ isPaused: boolean; } /** * @class * @name pc.SpriteComponentSystem * @augments pc.ComponentSystem * @classdesc Manages creation of {@link pc.SpriteComponent}s. * @param {pc.Application} app - The application. */ class SpriteComponentSystem extends pc.ComponentSystem { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.ComponentSystem * @augments pc.EventHandler * @classdesc Component Systems contain the logic and functionality to update all Components of a particular type. * @param {pc.Application} app - The application managing this system. */ class ComponentSystem extends pc.EventHandler { constructor(app: pc.Application); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.Font * @classdesc Represents the resource of a font asset. * @param {pc.Texture[]} textures - The font textures. * @param {object} data - The font data. * @property {number} intensity The font intensity. * @property {pc.Texture[]} textures The font textures. */ class Font { constructor(textures: pc.Texture[], data: any); /** * The font intensity. */ intensity: number; /** * The font textures. */ textures: pc.Texture[]; } /** * @class * @name pc.Entity * @augments pc.GraphNode * @classdesc The Entity is the core primitive of a PlayCanvas game. Generally speaking an object in your game will consist of an {@link pc.Entity}, * and a set of {@link pc.Component}s which are managed by their respective {@link pc.ComponentSystem}s. One of those components maybe a * {@link pc.ScriptComponent} which allows you to write custom code to attach to your Entity. *

* The Entity uniquely identifies the object and also provides a transform for position and orientation * which it inherits from {@link pc.GraphNode} so can be added into the scene graph. * The Component and ComponentSystem provide the logic to give an Entity a specific type of behavior. e.g. the ability to * render a model or play a sound. Components are specific to an instance of an Entity and are attached (e.g. `this.entity.model`) * ComponentSystems allow access to all Entities and Components and are attached to the {@link pc.Application}. * @param {string} [name] - The non-unique name of the entity, default is "Untitled". * @param {pc.Application} [app] - The application the entity belongs to, default is the current application. * @property {pc.AnimationComponent} [animation] Gets the {@link pc.AnimationComponent} attached to this entity. [read only] * @property {pc.AudioListenerComponent} [audiolistener] Gets the {@link pc.AudioSourceComponent} attached to this entity. [read only] * @property {pc.ButtonComponent} [button] Gets the {@link pc.ButtonComponent} attached to this entity. [read only] * @property {pc.CameraComponent} [camera] Gets the {@link pc.CameraComponent} attached to this entity. [read only] * @property {pc.CollisionComponent} [collision] Gets the {@link pc.CollisionComponent} attached to this entity. [read only] * @property {pc.ElementComponent} [element] Gets the {@link pc.ElementComponent} attached to this entity. [read only] * @property {pc.LayoutChildComponent} [layoutchild] Gets the {@link pc.LayoutChildComponent} attached to this entity. [read only] * @property {pc.LayoutGroupComponent} [layoutgroup] Gets the {@link pc.LayoutGroupComponent} attached to this entity. [read only] * @property {pc.LightComponent} [light] Gets the {@link pc.LightComponent} attached to this entity. [read only] * @property {pc.ModelComponent} [model] Gets the {@link pc.ModelComponent} attached to this entity. [read only] * @property {pc.ParticleSystemComponent} [particlesystem] Gets the {@link pc.ParticleSystemComponent} attached to this entity. [read only] * @property {pc.RigidBodyComponent} [rigidbody] Gets the {@link pc.RigidBodyComponent} attached to this entity. [read only] * @property {pc.ScreenComponent} [screen] Gets the {@link pc.ScreenComponent} attached to this entity. [read only] * @property {pc.ScriptComponent} [script] Gets the {@link pc.ScriptComponent} attached to this entity. [read only] * @property {pc.ScrollViewComponent} [scrollview] Gets the {@link pc.ScrollViewComponent} attached to this entity. [read only] * @property {pc.SoundComponent} [sound] Gets the {@link pc.SoundComponent} attached to this entity. [read only] * @property {pc.SpriteComponent} [sprite] Gets the {@link pc.SpriteComponent} attached to this entity. [read only] * @example * var entity = new pc.Entity(); * * // Add a Component to the Entity * entity.addComponent("camera", { * fov: 45, * nearClip: 1, * farClip: 10000 * }); * * // Add the Entity into the scene graph * app.root.addChild(entity); * * // Move the entity * entity.translate(10, 0, 0); * * // Or translate it by setting it's position directly * var p = entity.getPosition(); * entity.setPosition(p.x + 10, p.y, p.z); * * // Change the entity's rotation in local space * var e = entity.getLocalEulerAngles(); * entity.setLocalEulerAngles(e.x, e.y + 90, e.z); * * // Or use rotateLocal * entity.rotateLocal(0, 90, 0); */ class Entity extends pc.GraphNode { constructor(name?: string, app?: pc.Application); /** * @function * @name pc.Entity#addComponent * @description Create a new component and add it to the entity. * Use this to add functionality to the entity like rendering a model, playing sounds and so on. * @param {string} type - The name of the component to add. Valid strings are: * * * "animation" - see {@link pc.AnimationComponent} * * "audiolistener" - see {@link pc.AudioListenerComponent} * * "button" - see {@link pc.ButtonComponent} * * "camera" - see {@link pc.CameraComponent} * * "collision" - see {@link pc.CollisionComponent} * * "element" - see {@link pc.ElementComponent} * * "layoutchild" - see {@link pc.LayoutChildComponent} * * "layoutgroup" - see {@link pc.LayoutGroupComponent} * * "light" - see {@link pc.LightComponent} * * "model" - see {@link pc.ModelComponent} * * "particlesystem" - see {@link pc.ParticleSystemComponent} * * "rigidbody" - see {@link pc.RigidBodyComponent} * * "screen" - see {@link pc.ScreenComponent} * * "script" - see {@link pc.ScriptComponent} * * "scrollbar" - see {@link pc.ScrollbarComponent} * * "scrollview" - see {@link pc.ScrollViewComponent} * * "sound" - see {@link pc.SoundComponent} * * "sprite" - see {@link pc.SpriteComponent} * * @param {object} [data] - The initialization data for the specific component type. Refer to each * specific component's API reference page for details on valid values for this parameter. * @returns {pc.Component} The new Component that was attached to the entity or null if there * was an error. * @example * var entity = new pc.Entity(); * * // Add a light component with default properties * entity.addComponent("light"); * * // Add a camera component with some specified properties * entity.addComponent("camera", { * fov: 45, * clearColor: new pc.Color(1, 0, 0) * }); */ addComponent(type: string, data?: any): pc.Component; /** * @function * @name pc.Entity#removeComponent * @description Remove a component from the Entity. * @param {string} type - The name of the Component type. * @example * var entity = new pc.Entity(); * entity.addComponent("light"); // add new light component * * entity.removeComponent("light"); // remove light component */ removeComponent(type: string): void; /** * @function * @name pc.Entity#findComponent * @description Search the entity and all of its descendants for the first component of specified type. * @param {string} type - The name of the component type to retrieve. * @returns {pc.Component} A component of specified type, if the entity or any of its descendants has * one. Returns undefined otherwise. * @example * // Get the first found light component in the hierarchy tree that starts with this entity * var light = entity.findComponent("light"); */ findComponent(type: string): pc.Component; /** * @function * @name pc.Entity#findComponents * @description Search the entity and all of its descendants for all components of specified type. * @param {string} type - The name of the component type to retrieve. * @returns {pc.Component} All components of specified type in the entity or any of its descendants. * Returns empty array if none found. * @example * // Get all light components in the hierarchy tree that starts with this entity * var lights = entity.findComponents("light"); */ findComponents(type: string): pc.Component; /** * @function * @name pc.Entity#findByGuid * @description Find a descendant of this Entity with the GUID. * @param {string} guid - The GUID to search for. * @returns {pc.Entity} The Entity with the GUID or null. */ findByGuid(guid: string): pc.Entity; /** * @function * @name pc.Entity#destroy * @description Remove all components from the Entity and detach it from the Entity hierarchy. Then recursively destroy all ancestor Entities. * @example * var firstChild = this.entity.children[0]; * firstChild.destroy(); // delete child, all components and remove from hierarchy */ destroy(): void; /** * @function * @name pc.Entity#clone * @description Create a deep copy of the Entity. Duplicate the full Entity hierarchy, with all Components and all descendants. * Note, this Entity is not in the hierarchy and must be added manually. * @returns {pc.Entity} A new Entity which is a deep copy of the original. * @example * var e = this.entity.clone(); * * // Add clone as a sibling to the original * this.entity.parent.addChild(e); */ clone(): pc.Entity; /** * @readonly * @name pc.GraphNode#right * @type {pc.Vec3} * @description The normalized local space X-axis vector of the graph node in world space. */ readonly right: pc.Vec3; /** * @readonly * @name pc.GraphNode#up * @type {pc.Vec3} * @description The normalized local space Y-axis vector of the graph node in world space. */ readonly up: pc.Vec3; /** * @readonly * @name pc.GraphNode#forward * @type {pc.Vec3} * @description The normalized local space negative Z-axis vector of the graph node in world space. */ readonly forward: pc.Vec3; /** * @name pc.GraphNode#enabled * @type {boolean} * @description Enable or disable a GraphNode. If one of the GraphNode's parents is disabled * there will be no other side effects. If all the parents are enabled then * the new value will activate / deactivate all the enabled children of the GraphNode. */ enabled: boolean; /** * @readonly * @name pc.GraphNode#parent * @type {pc.GraphNode} * @description A read-only property to get a parent graph node. */ readonly parent: pc.GraphNode; /** * @readonly * @name pc.GraphNode#path * @type {string} * @description A read-only property to get the path of the graph node relative to * the root of the hierarchy. */ readonly path: string; /** * @readonly * @name pc.GraphNode#root * @type {pc.GraphNode} * @description A read-only property to get highest graph node from current node. */ readonly root: pc.GraphNode; /** * @readonly * @name pc.GraphNode#children * @type {pc.GraphNode[]} * @description A read-only property to get the children of this graph node. */ readonly children: pc.GraphNode[]; /** * @readonly * @name pc.GraphNode#graphDepth * @type {number} * @description A read-only property to get the depth of this child within the graph. Note that for performance reasons this is only recalculated when a node is added to a new parent, i.e. It is not recalculated when a node is simply removed from the graph. */ readonly graphDepth: number; /** * @function * @name pc.GraphNode#find * @description Search the graph node and all of its descendants for the nodes that satisfy some search criteria. * @param {pc.callbacks.FindNode|string} attr - This can either be a function or a string. If it's a function, it is executed * for each descendant node to test if node satisfies the search logic. Returning true from the function will * include the node into the results. If it's a string then it represents the name of a field or a method of the * node. If this is the name of a field then the value passed as the second argument will be checked for equality. * If this is the name of a function then the return value of the function will be checked for equality against * the valued passed as the second argument to this function. * @param {object} [value] - If the first argument (attr) is a property name then this value will be checked against * the value of the property. * @returns {pc.GraphNode[]} The array of graph nodes that match the search criteria. * @example * // Finds all nodes that have a model component and have `door` in their lower-cased name * var doors = house.find(function (node) { * return node.model && node.name.toLowerCase().indexOf('door') !== -1; * }); * @example * // Finds all nodes that have the name property set to 'Test' * var entities = parent.find('name', 'Test'); */ find(attr: pc.callbacks.FindNode | string, value?: any): pc.GraphNode[]; /** * @function * @name pc.GraphNode#findOne * @description Search the graph node and all of its descendants for the first node that satisfies some search criteria. * @param {pc.callbacks.FindNode|string} attr - This can either be a function or a string. If it's a function, it is executed * for each descendant node to test if node satisfies the search logic. Returning true from the function will * result in that node being returned from findOne. If it's a string then it represents the name of a field or a method of the * node. If this is the name of a field then the value passed as the second argument will be checked for equality. * If this is the name of a function then the return value of the function will be checked for equality against * the valued passed as the second argument to this function. * @param {object} [value] - If the first argument (attr) is a property name then this value will be checked against * the value of the property. * @returns {pc.GraphNode} A graph node that match the search criteria. * @example * // Find the first node that is called `head` and has a model component * var head = player.findOne(function (node) { * return node.model && node.name === 'head'; * }); * @example * // Finds the first node that has the name property set to 'Test' * var node = parent.findOne('name', 'Test'); */ findOne(attr: pc.callbacks.FindNode | string, value?: any): pc.GraphNode; /** * @function * @name pc.GraphNode#findByTag * @description Return all graph nodes that satisfy the search query. * Query can be simply a string, or comma separated strings, * to have inclusive results of assets that match at least one query. * A query that consists of an array of tags can be used to match graph nodes that have each tag of array. * @param {string} query - Name of a tag or array of tags. * @returns {pc.GraphNode[]} A list of all graph nodes that match the query. * @example * // Return all graph nodes that tagged by `animal` * var animals = node.findByTag("animal"); * @example * // Return all graph nodes that tagged by `bird` OR `mammal` * var birdsAndMammals = node.findByTag("bird", "mammal"); * @example * // Return all assets that tagged by `carnivore` AND `mammal` * var meatEatingMammals = node.findByTag(["carnivore", "mammal"]); * @example * // Return all assets that tagged by (`carnivore` AND `mammal`) OR (`carnivore` AND `reptile`) * var meatEatingMammalsAndReptiles = node.findByTag(["carnivore", "mammal"], ["carnivore", "reptile"]); */ findByTag(query: string): pc.GraphNode[]; /** * @function * @name pc.GraphNode#findByName * @description Get the first node found in the graph with the name. The search * is depth first. * @param {string} name - The name of the graph. * @returns {pc.GraphNode} The first node to be found matching the supplied name. */ findByName(name: string): pc.GraphNode; /** * @function * @name pc.GraphNode#findByPath * @description Get the first node found in the graph by its full path in the graph. * The full path has this form 'parent/child/sub-child'. The search is depth first. * @param {string} path - The full path of the pc.GraphNode. * @returns {pc.GraphNode} The first node to be found matching the supplied path. * @example * var path = this.entity.findByPath('child/another_child'); */ findByPath(path: string): pc.GraphNode; /** * @function * @name pc.GraphNode#forEach * @description Executes a provided function once on this graph node and all of its descendants. * @param {pc.callbacks.ForEach} callback - The function to execute on the graph node and each descendant. * @param {object} [thisArg] - Optional value to use as this when executing callback function. * @example * // Log the path and name of each node in descendant tree starting with "parent" * parent.forEach(function (node) { * console.log(node.path + "/" + node.name); * }); */ forEach(callback: pc.callbacks.ForEach, thisArg?: any): void; /** * @function * @name pc.GraphNode#isDescendantOf * @description Check if node is descendant of another node. * @param {pc.GraphNode} node - Potential ancestor of node. * @returns {boolean} If node is descendant of another node. * @example * if (roof.isDescendantOf(house)) { * // roof is descendant of house entity * } */ isDescendantOf(node: pc.GraphNode): boolean; /** * @function * @name pc.GraphNode#isAncestorOf * @description Check if node is ancestor for another node. * @param {pc.GraphNode} node - Potential descendant of node. * @returns {boolean} If node is ancestor for another node. * @example * if (body.isAncestorOf(foot)) { * // foot is within body's hierarchy * } */ isAncestorOf(node: pc.GraphNode): boolean; /** * @function * @name pc.GraphNode#getEulerAngles * @description Get the world space rotation for the specified GraphNode in Euler angle * form. The order of the returned Euler angles is XYZ. The value returned by this function * should be considered read-only. In order to set the world-space rotation of the graph * node, use {@link pc.GraphNode#setEulerAngles}. * @returns {pc.Vec3} The world space rotation of the graph node in Euler angle form. * @example * var angles = this.entity.getEulerAngles(); // [0,0,0] * angles[1] = 180; // rotate the entity around Y by 180 degrees * this.entity.setEulerAngles(angles); */ getEulerAngles(): pc.Vec3; /** * @function * @name pc.GraphNode#getLocalEulerAngles * @description Get the rotation in local space for the specified GraphNode. The rotation * is returned as euler angles in a 3-dimensional vector where the order is XYZ. The * returned vector should be considered read-only. To update the local rotation, use * {@link pc.GraphNode#setLocalEulerAngles}. * @returns {pc.Vec3} The local space rotation of the graph node as euler angles in XYZ order. * @example * var angles = this.entity.getLocalEulerAngles(); * angles[1] = 180; * this.entity.setLocalEulerAngles(angles); */ getLocalEulerAngles(): pc.Vec3; /** * @function * @name pc.GraphNode#getLocalPosition * @description Get the position in local space for the specified GraphNode. The position * is returned as a 3-dimensional vector. The returned vector should be considered read-only. * To update the local position, use {@link pc.GraphNode#setLocalPosition}. * @returns {pc.Vec3} The local space position of the graph node. * @example * var position = this.entity.getLocalPosition(); * position[0] += 1; // move the entity 1 unit along x. * this.entity.setLocalPosition(position); */ getLocalPosition(): pc.Vec3; /** * @function * @name pc.GraphNode#getLocalRotation * @description Get the rotation in local space for the specified GraphNode. The rotation * is returned as a quaternion. The returned quaternion should be considered read-only. * To update the local rotation, use {@link pc.GraphNode#setLocalRotation}. * @returns {pc.Quat} The local space rotation of the graph node as a quaternion. * @example * var rotation = this.entity.getLocalRotation(); */ getLocalRotation(): pc.Quat; /** * @function * @name pc.GraphNode#getLocalScale * @description Get the scale in local space for the specified GraphNode. The scale * is returned as a 3-dimensional vector. The returned vector should be considered read-only. * To update the local scale, use {@link pc.GraphNode#setLocalScale}. * @returns {pc.Vec3} The local space scale of the graph node. * @example * var scale = this.entity.getLocalScale(); * scale.x = 100; * this.entity.setLocalScale(scale); */ getLocalScale(): pc.Vec3; /** * @function * @name pc.GraphNode#getLocalTransform * @description Get the local transform matrix for this graph node. This matrix * is the transform relative to the node's parent's world transformation matrix. * @returns {pc.Mat4} The node's local transformation matrix. * @example * var transform = this.entity.getLocalTransform(); */ getLocalTransform(): pc.Mat4; /** * @function * @name pc.GraphNode#getPosition * @description Get the world space position for the specified GraphNode. The * value returned by this function should be considered read-only. In order to set * the world-space position of the graph node, use {@link pc.GraphNode#setPosition}. * @returns {pc.Vec3} The world space position of the graph node. * @example * var position = this.entity.getPosition(); * position.x = 10; * this.entity.setPosition(position); */ getPosition(): pc.Vec3; /** * @function * @name pc.GraphNode#getRotation * @description Get the world space rotation for the specified GraphNode in quaternion * form. The value returned by this function should be considered read-only. In order * to set the world-space rotation of the graph node, use {@link pc.GraphNode#setRotation}. * @returns {pc.Quat} The world space rotation of the graph node as a quaternion. * @example * var rotation = this.entity.getRotation(); */ getRotation(): pc.Quat; /** * @function * @name pc.GraphNode#getWorldTransform * @description Get the world transformation matrix for this graph node. * @returns {pc.Mat4} The node's world transformation matrix. * @example * var transform = this.entity.getWorldTransform(); */ getWorldTransform(): pc.Mat4; /** * @function * @name pc.GraphNode#reparent * @description Remove graph node from current parent and add as child to new parent. * @param {pc.GraphNode} parent - New parent to attach graph node to. * @param {number} [index] - The child index where the child node should be placed. */ reparent(parent: pc.GraphNode, index?: number): void; /** * @function * @name pc.GraphNode#setLocalEulerAngles * @description Sets the local-space rotation of the specified graph node using euler angles. * Eulers are interpreted in XYZ order. Eulers must be specified in degrees. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * local-space euler rotation. * @param {pc.Vec3|number} x - 3-dimensional vector holding eulers or rotation around local-space * x-axis in degrees. * @param {number} [y] - Rotation around local-space y-axis in degrees. * @param {number} [z] - Rotation around local-space z-axis in degrees. * @example * // Set rotation of 90 degrees around y-axis via 3 numbers * this.entity.setLocalEulerAngles(0, 90, 0); * @example * // Set rotation of 90 degrees around y-axis via a vector * var angles = new pc.Vec3(0, 90, 0); * this.entity.setLocalEulerAngles(angles); */ setLocalEulerAngles(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#setLocalPosition * @description Sets the local-space position of the specified graph node. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * local-space position. * @param {pc.Vec3|number} x - 3-dimensional vector holding local-space position or * x-coordinate of local-space position. * @param {number} [y] - Y-coordinate of local-space position. * @param {number} [z] - Z-coordinate of local-space position. * @example * // Set via 3 numbers * this.entity.setLocalPosition(0, 10, 0); * @example * // Set via vector * var pos = new pc.Vec3(0, 10, 0); * this.entity.setLocalPosition(pos); */ setLocalPosition(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#setLocalRotation * @description Sets the local-space rotation of the specified graph node. This function * has two valid signatures: you can either pass a quaternion or 3 numbers to specify the * local-space rotation. * @param {pc.Quat|number} x - Quaternion holding local-space rotation or x-component of * local-space quaternion rotation. * @param {number} [y] - Y-component of local-space quaternion rotation. * @param {number} [z] - Z-component of local-space quaternion rotation. * @param {number} [w] - W-component of local-space quaternion rotation. * @example * // Set via 4 numbers * this.entity.setLocalRotation(0, 0, 0, 1); * @example * // Set via quaternion * var q = pc.Quat(); * this.entity.setLocalRotation(q); */ setLocalRotation(x: pc.Quat | number, y?: number, z?: number, w?: number): void; /** * @function * @name pc.GraphNode#setLocalScale * @description Sets the local-space scale factor of the specified graph node. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * local-space scale. * @param {pc.Vec3|number} x - 3-dimensional vector holding local-space scale or x-coordinate * of local-space scale. * @param {number} [y] - Y-coordinate of local-space scale. * @param {number} [z] - Z-coordinate of local-space scale. * @example * // Set via 3 numbers * this.entity.setLocalScale(10, 10, 10); * @example * // Set via vector * var scale = new pc.Vec3(10, 10, 10); * this.entity.setLocalScale(scale); */ setLocalScale(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#setPosition * @description Sets the world-space position of the specified graph node. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * world-space position. * @param {pc.Vec3|number} x - 3-dimensional vector holding world-space position or * x-coordinate of world-space position. * @param {number} [y] - Y-coordinate of world-space position. * @param {number} [z] - Z-coordinate of world-space position. * @example * // Set via 3 numbers * this.entity.setPosition(0, 10, 0); * @example * // Set via vector * var position = new pc.Vec3(0, 10, 0); * this.entity.setPosition(position); */ setPosition(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#setRotation * @description Sets the world-space rotation of the specified graph node. This function * has two valid signatures: you can either pass a quaternion or 3 numbers to specify the * world-space rotation. * @param {pc.Quat|number} x - Quaternion holding world-space rotation or x-component of * world-space quaternion rotation. * @param {number} [y] - Y-component of world-space quaternion rotation. * @param {number} [z] - Z-component of world-space quaternion rotation. * @param {number} [w] - W-component of world-space quaternion rotation. * @example * // Set via 4 numbers * this.entity.setRotation(0, 0, 0, 1); * @example * // Set via quaternion * var q = pc.Quat(); * this.entity.setRotation(q); */ setRotation(x: pc.Quat | number, y?: number, z?: number, w?: number): void; /** * @function * @name pc.GraphNode#setEulerAngles * @description Sets the world-space rotation of the specified graph node using euler angles. * Eulers are interpreted in XYZ order. Eulers must be specified in degrees. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * world-space euler rotation. * @param {pc.Vec3|number} x - 3-dimensional vector holding eulers or rotation around world-space * x-axis in degrees. * @param {number} [y] - Rotation around world-space y-axis in degrees. * @param {number} [z] - Rotation around world-space z-axis in degrees. * @example * // Set rotation of 90 degrees around world-space y-axis via 3 numbers * this.entity.setEulerAngles(0, 90, 0); * @example * // Set rotation of 90 degrees around world-space y-axis via a vector * var angles = new pc.Vec3(0, 90, 0); * this.entity.setEulerAngles(angles); */ setEulerAngles(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#addChild * @description Add a new child to the child list and update the parent value of the child node. * @param {pc.GraphNode} node - The new child to add. * @example * var e = new pc.Entity(app); * this.entity.addChild(e); */ addChild(node: pc.GraphNode): void; /** * @function * @name pc.GraphNode#insertChild * @description Insert a new child to the child list at the specified index and update the parent value of the child node. * @param {pc.GraphNode} node - The new child to insert. * @param {number} index - The index in the child list of the parent where the new node will be inserted. * @example * var e = new pc.Entity(app); * this.entity.insertChild(e, 1); */ insertChild(node: pc.GraphNode, index: number): void; /** * @function * @name pc.GraphNode#removeChild * @description Remove the node from the child list and update the parent value of the child. * @param {pc.GraphNode} child - The node to remove. * @example * var child = this.entity.children[0]; * this.entity.removeChild(child); */ removeChild(child: pc.GraphNode): void; /** * @function * @name pc.GraphNode#lookAt * @description Reorients the graph node so that the negative z-axis points towards the target. * This function has two valid signatures. Either pass 3D vectors for the look at coordinate and up * vector, or pass numbers to represent the vectors. * @param {pc.Vec3|number} x - If passing a 3D vector, this is the world-space coordinate to look at. * Otherwise, it is the x-component of the world-space coordinate to look at. * @param {pc.Vec3|number} y - If passing a 3D vector, this is the world-space up vector for look at * transform. Otherwise, it is the y-component of the world-space coordinate to look at. * @param {number} z - Z-component of the world-space coordinate to look at. * @param {number} [ux=0] - X-component of the up vector for the look at transform. * @param {number} [uy=1] - Y-component of the up vector for the look at transform. * @param {number} [uz=0] - Z-component of the up vector for the look at transform. * @example * // Look at another entity, using the (default) positive y-axis for up * var position = otherEntity.getPosition(); * this.entity.lookAt(position); * @example * // Look at another entity, using the negative world y-axis for up * var position = otherEntity.getPosition(); * this.entity.lookAt(position, pc.Vec3.DOWN); * @example * // Look at the world space origin, using the (default) positive y-axis for up * this.entity.lookAt(0, 0, 0); * @example * // Look at world-space coordinate [10, 10, 10], using the negative world y-axis for up * this.entity.lookAt(10, 10, 10, 0, -1, 0); */ lookAt(x: pc.Vec3 | number, y: pc.Vec3 | number, z: number, ux?: number, uy?: number, uz?: number): void; /** * @function * @name pc.GraphNode#translate * @description Translates the graph node in world-space by the specified translation vector. * This function has two valid signatures: you can either pass a 3D vector or 3 numbers to * specify the world-space translation. * @param {pc.Vec3|number} x - 3-dimensional vector holding world-space translation or * x-coordinate of world-space translation. * @param {number} [y] - Y-coordinate of world-space translation. * @param {number} [z] - Z-coordinate of world-space translation. * @example * // Translate via 3 numbers * this.entity.translate(10, 0, 0); * @example * // Translate via vector * var t = new pc.Vec3(10, 0, 0); * this.entity.translate(t); */ translate(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#translateLocal * @description Translates the graph node in local-space by the specified translation vector. * This function has two valid signatures: you can either pass a 3D vector or 3 numbers to * specify the local-space translation. * @param {pc.Vec3|number} x - 3-dimensional vector holding local-space translation or * x-coordinate of local-space translation. * @param {number} [y] - Y-coordinate of local-space translation. * @param {number} [z] - Z-coordinate of local-space translation. * @example * // Translate via 3 numbers * this.entity.translateLocal(10, 0, 0); * @example * // Translate via vector * var t = new pc.Vec3(10, 0, 0); * this.entity.translateLocal(t); */ translateLocal(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#rotate * @description Rotates the graph node in world-space by the specified Euler angles. * Eulers are specified in degrees in XYZ order. This function has two valid signatures: * you can either pass a 3D vector or 3 numbers to specify the world-space rotation. * @param {pc.Vec3|number} x - 3-dimensional vector holding world-space rotation or * rotation around world-space x-axis in degrees. * @param {number} [y] - Rotation around world-space y-axis in degrees. * @param {number} [z] - Rotation around world-space z-axis in degrees. * @example * // Rotate via 3 numbers * this.entity.rotate(0, 90, 0); * @example * // Rotate via vector * var r = new pc.Vec3(0, 90, 0); * this.entity.rotate(r); */ rotate(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#rotateLocal * @description Rotates the graph node in local-space by the specified Euler angles. * Eulers are specified in degrees in XYZ order. This function has two valid signatures: * you can either pass a 3D vector or 3 numbers to specify the local-space rotation. * @param {pc.Vec3|number} x - 3-dimensional vector holding local-space rotation or * rotation around local-space x-axis in degrees. * @param {number} [y] - Rotation around local-space y-axis in degrees. * @param {number} [z] - Rotation around local-space z-axis in degrees. * @example * // Rotate via 3 numbers * this.entity.rotateLocal(0, 90, 0); * @example * // Rotate via vector * var r = new pc.Vec3(0, 90, 0); * this.entity.rotateLocal(r); */ rotateLocal(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Gets the {@link pc.AnimationComponent} attached to this entity. [read only] */ animation?: pc.AnimationComponent; /** * Gets the {@link pc.AudioSourceComponent} attached to this entity. [read only] */ audiolistener?: pc.AudioListenerComponent; /** * Gets the {@link pc.ButtonComponent} attached to this entity. [read only] */ button?: pc.ButtonComponent; /** * Gets the {@link pc.CameraComponent} attached to this entity. [read only] */ camera?: pc.CameraComponent; /** * Gets the {@link pc.CollisionComponent} attached to this entity. [read only] */ collision?: pc.CollisionComponent; /** * Gets the {@link pc.ElementComponent} attached to this entity. [read only] */ element?: pc.ElementComponent; /** * Gets the {@link pc.LayoutChildComponent} attached to this entity. [read only] */ layoutchild?: pc.LayoutChildComponent; /** * Gets the {@link pc.LayoutGroupComponent} attached to this entity. [read only] */ layoutgroup?: pc.LayoutGroupComponent; /** * Gets the {@link pc.LightComponent} attached to this entity. [read only] */ light?: pc.LightComponent; /** * Gets the {@link pc.ModelComponent} attached to this entity. [read only] */ model?: pc.ModelComponent; /** * Gets the {@link pc.ParticleSystemComponent} attached to this entity. [read only] */ particlesystem?: pc.ParticleSystemComponent; /** * Gets the {@link pc.RigidBodyComponent} attached to this entity. [read only] */ rigidbody?: pc.RigidBodyComponent; /** * Gets the {@link pc.ScreenComponent} attached to this entity. [read only] */ screen?: pc.ScreenComponent; /** * Gets the {@link pc.ScriptComponent} attached to this entity. [read only] */ script?: pc.ScriptComponent; /** * Gets the {@link pc.ScrollViewComponent} attached to this entity. [read only] */ scrollview?: pc.ScrollViewComponent; /** * Gets the {@link pc.SoundComponent} attached to this entity. [read only] */ sound?: pc.SoundComponent; /** * Gets the {@link pc.SpriteComponent} attached to this entity. [read only] */ sprite?: pc.SpriteComponent; } /** * @name pc.script * @namespace * @description The pc.script namespace holds the createLoadingScreen function that * is used to override the default PlayCanvas loading screen. */ namespace script { /** * @function * @name pc.script.createLoadingScreen * @description Handles the creation of the loading screen of the application. A script can subscribe to * the events of a {@link pc.Application} to show a loading screen, progress bar etc. In order for this to work * you need to set the project's loading screen script to the script that calls this method. * @param {pc.callbacks.CreateScreen} callback - A function which can set up and tear down a customised loading screen. * @example * pc.script.createLoadingScreen(function (app) { * var showSplashScreen = function () {}; * var hideSplashScreen = function () {}; * var showProgress = function (progress) {}; * app.on("preload:start", showSplashScreen); * app.on("preload:progress", showProgress); * app.on("start", hideSplashScreen); * }); */ function createLoadingScreen(callback: pc.callbacks.CreateScreen): void; } /** * @static * @readonly * @type {object} * @name pc.shaderChunks * @description Object containing all default shader chunks used by shader generators. */ const shaderChunks: any; /** * @class * @name pc.GraphicsDevice * @augments pc.EventHandler * @classdesc The graphics device manages the underlying graphics context. It is responsible * for submitting render state changes and graphics primitives to the hardware. A graphics * device is tied to a specific canvas HTML element. It is valid to have more than one * canvas element per page and create a new graphics device against each. * @description Creates a new graphics device. * @param {HTMLCanvasElement} canvas - The canvas to which the graphics device will render. * @param {object} [options] - Options passed when creating the WebGL context. More info {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext here}. * @property {HTMLCanvasElement} canvas The canvas DOM element that provides the underlying WebGL context used by the graphics device. * @property {boolean} textureFloatRenderable Determines if 32-bit floating-point textures can be used as frame buffer. [read only]. * @property {boolean} textureHalfFloatRenderable Determines if 16-bit floating-point textures can be used as frame buffer. [read only]. * @property {pc.ScopeSpace} scope The scope namespace for shader attributes and variables. [read only]. */ class GraphicsDevice extends pc.EventHandler { constructor(canvas: HTMLCanvasElement, options?: any); /** * @readonly * @name pc.GraphicsDevice#precision * @type {string} * @description The highest shader precision supported by this graphics device. Can be 'hiphp', 'mediump' or 'lowp'. */ readonly precision: string; /** * @readonly * @name pc.GraphicsDevice#maxCubeMapSize * @type {number} * @description The maximum supported dimension of a cube map. */ readonly maxCubeMapSize: number; /** * @readonly * @name pc.GraphicsDevice#maxTextureSize * @type {number} * @description The maximum supported dimension of a texture. */ readonly maxTextureSize: number; /** * @readonly * @name pc.GraphicsDevice#maxVolumeSize * @type {number} * @description The maximum supported dimension of a 3D texture (any axis). */ readonly maxVolumeSize: number; /** * @readonly * @name pc.GraphicsDevice#maxAnisotropy * @type {number} * @description The maximum supported texture anisotropy setting. */ readonly maxAnisotropy: number; /** * @readonly * @name pc.GraphicsDevice#supportsInstancing * @type {boolean} * @description True if hardware instancing is supported. */ readonly supportsInstancing: boolean; /** * @function * @name pc.GraphicsDevice#setViewport * @description Set the active rectangle for rendering on the specified device. * @param {number} x - The pixel space x-coordinate of the bottom left corner of the viewport. * @param {number} y - The pixel space y-coordinate of the bottom left corner of the viewport. * @param {number} w - The width of the viewport in pixels. * @param {number} h - The height of the viewport in pixels. */ setViewport(x: number, y: number, w: number, h: number): void; /** * @function * @name pc.GraphicsDevice#setScissor * @description Set the active scissor rectangle on the specified device. * @param {number} x - The pixel space x-coordinate of the bottom left corner of the scissor rectangle. * @param {number} y - The pixel space y-coordinate of the bottom left corner of the scissor rectangle. * @param {number} w - The width of the scissor rectangle in pixels. * @param {number} h - The height of the scissor rectangle in pixels. */ setScissor(x: number, y: number, w: number, h: number): void; /** * @function * @name pc.GraphicsDevice#updateBegin * @description Marks the beginning of a block of rendering. Internally, this function * binds the render target currently set on the device. This function should be matched * with a call to pc.GraphicsDevice#updateEnd. Calls to pc.GraphicsDevice#updateBegin * and pc.GraphicsDevice#updateEnd must not be nested. */ updateBegin(): void; /** * @function * @name pc.GraphicsDevice#updateEnd * @description Marks the end of a block of rendering. This function should be called * after a matching call to pc.GraphicsDevice#updateBegin. Calls to pc.GraphicsDevice#updateBegin * and pc.GraphicsDevice#updateEnd must not be nested. */ updateEnd(): void; /** * @function * @name pc.GraphicsDevice#draw * @description Submits a graphical primitive to the hardware for immediate rendering. * @param {object} primitive - Primitive object describing how to submit current vertex/index buffers defined as follows: * @param {number} primitive.type - The type of primitive to render. Can be: * * {@link pc.PRIMITIVE_POINTS} * * {@link pc.PRIMITIVE_LINES} * * {@link pc.PRIMITIVE_LINELOOP} * * {@link pc.PRIMITIVE_LINESTRIP} * * {@link pc.PRIMITIVE_TRIANGLES} * * {@link pc.PRIMITIVE_TRISTRIP} * * {@link pc.PRIMITIVE_TRIFAN} * @param {number} primitive.base - The offset of the first index or vertex to dispatch in the draw call. * @param {number} primitive.count - The number of indices or vertices to dispatch in the draw call. * @param {boolean} [primitive.indexed] - True to interpret the primitive as indexed, thereby using the currently set index buffer and false otherwise. * @param {number} [numInstances=1] - The number of instances to render when using ANGLE_instanced_arrays. Defaults to 1. * @example * // Render a single, unindexed triangle * device.draw({ * type: pc.PRIMITIVE_TRIANGLES, * base: 0, * count: 3, * indexed: false * }); */ draw(primitive: { type: number; base: number; count: number; indexed?: boolean; }, numInstances?: number): void; /** * @function * @name pc.GraphicsDevice#clear * @description Clears the frame buffer of the currently set render target. * @param {object} options - Optional options object that controls the behavior of the clear operation defined as follows: * @param {number[]} options.color - The color to clear the color buffer to in the range 0.0 to 1.0 for each component. * @param {number} options.depth - The depth value to clear the depth buffer to in the range 0.0 to 1.0. * @param {number} options.flags - The buffers to clear (the types being color, depth and stencil). Can be any bitwise * combination of: * * pc.CLEARFLAG_COLOR * * pc.CLEARFLAG_DEPTH * * pc.CLEARFLAG_STENCIL * @example * // Clear color buffer to black and depth buffer to 1.0 * device.clear(); * * // Clear just the color buffer to red * device.clear({ * color: [1, 0, 0, 1], * flags: pc.CLEARFLAG_COLOR * }); * * // Clear color buffer to yellow and depth to 1.0 * device.clear({ * color: [1, 1, 0, 1], * depth: 1.0, * flags: pc.CLEARFLAG_COLOR | pc.CLEARFLAG_DEPTH * }); */ clear(options: { color: number[]; depth: number; flags: number; }): void; /** * @function * @name pc.GraphicsDevice#setRenderTarget * @description Sets the specified render target on the device. If null * is passed as a parameter, the back buffer becomes the current target * for all rendering operations. * @param {pc.RenderTarget} renderTarget - The render target to activate. * @example * // Set a render target to receive all rendering output * device.setRenderTarget(renderTarget); * * // Set the back buffer to receive all rendering output * device.setRenderTarget(null); */ setRenderTarget(renderTarget: pc.RenderTarget): void; /** * @function * @name pc.GraphicsDevice#getRenderTarget * @description Queries the currently set render target on the device. * @returns {pc.RenderTarget} The current render target. * @example * // Get the current render target * var renderTarget = device.getRenderTarget(); */ getRenderTarget(): pc.RenderTarget; /** * @function * @name pc.GraphicsDevice#getDepthTest * @description Queries whether depth testing is enabled. * @returns {boolean} True if depth testing is enabled and false otherwise. * @example * var depthTest = device.getDepthTest(); * console.log('Depth testing is ' + depthTest ? 'enabled' : 'disabled'); */ getDepthTest(): boolean; /** * @function * @name pc.GraphicsDevice#setDepthTest * @description Enables or disables depth testing of fragments. Once this state * is set, it persists until it is changed. By default, depth testing is enabled. * @param {boolean} depthTest - True to enable depth testing and false otherwise. * @example * device.setDepthTest(true); */ setDepthTest(depthTest: boolean): void; /** * @function * @name pc.GraphicsDevice#setDepthFunc * @description Configures the depth test. * @param {number} func - A function to compare a new depth value with an existing z-buffer value and decide if to write a pixel. Can be: * * {@link pc.FUNC_NEVER}: don't draw * * {@link pc.FUNC_LESS}: draw if new depth < depth buffer * * {@link pc.FUNC_EQUAL}: draw if new depth == depth buffer * * {@link pc.FUNC_LESSEQUAL}: draw if new depth <= depth buffer * * {@link pc.FUNC_GREATER}: draw if new depth > depth buffer * * {@link pc.FUNC_NOTEQUAL}: draw if new depth != depth buffer * * {@link pc.FUNC_GREATEREQUAL}: draw if new depth >= depth buffer * * {@link pc.FUNC_ALWAYS}: always draw */ setDepthFunc(func: number): void; /** * @function * @name pc.GraphicsDevice#getDepthWrite * @description Queries whether writes to the depth buffer are enabled. * @returns {boolean} True if depth writing is enabled and false otherwise. * @example * var depthWrite = device.getDepthWrite(); * console.log('Depth writing is ' + depthWrite ? 'enabled' : 'disabled'); */ getDepthWrite(): boolean; /** * @function * @name pc.GraphicsDevice#setDepthWrite * @description Enables or disables writes to the depth buffer. Once this state * is set, it persists until it is changed. By default, depth writes are enabled. * @param {boolean} writeDepth - True to enable depth writing and false otherwise. * @example * device.setDepthWrite(true); */ setDepthWrite(writeDepth: boolean): void; /** * @function * @name pc.GraphicsDevice#setColorWrite * @description Enables or disables writes to the color buffer. Once this state * is set, it persists until it is changed. By default, color writes are enabled * for all color channels. * @param {boolean} writeRed - True to enable writing of the red channel and false otherwise. * @param {boolean} writeGreen - True to enable writing of the green channel and false otherwise. * @param {boolean} writeBlue - True to enable writing of the blue channel and false otherwise. * @param {boolean} writeAlpha - True to enable writing of the alpha channel and false otherwise. * @example * // Just write alpha into the frame buffer * device.setColorWrite(false, false, false, true); */ setColorWrite(writeRed: boolean, writeGreen: boolean, writeBlue: boolean, writeAlpha: boolean): void; /** * @function * @name pc.GraphicsDevice#getBlending * @description Queries whether blending is enabled. * @returns {boolean} True if blending is enabled and false otherwise. */ getBlending(): boolean; /** * @function * @name pc.GraphicsDevice#setBlending * @description Enables or disables blending. * @param {boolean} blending - True to enable blending and false to disable it. */ setBlending(blending: boolean): void; /** * @function * @name pc.GraphicsDevice#setStencilTest * @description Enables or disables stencil test. * @param {boolean} enable - True to enable stencil test and false to disable it. */ setStencilTest(enable: boolean): void; /** * @function * @name pc.GraphicsDevice#setStencilFunc * @description Configures stencil test for both front and back faces. * @param {number} func - A comparison function that decides if the pixel should be written, based on the current stencil buffer value, * reference value, and mask value. Can be: * * {@link pc.FUNC_NEVER}: never pass * * {@link pc.FUNC_LESS}: pass if (ref & mask) < (stencil & mask) * * {@link pc.FUNC_EQUAL}: pass if (ref & mask) == (stencil & mask) * * {@link pc.FUNC_LESSEQUAL}: pass if (ref & mask) <= (stencil & mask) * * {@link pc.FUNC_GREATER}: pass if (ref & mask) > (stencil & mask) * * {@link pc.FUNC_NOTEQUAL}: pass if (ref & mask) != (stencil & mask) * * {@link pc.FUNC_GREATEREQUAL}: pass if (ref & mask) >= (stencil & mask) * * {@link pc.FUNC_ALWAYS}: always pass * @param {number} ref - Reference value used in comparison. * @param {number} mask - Mask applied to stencil buffer value and reference value before comparison. */ setStencilFunc(func: number, ref: number, mask: number): void; /** * @function * @name pc.GraphicsDevice#setStencilFuncFront * @description Configures stencil test for front faces. * @param {number} func - A comparison function that decides if the pixel should be written, * based on the current stencil buffer value, reference value, and mask value. Can be: * * {@link pc.FUNC_NEVER}: never pass * * {@link pc.FUNC_LESS}: pass if (ref & mask) < (stencil & mask) * * {@link pc.FUNC_EQUAL}: pass if (ref & mask) == (stencil & mask) * * {@link pc.FUNC_LESSEQUAL}: pass if (ref & mask) <= (stencil & mask) * * {@link pc.FUNC_GREATER}: pass if (ref & mask) > (stencil & mask) * * {@link pc.FUNC_NOTEQUAL}: pass if (ref & mask) != (stencil & mask) * * {@link pc.FUNC_GREATEREQUAL}: pass if (ref & mask) >= (stencil & mask) * * {@link pc.FUNC_ALWAYS}: always pass * @param {number} ref - Reference value used in comparison. * @param {number} mask - Mask applied to stencil buffer value and reference value before comparison. */ setStencilFuncFront(func: number, ref: number, mask: number): void; /** * @function * @name pc.GraphicsDevice#setStencilFuncBack * @description Configures stencil test for back faces. * @param {number} func - A comparison function that decides if the pixel should be written, * based on the current stencil buffer value, reference value, and mask value. Can be: * * {@link pc.FUNC_NEVER}: never pass * * {@link pc.FUNC_LESS}: pass if (ref & mask) < (stencil & mask) * * {@link pc.FUNC_EQUAL}: pass if (ref & mask) == (stencil & mask) * * {@link pc.FUNC_LESSEQUAL}: pass if (ref & mask) <= (stencil & mask) * * {@link pc.FUNC_GREATER}: pass if (ref & mask) > (stencil & mask) * * {@link pc.FUNC_NOTEQUAL}: pass if (ref & mask) != (stencil & mask) * * {@link pc.FUNC_GREATEREQUAL}: pass if (ref & mask) >= (stencil & mask) * * {@link pc.FUNC_ALWAYS}: always pass * @param {number} ref - Reference value used in comparison. * @param {number} mask - Mask applied to stencil buffer value and reference value before comparison. */ setStencilFuncBack(func: number, ref: number, mask: number): void; /** * @function * @name pc.GraphicsDevice#setStencilOperation * @description Configures how stencil buffer values should be modified based on the result * of depth/stencil tests. Works for both front and back faces. * @param {number} fail - Action to take if stencil test is failed. * @param {number} zfail - Action to take if depth test is failed. * @param {number} zpass - Action to take if both depth and stencil test are passed * All arguments can be: * * {@link pc.STENCILOP_KEEP}: don't change the stencil buffer value * * {@link pc.STENCILOP_ZERO}: set value to zero * * {@link pc.STENCILOP_REPLACE}: replace value with the reference value (see {@link pc.GraphicsDevice#setStencilFunc}) * * {@link pc.STENCILOP_INCREMENT}: increment the value * * {@link pc.STENCILOP_INCREMENTWRAP}: increment the value, but wrap it to zero when it's larger than a maximum representable value * * {@link pc.STENCILOP_DECREMENT}: decrement the value * * {@link pc.STENCILOP_DECREMENTWRAP}: decrement the value, but wrap it to a maximum representable value, if the current value is 0 * * {@link pc.STENCILOP_INVERT}: invert the value bitwise * @param {number} writeMask - A bit mask applied to the reference value, when written. */ setStencilOperation(fail: number, zfail: number, zpass: number, writeMask: number): void; /** * @function * @name pc.GraphicsDevice#setStencilOperationFront * @description Configures how stencil buffer values should be modified based on the result * of depth/stencil tests. Works for front faces. * @param {number} fail - Action to take if stencil test is failed. * @param {number} zfail - Action to take if depth test is failed. * @param {number} zpass - Action to take if both depth and stencil test are passed * All arguments can be: * * {@link pc.STENCILOP_KEEP}: don't change the stencil buffer value * * {@link pc.STENCILOP_ZERO}: set value to zero * * {@link pc.STENCILOP_REPLACE}: replace value with the reference value (see {@link pc.GraphicsDevice#setStencilFunc}) * * {@link pc.STENCILOP_INCREMENT}: increment the value * * {@link pc.STENCILOP_INCREMENTWRAP}: increment the value, but wrap it to zero when it's larger than a maximum representable value * * {@link pc.STENCILOP_DECREMENT}: decrement the value * * {@link pc.STENCILOP_DECREMENTWRAP}: decrement the value, but wrap it to a maximum representable value, if the current value is 0 * * {@link pc.STENCILOP_INVERT}: invert the value bitwise * @param {number} writeMask - A bit mask applied to the reference value, when written. */ setStencilOperationFront(fail: number, zfail: number, zpass: number, writeMask: number): void; /** * @function * @name pc.GraphicsDevice#setStencilOperationBack * @description Configures how stencil buffer values should be modified based on the result * of depth/stencil tests. Works for back faces. * @param {number} fail - Action to take if stencil test is failed. * @param {number} zfail - Action to take if depth test is failed. * @param {number} zpass - Action to take if both depth and stencil test are passed * All arguments can be: * * {@link pc.STENCILOP_KEEP}: don't change the stencil buffer value * * {@link pc.STENCILOP_ZERO}: set value to zero * * {@link pc.STENCILOP_REPLACE}: replace value with the reference value (see {@link pc.GraphicsDevice#setStencilFunc}) * * {@link pc.STENCILOP_INCREMENT}: increment the value * * {@link pc.STENCILOP_INCREMENTWRAP}: increment the value, but wrap it to zero when it's larger than a maximum representable value * * {@link pc.STENCILOP_DECREMENT}: decrement the value * * {@link pc.STENCILOP_DECREMENTWRAP}: decrement the value, but wrap it to a maximum representable value, if the current value is 0 * * {@link pc.STENCILOP_INVERT}: invert the value bitwise * @param {number} writeMask - A bit mask applied to the reference value, when written. */ setStencilOperationBack(fail: number, zfail: number, zpass: number, writeMask: number): void; /** * @function * @name pc.GraphicsDevice#setBlendFunction * @description Configures blending operations. Both source and destination * blend modes can take the following values: * * {@link pc.BLENDMODE_ZERO} * * {@link pc.BLENDMODE_ONE} * * {@link pc.BLENDMODE_SRC_COLOR} * * {@link pc.BLENDMODE_ONE_MINUS_SRC_COLOR} * * {@link pc.BLENDMODE_DST_COLOR} * * {@link pc.BLENDMODE_ONE_MINUS_DST_COLOR} * * {@link pc.BLENDMODE_SRC_ALPHA} * * {@link pc.BLENDMODE_SRC_ALPHA_SATURATE} * * {@link pc.BLENDMODE_ONE_MINUS_SRC_ALPHA} * * {@link pc.BLENDMODE_DST_ALPHA} * * {@link pc.BLENDMODE_ONE_MINUS_DST_ALPHA} * @param {number} blendSrc - The source blend function. * @param {number} blendDst - The destination blend function. */ setBlendFunction(blendSrc: number, blendDst: number): void; /** * @function * @name pc.GraphicsDevice#setBlendFunctionSeparate * @description Configures blending operations. Both source and destination * blend modes can take the following values: * * {@link pc.BLENDMODE_ZERO} * * {@link pc.BLENDMODE_ONE} * * {@link pc.BLENDMODE_SRC_COLOR} * * {@link pc.BLENDMODE_ONE_MINUS_SRC_COLOR} * * {@link pc.BLENDMODE_DST_COLOR} * * {@link pc.BLENDMODE_ONE_MINUS_DST_COLOR} * * {@link pc.BLENDMODE_SRC_ALPHA} * * {@link pc.BLENDMODE_SRC_ALPHA_SATURATE} * * {@link pc.BLENDMODE_ONE_MINUS_SRC_ALPHA} * * {@link pc.BLENDMODE_DST_ALPHA} * * {@link pc.BLENDMODE_ONE_MINUS_DST_ALPHA} * @param {number} blendSrc - The source blend function. * @param {number} blendDst - The destination blend function. * @param {number} blendSrcAlpha - The separate source blend function for the alpha channel. * @param {number} blendDstAlpha - The separate destination blend function for the alpha channel. */ setBlendFunctionSeparate(blendSrc: number, blendDst: number, blendSrcAlpha: number, blendDstAlpha: number): void; /** * @function * @name pc.GraphicsDevice#setBlendEquation * @description Configures the blending equation. The default blend equation is * pc.BLENDEQUATION_ADD. * @param {number} blendEquation - The blend equation. Can be: * * {@link pc.BLENDEQUATION_ADD} * * {@link pc.BLENDEQUATION_SUBTRACT} * * {@link pc.BLENDEQUATION_REVERSE_SUBTRACT} * * {@link pc.BLENDEQUATION_MIN} * * {@link pc.BLENDEQUATION_MAX} * * Note that MIN and MAX modes require either EXT_blend_minmax or WebGL2 to work (check device.extBlendMinmax). */ setBlendEquation(blendEquation: number): void; /** * @function * @name pc.GraphicsDevice#setBlendEquationSeparate * @description Configures the blending equation. The default blend equation is * pc.BLENDEQUATION_ADD. * @param {number} blendEquation - The blend equation. Can be: * * {@link pc.BLENDEQUATION_ADD} * * {@link pc.BLENDEQUATION_SUBTRACT} * * {@link pc.BLENDEQUATION_REVERSE_SUBTRACT} * * {@link pc.BLENDEQUATION_MIN} * * {@link pc.BLENDEQUATION_MAX} * * Note that MIN and MAX modes require either EXT_blend_minmax or WebGL2 to work (check device.extBlendMinmax). * @param {number} blendAlphaEquation - A separate blend equation for the alpha channel. Accepts same values as blendEquation. */ setBlendEquationSeparate(blendEquation: number, blendAlphaEquation: number): void; /** * @function * @name pc.GraphicsDevice#setCullMode * @description Controls how triangles are culled based on their face direction. * The default cull mode is pc.CULLFACE_BACK. * @param {number} cullMode - The cull mode to set. Can be: * * {@link pc.CULLFACE_NONE} * * {@link pc.CULLFACE_BACK} * * {@link pc.CULLFACE_FRONT} * * {@link pc.CULLFACE_FRONTANDBACK} */ setCullMode(cullMode: number): void; /** * @function * @name pc.GraphicsDevice#setIndexBuffer * @description Sets the current index buffer on the graphics device. On subsequent * calls to pc.GraphicsDevice#draw, the specified index buffer will be used to provide * index data for any indexed primitives. * @param {pc.IndexBuffer} indexBuffer - The index buffer to assign to the device. */ setIndexBuffer(indexBuffer: pc.IndexBuffer): void; /** * @function * @name pc.GraphicsDevice#setVertexBuffer * @description Sets the current vertex buffer for a specific stream index on the graphics * device. On subsequent calls to pc.GraphicsDevice#draw, the specified vertex buffer will be * used to provide vertex data for any primitives. * @param {pc.VertexBuffer} vertexBuffer - The vertex buffer to assign to the device. * @param {number} stream - The stream index for the vertex buffer, indexed from 0 upwards. * @param {number} [vbOffset=0] - The byte offset into the vertex buffer data. Defaults to 0. */ setVertexBuffer(vertexBuffer: pc.VertexBuffer, stream: number, vbOffset?: number): void; /** * @function * @name pc.GraphicsDevice#setShader * @description Sets the active shader to be used during subsequent draw calls. * @param {pc.Shader} shader - The shader to set to assign to the device. * @returns {boolean} True if the shader was successfully set, false otherwise. */ setShader(shader: pc.Shader): boolean; /** * @function * @name pc.GraphicsDevice#resizeCanvas * @description Sets the width and height of the canvas, then fires the 'resizecanvas' event. * Note that the specified width and height values will be multiplied by the value of * {@link pc.GraphicsDevice#maxPixelRatio} to give the final resultant width and height for * the canvas. * @param {number} width - The new width of the canvas. * @param {number} height - The new height of the canvas. */ resizeCanvas(width: number, height: number): void; /** * @function * @name pc.GraphicsDevice#clearShaderCache * @description Frees memory from all shaders ever allocated with this device. */ clearShaderCache(): void; /** * @readonly * @name pc.GraphicsDevice#width * @type {number} * @description Width of the back buffer in pixels. */ readonly width: number; /** * @readonly * @name pc.GraphicsDevice#height * @type {number} * @description Height of the back buffer in pixels. */ readonly height: number; /** * @name pc.GraphicsDevice#fullscreen * @type {boolean} * @description Fullscreen mode. */ fullscreen: boolean; /** * @name pc.GraphicsDevice#maxPixelRatio * @type {number} * @description Maximum pixel ratio. */ maxPixelRatio: number; /** * @readonly * @name pc.GraphicsDevice#textureFloatHighPrecision * @type {number} * @description Check if high precision floating-point textures are supported. */ readonly textureFloatHighPrecision: number; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The canvas DOM element that provides the underlying WebGL context used by the graphics device. */ canvas: HTMLCanvasElement; /** * Determines if 32-bit floating-point textures can be used as frame buffer. [read only]. */ textureFloatRenderable: boolean; /** * Determines if 16-bit floating-point textures can be used as frame buffer. [read only]. */ textureHalfFloatRenderable: boolean; /** * The scope namespace for shader attributes and variables. [read only]. */ scope: pc.ScopeSpace; } /** * @constant * @name pc.ADDRESS_REPEAT * @type {number} * @description Ignores the integer part of texture coordinates, using only the fractional part. */ const ADDRESS_REPEAT: number; /** * @constant * @name pc.ADDRESS_CLAMP_TO_EDGE * @type {number} * @description Clamps texture coordinate to the range 0 to 1. */ const ADDRESS_CLAMP_TO_EDGE: number; /** * @constant * @name pc.ADDRESS_MIRRORED_REPEAT * @type {number} * @description Texture coordinate to be set to the fractional part if the integer part is even; if the integer part is odd, * then the texture coordinate is set to 1 minus the fractional part. */ const ADDRESS_MIRRORED_REPEAT: number; /** * @constant * @name pc.BLENDMODE_ZERO * @type {number} * @description Multiply all fragment components by zero. */ const BLENDMODE_ZERO: number; /** * @constant * @name pc.BLENDMODE_ONE * @type {number} * @description Multiply all fragment components by one. */ const BLENDMODE_ONE: number; /** * @constant * @name pc.BLENDMODE_SRC_COLOR * @type {number} * @description Multiply all fragment components by the components of the source fragment. */ const BLENDMODE_SRC_COLOR: number; /** * @constant * @name pc.BLENDMODE_ONE_MINUS_SRC_COLOR * @type {number} * @description Multiply all fragment components by one minus the components of the source fragment. */ const BLENDMODE_ONE_MINUS_SRC_COLOR: number; /** * @constant * @name pc.BLENDMODE_DST_COLOR * @type {number} * @description Multiply all fragment components by the components of the destination fragment. */ const BLENDMODE_DST_COLOR: number; /** * @constant * @name pc.BLENDMODE_ONE_MINUS_DST_COLOR * @type {number} * @description Multiply all fragment components by one minus the components of the destination fragment. */ const BLENDMODE_ONE_MINUS_DST_COLOR: number; /** * @constant * @name pc.BLENDMODE_SRC_ALPHA * @type {number} * @description Multiply all fragment components by the alpha value of the source fragment. */ const BLENDMODE_SRC_ALPHA: number; /** * @constant * @name pc.BLENDMODE_SRC_ALPHA_SATURATE * @type {number} * @description Multiply all fragment components by the alpha value of the source fragment. */ const BLENDMODE_SRC_ALPHA_SATURATE: number; /** * @constant * @name pc.BLENDMODE_ONE_MINUS_SRC_ALPHA * @type {number} * @description Multiply all fragment components by one minus the alpha value of the source fragment. */ const BLENDMODE_ONE_MINUS_SRC_ALPHA: number; /** * @constant * @name pc.BLENDMODE_DST_ALPHA * @type {number} * @description Multiply all fragment components by the alpha value of the destination fragment. */ const BLENDMODE_DST_ALPHA: number; /** * @constant * @name pc.BLENDMODE_ONE_MINUS_DST_ALPHA * @type {number} * @description Multiply all fragment components by one minus the alpha value of the destination fragment. */ const BLENDMODE_ONE_MINUS_DST_ALPHA: number; /** * @constant * @name pc.BLENDEQUATION_ADD * @type {number} * @description Add the results of the source and destination fragment multiplies. */ const BLENDEQUATION_ADD: number; /** * @constant * @name pc.BLENDEQUATION_SUBTRACT * @type {number} * @description Subtract the results of the source and destination fragment multiplies. */ const BLENDEQUATION_SUBTRACT: number; /** * @constant * @name pc.BLENDEQUATION_REVERSE_SUBTRACT * @type {number} * @description Reverse and subtract the results of the source and destination fragment multiplies. */ const BLENDEQUATION_REVERSE_SUBTRACT: number; /** * @constant * @name pc.BLENDEQUATION_MIN * @type {number} * @description Use the smallest value. Check app.graphicsDevice.extBlendMinmax for support. */ const BLENDEQUATION_MIN: number; /** * @constant * @name pc.BLENDEQUATION_MAX * @type {number} * @description Use the largest value. Check app.graphicsDevice.extBlendMinmax for support. */ const BLENDEQUATION_MAX: number; /** * @constant * @name pc.BUFFER_STATIC * @type {number} * @description The data store contents will be modified once and used many times. */ const BUFFER_STATIC: number; /** * @constant * @name pc.BUFFER_DYNAMIC * @type {number} * @description The data store contents will be modified repeatedly and used many times. */ const BUFFER_DYNAMIC: number; /** * @constant * @name pc.BUFFER_STREAM * @type {number} * @description The data store contents will be modified once and used at most a few times. */ const BUFFER_STREAM: number; /** * @constant * @name pc.BUFFER_GPUDYNAMIC * @type {number} * @description The data store contents will be modified repeatedly on the GPU and used many times. Optimal for transform feedback usage (WebGL2 only). */ const BUFFER_GPUDYNAMIC: number; /** * @constant * @name pc.CLEARFLAG_COLOR * @type {number} * @description Clear the color buffer. */ const CLEARFLAG_COLOR: number; /** * @constant * @name pc.CLEARFLAG_DEPTH * @type {number} * @description Clear the depth buffer. */ const CLEARFLAG_DEPTH: number; /** * @constant * @name pc.CLEARFLAG_STENCIL * @type {number} * @description Clear the stencil buffer. */ const CLEARFLAG_STENCIL: number; /** * @constant * @name pc.CUBEFACE_POSX * @type {number} * @description The positive X face of a cubemap. */ const CUBEFACE_POSX: number; /** * @constant * @name pc.CUBEFACE_NEGX * @type {number} * @description The negative X face of a cubemap. */ const CUBEFACE_NEGX: number; /** * @constant * @name pc.CUBEFACE_POSY * @type {number} * @description The positive Y face of a cubemap. */ const CUBEFACE_POSY: number; /** * @constant * @name pc.CUBEFACE_NEGY * @type {number} * @description The negative Y face of a cubemap. */ const CUBEFACE_NEGY: number; /** * @constant * @name pc.CUBEFACE_POSZ * @type {number} * @description The positive Z face of a cubemap. */ const CUBEFACE_POSZ: number; /** * @constant * @name pc.CUBEFACE_NEGZ * @type {number} * @description The negative Z face of a cubemap. */ const CUBEFACE_NEGZ: number; /** * @constant * @name pc.CULLFACE_NONE * @type {number} * @description No triangles are culled. */ const CULLFACE_NONE: number; /** * @constant * @name pc.CULLFACE_BACK * @type {number} * @description Triangles facing away from the view direction are culled. */ const CULLFACE_BACK: number; /** * @constant * @name pc.CULLFACE_FRONT * @type {number} * @description Triangles facing the view direction are culled. */ const CULLFACE_FRONT: number; /** * @constant * @name pc.CULLFACE_FRONTANDBACK * @type {number} * @description Triangles are culled regardless of their orientation with respect to the view * direction. Note that point or line primitives are unaffected by this render state. */ const CULLFACE_FRONTANDBACK: number; /** * @constant * @name pc.TYPE_INT8 * @type {number} * @description Signed byte vertex element type. */ const TYPE_INT8: number; /** * @constant * @name pc.TYPE_UINT8 * @type {number} * @description Unsigned byte vertex element type. */ const TYPE_UINT8: number; /** * @constant * @name pc.TYPE_INT16 * @type {number} * @description Signed short vertex element type. */ const TYPE_INT16: number; /** * @constant * @name pc.TYPE_UINT16 * @type {number} * @description Unsigned short vertex element type. */ const TYPE_UINT16: number; /** * @constant * @name pc.TYPE_INT32 * @type {number} * @description Signed integer vertex element type. */ const TYPE_INT32: number; /** * @constant * @name pc.TYPE_UINT32 * @type {number} * @description Unsigned integer vertex element type. */ const TYPE_UINT32: number; /** * @constant * @name pc.TYPE_FLOAT32 * @type {number} * @description Floating point vertex element type. */ const TYPE_FLOAT32: number; /** * @constant * @name pc.FILTER_NEAREST * @type {number} * @description Point sample filtering. */ const FILTER_NEAREST: number; /** * @constant * @name pc.FILTER_LINEAR * @type {number} * @description Bilinear filtering. */ const FILTER_LINEAR: number; /** * @constant * @name pc.FILTER_NEAREST_MIPMAP_NEAREST * @type {number} * @description Use the nearest neighbor in the nearest mipmap level. */ const FILTER_NEAREST_MIPMAP_NEAREST: number; /** * @constant * @name pc.FILTER_NEAREST_MIPMAP_LINEAR * @type {number} * @description Linearly interpolate in the nearest mipmap level. */ const FILTER_NEAREST_MIPMAP_LINEAR: number; /** * @constant * @name pc.FILTER_LINEAR_MIPMAP_NEAREST * @type {number} * @description Use the nearest neighbor after linearly interpolating between mipmap levels. */ const FILTER_LINEAR_MIPMAP_NEAREST: number; /** * @constant * @name pc.FILTER_LINEAR_MIPMAP_LINEAR * @type {number} * @description Linearly interpolate both the mipmap levels and between texels. */ const FILTER_LINEAR_MIPMAP_LINEAR: number; /** * @constant * @name pc.FUNC_NEVER * @type {number} * @description Never pass. */ const FUNC_NEVER: number; /** * @constant * @name pc.FUNC_LESS * @type {number} * @description Pass if (ref & mask) < (stencil & mask). */ const FUNC_LESS: number; /** * @constant * @name pc.FUNC_EQUAL * @type {number} * @description Pass if (ref & mask) == (stencil & mask). */ const FUNC_EQUAL: number; /** * @constant * @name pc.FUNC_LESSEQUAL * @type {number} * @description Pass if (ref & mask) <= (stencil & mask). */ const FUNC_LESSEQUAL: number; /** * @constant * @name pc.FUNC_GREATER * @type {number} * @description Pass if (ref & mask) > (stencil & mask). */ const FUNC_GREATER: number; /** * @constant * @name pc.FUNC_NOTEQUAL * @type {number} * @description Pass if (ref & mask) != (stencil & mask). */ const FUNC_NOTEQUAL: number; /** * @constant * @name pc.FUNC_GREATEREQUAL * @type {number} * @description Pass if (ref & mask) >= (stencil & mask). */ const FUNC_GREATEREQUAL: number; /** * @constant * @name pc.FUNC_ALWAYS * @type {number} * @description Always pass. */ const FUNC_ALWAYS: number; /** * @constant * @name pc.INDEXFORMAT_UINT8 * @type {number} * @description 8-bit unsigned vertex indices. */ const INDEXFORMAT_UINT8: number; /** * @constant * @name pc.INDEXFORMAT_UINT16 * @type {number} * @description 16-bit unsigned vertex indices. */ const INDEXFORMAT_UINT16: number; /** * @constant * @name pc.INDEXFORMAT_UINT32 * @type {number} * @description 32-bit unsigned vertex indices. */ const INDEXFORMAT_UINT32: number; /** * @constant * @name pc.PIXELFORMAT_A8 * @type {number} * @description 8-bit alpha. */ const PIXELFORMAT_A8: number; /** * @constant * @name pc.PIXELFORMAT_L8 * @type {number} * @description 8-bit luminance. */ const PIXELFORMAT_L8: number; /** * @constant * @name pc.PIXELFORMAT_L8_A8 * @type {number} * @description 8-bit luminance with 8-bit alpha. */ const PIXELFORMAT_L8_A8: number; /** * @constant * @name pc.PIXELFORMAT_R5_G6_B5 * @type {number} * @description 16-bit RGB (5-bits for red channel, 6 for green and 5 for blue). */ const PIXELFORMAT_R5_G6_B5: number; /** * @constant * @name pc.PIXELFORMAT_R5_G5_B5_A1 * @type {number} * @description 16-bit RGBA (5-bits for red channel, 5 for green, 5 for blue with 1-bit alpha). */ const PIXELFORMAT_R5_G5_B5_A1: number; /** * @constant * @name pc.PIXELFORMAT_R4_G4_B4_A4 * @type {number} * @description 16-bit RGBA (4-bits for red channel, 4 for green, 4 for blue with 4-bit alpha). */ const PIXELFORMAT_R4_G4_B4_A4: number; /** * @constant * @name pc.PIXELFORMAT_R8_G8_B8 * @type {number} * @description 24-bit RGB (8-bits for red channel, 8 for green and 8 for blue). */ const PIXELFORMAT_R8_G8_B8: number; /** * @constant * @name pc.PIXELFORMAT_R8_G8_B8_A8 * @type {number} * @description 32-bit RGBA (8-bits for red channel, 8 for green, 8 for blue with 8-bit alpha). */ const PIXELFORMAT_R8_G8_B8_A8: number; /** * @constant * @name pc.PIXELFORMAT_DXT1 * @type {number} * @description Block compressed format, storing 16 input pixels in 64 bits of output, consisting of two 16-bit RGB 5:6:5 color values and a 4x4 two bit lookup table. */ const PIXELFORMAT_DXT1: number; /** * @constant * @name pc.PIXELFORMAT_DXT3 * @type {number} * @description Block compressed format, storing 16 input pixels (corresponding to a 4x4 pixel block) into 128 bits of output, consisting of 64 bits of alpha channel data (4 bits for each pixel) followed by 64 bits of color data, encoded the same way as DXT1. */ const PIXELFORMAT_DXT3: number; /** * @constant * @name pc.PIXELFORMAT_DXT5 * @type {number} * @description Block compressed format, storing 16 input pixels into 128 bits of output, consisting of 64 bits of alpha channel data (two 8 bit alpha values and a 4x4 3 bit lookup table) followed by 64 bits of color data (encoded the same way as DXT1). */ const PIXELFORMAT_DXT5: number; /** * @constant * @name pc.PIXELFORMAT_RGB16F * @type {number} * @description 16-bit floating point RGB (16-bit float for each red, green and blue channels). */ const PIXELFORMAT_RGB16F: number; /** * @constant * @name pc.PIXELFORMAT_RGBA16F * @type {number} * @description 16-bit floating point RGBA (16-bit float for each red, green, blue and alpha channels). */ const PIXELFORMAT_RGBA16F: number; /** * @constant * @name pc.PIXELFORMAT_RGB32F * @type {number} * @description 32-bit floating point RGB (32-bit float for each red, green and blue channels). */ const PIXELFORMAT_RGB32F: number; /** * @constant * @name pc.PIXELFORMAT_RGBA32F * @type {number} * @description 32-bit floating point RGBA (32-bit float for each red, green, blue and alpha channels). */ const PIXELFORMAT_RGBA32F: number; /** * @constant * @name pc.PIXELFORMAT_R32F * @type {number} * @description 32-bit floating point single channel format (WebGL2 only). */ const PIXELFORMAT_R32F: number; /** * @constant * @name pc.PIXELFORMAT_DEPTH * @type {number} * @description A readable depth buffer format. */ const PIXELFORMAT_DEPTH: number; /** * @constant * @name pc.PIXELFORMAT_DEPTHSTENCIL * @type {number} * @description A readable depth/stencil buffer format (WebGL2 only). */ const PIXELFORMAT_DEPTHSTENCIL: number; /** * @constant * @name pc.PIXELFORMAT_111110F * @type {number} * @description A floating-point color-only format with 11 bits for red and green channels, and 10 bits for the blue channel (WebGL2 only). */ const PIXELFORMAT_111110F: number; /** * @constant * @name pc.PIXELFORMAT_SRGB * @type {number} * @description Color-only sRGB format (WebGL2 only). */ const PIXELFORMAT_SRGB: number; /** * @constant * @name pc.PIXELFORMAT_SRGBA * @type {number} * @description Color sRGB format with additional alpha channel (WebGL2 only). */ const PIXELFORMAT_SRGBA: number; /** * @constant * @name pc.PIXELFORMAT_ETC1 * @type {number} * @description ETC1 compressed format. */ const PIXELFORMAT_ETC1: number; /** * @constant * @name pc.PIXELFORMAT_ETC2_RGB * @type {number} * @description ETC2 (RGB) compressed format. */ const PIXELFORMAT_ETC2_RGB: number; /** * @constant * @name pc.PIXELFORMAT_ETC2_RGBA * @type {number} * @description ETC2 (RGBA) compressed format. */ const PIXELFORMAT_ETC2_RGBA: number; /** * @constant * @name pc.PIXELFORMAT_PVRTC_2BPP_RGB_1 * @type {number} * @description PVRTC (2BPP RGB) compressed format. */ const PIXELFORMAT_PVRTC_2BPP_RGB_1: number; /** * @constant * @name pc.PIXELFORMAT_PVRTC_2BPP_RGBA_1 * @type {number} * @description PVRTC (2BPP RGBA) compressed format. */ const PIXELFORMAT_PVRTC_2BPP_RGBA_1: number; /** * @constant * @name pc.PIXELFORMAT_PVRTC_4BPP_RGB_1 * @type {number} * @description PVRTC (4BPP RGB) compressed format. */ const PIXELFORMAT_PVRTC_4BPP_RGB_1: number; /** * @constant * @name pc.PIXELFORMAT_PVRTC_4BPP_RGBA_1 * @type {number} * @description PVRTC (4BPP RGBA) compressed format. */ const PIXELFORMAT_PVRTC_4BPP_RGBA_1: number; /** * @constant * @name pc.PIXELFORMAT_ASTC_4x4 * @type {number} * @description ATC compressed format with alpha channel in blocks of 4x4. */ const PIXELFORMAT_ASTC_4x4: number; /** * @constant * @name pc.PIXELFORMAT_ATC_RGB * @type {number} * @description ATC compressed format with no alpha channel. */ const PIXELFORMAT_ATC_RGB: number; /** * @constant * @name pc.PIXELFORMAT_ATC_RGBA * @type {number} * @description ATC compressed format with alpha channel. */ const PIXELFORMAT_ATC_RGBA: number; /** * @constant * @name pc.PRIMITIVE_POINTS * @type {number} * @description List of distinct points. */ const PRIMITIVE_POINTS: number; /** * @constant * @name pc.PRIMITIVE_LINES * @type {number} * @description Discrete list of line segments. */ const PRIMITIVE_LINES: number; /** * @constant * @name pc.PRIMITIVE_LINELOOP * @type {number} * @description List of points that are linked sequentially by line segments, with a closing line segment between the last and first points. */ const PRIMITIVE_LINELOOP: number; /** * @constant * @name pc.PRIMITIVE_LINESTRIP * @type {number} * @description List of points that are linked sequentially by line segments. */ const PRIMITIVE_LINESTRIP: number; /** * @constant * @name pc.PRIMITIVE_TRIANGLES * @type {number} * @description Discrete list of triangles. */ const PRIMITIVE_TRIANGLES: number; /** * @constant * @name pc.PRIMITIVE_TRISTRIP * @type {number} * @description Connected strip of triangles where a specified vertex forms a triangle using the previous two. */ const PRIMITIVE_TRISTRIP: number; /** * @constant * @name pc.PRIMITIVE_TRIFAN * @type {number} * @description Connected fan of triangles where the first vertex forms triangles with the following pairs of vertices. */ const PRIMITIVE_TRIFAN: number; /** * @constant * @name pc.SEMANTIC_POSITION * @type {string} * @description Vertex attribute to be treated as a position. */ const SEMANTIC_POSITION: string; /** * @constant * @name pc.SEMANTIC_NORMAL * @type {string} * @description Vertex attribute to be treated as a normal. */ const SEMANTIC_NORMAL: string; /** * @constant * @name pc.SEMANTIC_TANGENT * @type {string} * @description Vertex attribute to be treated as a tangent. */ const SEMANTIC_TANGENT: string; /** * @constant * @name pc.SEMANTIC_BLENDWEIGHT * @type {string} * @description Vertex attribute to be treated as skin blend weights. */ const SEMANTIC_BLENDWEIGHT: string; /** * @constant * @name pc.SEMANTIC_BLENDINDICES * @type {string} * @description Vertex attribute to be treated as skin blend indices. */ const SEMANTIC_BLENDINDICES: string; /** * @constant * @name pc.SEMANTIC_COLOR * @type {string} * @description Vertex attribute to be treated as a color. */ const SEMANTIC_COLOR: string; /** * @constant * @name pc.SEMANTIC_TEXCOORD0 * @type {string} * @description Vertex attribute to be treated as a texture coordinate (set 0). */ const SEMANTIC_TEXCOORD0: string; /** * @constant * @name pc.SEMANTIC_TEXCOORD1 * @type {string} * @description Vertex attribute to be treated as a texture coordinate (set 1). */ const SEMANTIC_TEXCOORD1: string; /** * @constant * @name pc.SEMANTIC_TEXCOORD2 * @type {string} * @description Vertex attribute to be treated as a texture coordinate (set 2). */ const SEMANTIC_TEXCOORD2: string; /** * @constant * @name pc.SEMANTIC_TEXCOORD3 * @type {string} * @description Vertex attribute to be treated as a texture coordinate (set 3). */ const SEMANTIC_TEXCOORD3: string; /** * @constant * @name pc.SEMANTIC_TEXCOORD4 * @type {string} * @description Vertex attribute to be treated as a texture coordinate (set 4). */ const SEMANTIC_TEXCOORD4: string; /** * @constant * @name pc.SEMANTIC_TEXCOORD5 * @type {string} * @description Vertex attribute to be treated as a texture coordinate (set 5). */ const SEMANTIC_TEXCOORD5: string; /** * @constant * @name pc.SEMANTIC_TEXCOORD6 * @type {string} * @description Vertex attribute to be treated as a texture coordinate (set 6). */ const SEMANTIC_TEXCOORD6: string; /** * @constant * @name pc.SEMANTIC_TEXCOORD7 * @type {string} * @description Vertex attribute to be treated as a texture coordinate (set 7). */ const SEMANTIC_TEXCOORD7: string; /** * @constant * @name pc.SEMANTIC_ATTR0 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR0: string; /** * @constant * @name pc.SEMANTIC_ATTR1 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR1: string; /** * @constant * @name pc.SEMANTIC_ATTR2 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR2: string; /** * @constant * @name pc.SEMANTIC_ATTR3 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR3: string; /** * @constant * @name pc.SEMANTIC_ATTR4 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR4: string; /** * @constant * @name pc.SEMANTIC_ATTR5 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR5: string; /** * @constant * @name pc.SEMANTIC_ATTR6 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR6: string; /** * @constant * @name pc.SEMANTIC_ATTR7 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR7: string; /** * @constant * @name pc.SEMANTIC_ATTR8 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR8: string; /** * @constant * @name pc.SEMANTIC_ATTR9 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR9: string; /** * @constant * @name pc.SEMANTIC_ATTR10 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR10: string; /** * @constant * @name pc.SEMANTIC_ATTR11 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR11: string; /** * @constant * @name pc.SEMANTIC_ATTR12 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR12: string; /** * @constant * @name pc.SEMANTIC_ATTR13 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR13: string; /** * @constant * @name pc.SEMANTIC_ATTR14 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR14: string; /** * @constant * @name pc.SEMANTIC_ATTR15 * @type {string} * @description Vertex attribute with a user defined semantic. */ const SEMANTIC_ATTR15: string; /** * @constant * @name pc.STENCILOP_KEEP * @type {number} * @description Don't change the stencil buffer value. */ const STENCILOP_KEEP: number; /** * @constant * @name pc.STENCILOP_ZERO * @type {number} * @description Set value to zero. */ const STENCILOP_ZERO: number; /** * @constant * @name pc.STENCILOP_REPLACE * @type {number} * @description Replace value with the reference value (see {@link pc.GraphicsDevice#setStencilFunc}). */ const STENCILOP_REPLACE: number; /** * @constant * @name pc.STENCILOP_INCREMENT * @type {number} * @description Increment the value. */ const STENCILOP_INCREMENT: number; /** * @constant * @name pc.STENCILOP_INCREMENTWRAP * @type {number} * @description Increment the value, but wrap it to zero when it's larger than a maximum representable value. */ const STENCILOP_INCREMENTWRAP: number; /** * @constant * @name pc.STENCILOP_DECREMENT * @type {number} * @description Decrement the value. */ const STENCILOP_DECREMENT: number; /** * @constant * @name pc.STENCILOP_DECREMENTWRAP * @type {number} * @description Decrement the value, but wrap it to a maximum representable value, if the current value is 0. */ const STENCILOP_DECREMENTWRAP: number; /** * @constant * @name pc.STENCILOP_INVERT * @type {number} * @description Invert the value bitwise. */ const STENCILOP_INVERT: number; /** * @constant * @name pc.TEXTURELOCK_READ * @type {number} * @description Read only. Any changes to the locked mip level's pixels will not update the texture. */ const TEXTURELOCK_READ: number; /** * @constant * @name pc.TEXTURELOCK_WRITE * @type {number} * @description Write only. The contents of the specified mip level will be entirely replaced. */ const TEXTURELOCK_WRITE: number; /** * @class * @name pc.IndexBuffer * @classdesc An index buffer is the mechanism via which the application specifies primitive * index data to the graphics hardware. * @description Creates a new index buffer. * @example * // Create an index buffer holding 3 16-bit indices * // The buffer is marked as static, hinting that the buffer will never be modified * var indexBuffer = new pc.IndexBuffer(graphicsDevice, pc.INDEXFORMAT_UINT16, 3, pc.BUFFER_STATIC); * @param {pc.GraphicsDevice} graphicsDevice - The graphics device used to manage this index buffer. * @param {number} format - The type of each index to be stored in the index buffer (see pc.INDEXFORMAT_*). * @param {number} numIndices - The number of indices to be stored in the index buffer. * @param {number} [usage] - The usage type of the vertex buffer (see pc.BUFFER_*). * @param {ArrayBuffer} [initialData] - Initial data. */ class IndexBuffer { constructor(graphicsDevice: pc.GraphicsDevice, format: number, numIndices: number, usage?: number, initialData?: ArrayBuffer); /** * @function * @name pc.IndexBuffer#destroy * @description Frees resources associated with this index buffer. */ destroy(): void; /** * @function * @name pc.IndexBuffer#getFormat * @description Returns the data format of the specified index buffer. * @returns {number} The data format of the specified index buffer (see pc.INDEXFORMAT_*). */ getFormat(): number; /** * @function * @name pc.IndexBuffer#getNumIndices * @description Returns the number of indices stored in the specified index buffer. * @returns {number} The number of indices stored in the specified index buffer. */ getNumIndices(): number; /** * @function * @name pc.IndexBuffer#lock * @description Gives access to the block of memory that stores the buffer's indices. * @returns {ArrayBuffer} A contiguous block of memory where index data can be written to. */ lock(): ArrayBuffer; /** * @function * @name pc.IndexBuffer#unlock * @description Signals that the block of memory returned by a call to the lock function is * ready to be given to the graphics hardware. Only unlocked index buffers can be set on the * currently active device. */ unlock(): void; } /** * @class * @name pc.PostEffect * @classdesc Base class for all post effects. Post effects take a a render target as input * apply effects to it and then render the result to an output render target or the screen * if no output is specified. * @description Creates new PostEffect. * @param {pc.GraphicsDevice} graphicsDevice - The graphics device of the application. * @property {pc.GraphicsDevice} device The graphics device of the application. [read only]. * @property {pc.VertexBuffer} vertexBuffer The vertex buffer for the fullscreen quad. Used when calling {@link pc.drawFullscreenQuad}. [read only]. * @property {pc.Shader|null} shader The shader definition for the fullscreen quad. Needs to be set by the custom post effect (default is null). Used when calling {@link pc.drawFullscreenQuad}. * @property {boolean} needsDepthBuffer The property that should to be set to `true` (by the custom post effect) if a depth map is necessary (default is false). */ class PostEffect { constructor(graphicsDevice: pc.GraphicsDevice); /** * @function * @name pc.PostEffect#render * @description Render the post effect using the specified inputTarget * to the specified outputTarget. * @param {pc.RenderTarget} inputTarget - The input render target. * @param {pc.RenderTarget} outputTarget - The output render target. If null then this will be the screen. * @param {pc.Vec4} rect - (Optional) The rect of the current camera. If not specified then it will default to [0,0,1,1]. */ render(inputTarget: pc.RenderTarget, outputTarget: pc.RenderTarget, rect: pc.Vec4): void; /** * The graphics device of the application. [read only]. */ device: pc.GraphicsDevice; /** * The vertex buffer for the fullscreen quad. Used when calling {@link pc.drawFullscreenQuad}. [read only]. */ vertexBuffer: pc.VertexBuffer; /** * The shader definition for the fullscreen quad. Needs to be set by the custom post effect (default is null). Used when calling {@link pc.drawFullscreenQuad}. */ shader: pc.Shader | null; /** * The property that should to be set to `true` (by the custom post effect) if a depth map is necessary (default is false). */ needsDepthBuffer: boolean; } /** * @static * @function * @name pc.drawFullscreenQuad * @description Draw a screen-space rectangle in a render target. Primarily meant to be used in custom post effects based on {@link pc.PostEffect}. * @param {pc.GraphicsDevice} device - The graphics device of the application. * @param {pc.RenderTarget} target - The output render target. * @param {pc.VertexBuffer} vertexBuffer - The vertex buffer for the rectangle mesh. When calling from a custom post effect, pass the field {@link pc.PostEffect#vertexBuffer}. * @param {pc.Shader} shader - The shader to be used for drawing the rectangle. When calling from a custom post effect, pass the field {@link pc.PostEffect#shader}. * @param {pc.Vec4} [rect] - The normalized screen-space position (rect.x, rect.y) and size (rect.z, rect.w) of the rectangle. Default is [0, 0, 1, 1]. */ function drawFullscreenQuad(device: pc.GraphicsDevice, target: pc.RenderTarget, vertexBuffer: pc.VertexBuffer, shader: pc.Shader, rect?: pc.Vec4): void; /** * @static * @function * @name pc.prefilterCubemap * @description Prefilter a cubemap for use by a {@link pc.StandardMaterial} as an environment map. Should only be used for cubemaps that can't be prefiltered ahead of time (in the editor). * @param {object} options - The options for how the cubemap is prefiltered. */ function prefilterCubemap(options: any): void; /** * @class * @name pc.RenderTarget * @classdesc A render target is a rectangular rendering surface. * @description Creates a new render target. A color buffer or a depth buffer must be set. * @param {object} options - Object for passing optional arguments. * @param {pc.Texture} [options.colorBuffer] - The texture that this render target will treat as a rendering surface. * @param {boolean} [options.depth] - If set to true, depth buffer will be created. Defaults to true. Ignored if depthBuffer is defined. * @param {boolean} [options.stencil] - If set to true, depth buffer will include stencil. Defaults to false. Ignored if depthBuffer is defined or depth is false. * @param {pc.Texture} [options.depthBuffer] - The texture that this render target will treat as a depth/stencil surface (WebGL2 only). If set, the 'depth' and 'stencil' properties are ignored. * Texture must have pc.PIXELFORMAT_DEPTH or PIXELFORMAT_DEPTHSTENCIL format. * @param {number} [options.samples] - Number of hardware anti-aliasing samples (WebGL2 only). Default is 1. * @param {boolean} [options.autoResolve] - If samples > 1, enables or disables automatic MSAA resolve after rendering to this RT (see pc.RenderTarget#resolve). Defaults to true; * Defaults to true. * @param {number} [options.face] - If the colorBuffer parameter is a cubemap, use this option to specify the * face of the cubemap to render to. Can be: * * * {@link pc.CUBEFACE_POSX} * * {@link pc.CUBEFACE_NEGX} * * {@link pc.CUBEFACE_POSY} * * {@link pc.CUBEFACE_NEGY} * * {@link pc.CUBEFACE_POSZ} * * {@link pc.CUBEFACE_NEGZ} * * Defaults to pc.CUBEFACE_POSX. * @example * // Create a 512x512x24-bit render target with a depth buffer * var colorBuffer = new pc.Texture(graphicsDevice, { * width: 512, * height: 512, * format: pc.PIXELFORMAT_R8_G8_B8 * }); * var renderTarget = new pc.RenderTarget({ * colorBuffer: colorBuffer, * depth: true * }); * * // Set the render target on a layer * layer.renderTarget = renderTarget; */ class RenderTarget { constructor(options: { colorBuffer?: pc.Texture; depth?: boolean; stencil?: boolean; depthBuffer?: pc.Texture; samples?: number; autoResolve?: boolean; face?: number; }); /** * @function * @name pc.RenderTarget#destroy * @description Frees resources associated with this render target. */ destroy(): void; /** * @function * @name pc.RenderTarget#resolve * @description If samples > 1, resolves the anti-aliased render target (WebGL2 only). * When you're rendering to an anti-aliased render target, pixels aren't written directly to the readable texture. * Instead, they're first written to a MSAA buffer, where each sample for each pixel is stored independently. * In order to read the results, you first need to 'resolve' the buffer - to average all samples and create a simple texture with one color per pixel. * This function performs this averaging and updates the colorBuffer and the depthBuffer. * If autoResolve is set to true, the resolve will happen after every rendering to this render target, otherwise you can do it manually, * during the app update or inside a pc.Command. * @param {boolean} color - Resolve color buffer. * @param {boolean} depth - Resolve depth buffer. */ resolve(color: boolean, depth: boolean): void; /** * @function * @name pc.RenderTarget#copy * @description Copies color and/or depth contents of source render target to this one. Formats, sizes and anti-aliasing samples must match. * Depth buffer can only be copied on WebGL 2.0. * @param {pc.RenderTarget} source - Source render target to copy from. * @param {boolean} color - Copy color buffer. * @param {boolean} depth - Copy depth buffer. * @returns {boolean} True if the copy was successfull, false otherwise. */ copy(source: pc.RenderTarget, color: boolean, depth: boolean): boolean; /** * @readonly * @name pc.RenderTarget#colorBuffer * @type {pc.Texture} * @description Color buffer set up on the render target. */ readonly colorBuffer: pc.Texture; /** * @readonly * @name pc.RenderTarget#depthBuffer * @type {pc.Texture} * @description Depth buffer set up on the render target. Only available, if depthBuffer was set in constructor. * Not available, if depth property was used instead. */ readonly depthBuffer: pc.Texture; /** * @readonly * @name pc.RenderTarget#face * @type {number} * @description If the render target is bound to a cubemap, this property * specifies which face of the cubemap is rendered to. Can be: * * * {@link pc.CUBEFACE_POSX} * * {@link pc.CUBEFACE_NEGX} * * {@link pc.CUBEFACE_POSY} * * {@link pc.CUBEFACE_NEGY} * * {@link pc.CUBEFACE_POSZ} * * {@link pc.CUBEFACE_NEGZ} */ readonly face: number; /** * @readonly * @name pc.RenderTarget#width * @type {number} * @description Width of the render target in pixels. */ readonly width: number; /** * @readonly * @name pc.RenderTarget#height * @type {number} * @description Height of the render target in pixels. */ readonly height: number; } /** * @class * @name pc.ScopeId * @classdesc The scope for a variable. * @param {string} name - The variable name. * @property {string} name The variable name. */ class ScopeId { constructor(name: string); /** * @function * @name pc.ScopeId#setValue * @description Set variable value. * @param {*} value - The value. */ setValue(value: any): void; /** * @function * @name pc.ScopeId#getValue * @description Get variable value. * @returns {*} The value. */ getValue(): any; /** * The variable name. */ name: string; } /** * @class * @name pc.ScopeSpace * @classdesc The scope for variables and subspaces. * @param {string} name - The scope name. * @property {string} name The scope name. */ class ScopeSpace { constructor(name: string); /** * @function * @name pc.ScopeSpace#resolve * @description Get (or create, if it doesn't already exist) a variable in the scope. * @param {string} name - The variable name. * @returns {pc.ScopeId} The variable instance. */ resolve(name: string): pc.ScopeId; /** * @function * @name pc.ScopeSpace#getSubSpace * @description Get (or create, if it doesn't already exist) a subspace in the scope. * @param {string} name - The subspace name. * @returns {pc.ScopeSpace} The subspace instance. */ getSubSpace(name: string): pc.ScopeSpace; /** * The scope name. */ name: string; } /** * @class * @name pc.Shader * @classdesc A shader is a program that is responsible for rendering graphical primitives on a device's * graphics processor. The shader is generated from a shader definition. This shader definition specifies * the code for processing vertices and fragments processed by the GPU. The language of the code is GLSL * (or more specifically ESSL, the OpenGL ES Shading Language). The shader definition also describes how * the PlayCanvas engine should map vertex buffer elements onto the attributes specified in the vertex * shader code. * @description Creates a new shader object. * @param {pc.GraphicsDevice} graphicsDevice - The graphics device used to manage this shader. * @param {object} definition - The shader definition from which to build the shader. * @param {object} definition.attributes - Object detailing the mapping of vertex shader attribute names * to semantics (pc.SEMANTIC_*). This enables the engine to match vertex buffer data as inputs to the * shader. * @param {string} definition.vshader - Vertex shader source (GLSL code). * @param {string} definition.fshader - Fragment shader source (GLSL code). * @param {boolean} [definition.useTransformFeedback] - Specifies that this shader outputs post-VS data to a buffer. * @example * // Create a shader that renders primitives with a solid red color * var shaderDefinition = { * attributes: { * aPosition: pc.SEMANTIC_POSITION * }, * vshader: [ * "attribute vec3 aPosition;", * "", * "void main(void)", * "{", * " gl_Position = vec4(aPosition, 1.0);", * "}" * ].join("\n"), * fshader: [ * "precision " + graphicsDevice.precision + " float;", * "", * "void main(void)", * "{", * " gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);", * "}" * ].join("\n") * }; * * var shader = new pc.Shader(graphicsDevice, shaderDefinition); */ class Shader { constructor(graphicsDevice: pc.GraphicsDevice, definition: { attributes: any; vshader: string; fshader: string; useTransformFeedback?: boolean; }); /** * @function * @name pc.Shader#destroy * @description Frees resources associated with this shader. */ destroy(): void; } /** * @class * @name pc.Texture * @classdesc A texture is a container for texel data that can be utilized in a fragment shader. * Typically, the texel data represents an image that is mapped over geometry. * @description Creates a new texture. * @param {pc.GraphicsDevice} graphicsDevice - The graphics device used to manage this texture. * @param {object} [options] - Object for passing optional arguments. * @param {string} [options.name] - The name of the texture. * @param {number} [options.width] - The width of the texture in pixels. Defaults to 4. * @param {number} [options.height] - The height of the texture in pixels. Defaults to 4. * @param {number} [options.depth] - The number of depth slices in a 3D texture (WebGL2 only). Defaults to 1 (single 2D image). * @param {number} [options.format] - The pixel format of the texture. Can be: * * {@link pc.PIXELFORMAT_A8} * * {@link pc.PIXELFORMAT_L8} * * {@link pc.PIXELFORMAT_L8_A8} * * {@link pc.PIXELFORMAT_R5_G6_B5} * * {@link pc.PIXELFORMAT_R5_G5_B5_A1} * * {@link pc.PIXELFORMAT_R4_G4_B4_A4} * * {@link pc.PIXELFORMAT_R8_G8_B8} * * {@link pc.PIXELFORMAT_R8_G8_B8_A8} * * {@link pc.PIXELFORMAT_DXT1} * * {@link pc.PIXELFORMAT_DXT3} * * {@link pc.PIXELFORMAT_DXT5} * * {@link pc.PIXELFORMAT_RGB16F} * * {@link pc.PIXELFORMAT_RGBA16F} * * {@link pc.PIXELFORMAT_RGB32F} * * {@link pc.PIXELFORMAT_RGBA32F} * * {@link pc.PIXELFORMAT_ETC1} * * {@link pc.PIXELFORMAT_PVRTC_2BPP_RGB_1} * * {@link pc.PIXELFORMAT_PVRTC_2BPP_RGBA_1} * * {@link pc.PIXELFORMAT_PVRTC_4BPP_RGB_1} * * {@link pc.PIXELFORMAT_PVRTC_4BPP_RGBA_1} * * {@link pc.PIXELFORMAT_111110F} * * {@link pc.PIXELFORMAT_ASTC_4x4}>/li> * * {@link pc.PIXELFORMAT_ATC_RGB} * * {@link pc.PIXELFORMAT_ATC_RGBA} * Defaults to pc.PIXELFORMAT_R8_G8_B8_A8. * @param {number} [options.minFilter] - The minification filter type to use. Defaults to {@link pc.FILTER_LINEAR_MIPMAP_LINEAR} * @param {number} [options.magFilter] - The magnification filter type to use. Defaults to {@link pc.FILTER_LINEAR} * @param {number} [options.anisotropy] - The level of anisotropic filtering to use. Defaults to 1 * @param {number} [options.addressU] - The repeat mode to use in the U direction. Defaults to {@link pc.ADDRESS_REPEAT} * @param {number} [options.addressV] - The repeat mode to use in the V direction. Defaults to {@link pc.ADDRESS_REPEAT} * @param {number} [options.addressW] - The repeat mode to use in the W direction. Defaults to {@link pc.ADDRESS_REPEAT} * @param {boolean} [options.mipmaps] - When enabled try to generate or use mipmaps for this texture. Default is true * @param {boolean} [options.cubemap] - Specifies whether the texture is to be a cubemap. Defaults to false. * @param {boolean} [options.volume] - Specifies whether the texture is to be a 3D volume (WebGL2 only). Defaults to false. * @param {boolean} [options.rgbm] - Specifies whether the texture contains RGBM-encoded HDR data. Defaults to false. * @param {boolean} [options.swizzleGGGR] - Specifies whether the texture contains swizzled GGGR data for use with tangent space normal * maps. The R component is stored in alpha and G is stored in RGB. This packing can result in higher quality when the texture data * is compressed. Defaults to false. * @param {boolean} [options.fixCubemapSeams] - Specifies whether this cubemap texture requires special * seam fixing shader code to look right. Defaults to false. * @param {boolean} [options.flipY] - Specifies whether the texture should be flipped in the Y-direction. Only affects textures * with a source that is an image, canvas or video element. Does not affect cubemaps, compressed textures or textures set from raw * pixel data. Defaults to true. * @param {boolean} [options.premultiplyAlpha] - If true, the alpha channel of the texture (if present) is multiplied into the color * channels. Defaults to false. * @param {boolean} [options.compareOnRead] - When enabled, and if texture format is pc.PIXELFORMAT_DEPTH or pc.PIXELFORMAT_DEPTHSTENCIL, * hardware PCF is enabled for this texture, and you can get filtered results of comparison using texture() in your shader (WebGL2 only). * Defaults to false. * @param {number} [options.compareFunc] - Comparison function when compareOnRead is enabled (WebGL2 only). Defaults to pc.FUNC_LESS. * Possible values: * * {@link pc.FUNC_LESS} * * {@link pc.FUNC_LESSEQUAL} * * {@link pc.FUNC_GREATER} * * {@link pc.FUNC_GREATEREQUAL} * * {@link pc.FUNC_EQUAL} * * {@link pc.FUNC_NOTEQUAL} * @example * // Create a 8x8x24-bit texture * var texture = new pc.Texture(graphicsDevice, { * width: 8, * height: 8, * format: pc.PIXELFORMAT_R8_G8_B8 * }); * * // Fill the texture with a gradient * var pixels = texture.lock(); * var count = 0; * for (var i = 0; i < 8; i++) { * for (var j = 0; j < 8; j++) { * pixels[count++] = i * 32; * pixels[count++] = j * 32; * pixels[count++] = 255; * } * } * texture.unlock(); * @property {string} name The name of the texture. Defaults to null. */ class Texture { constructor(graphicsDevice: pc.GraphicsDevice, options?: { name?: string; width?: number; height?: number; depth?: number; format?: number; minFilter?: number; magFilter?: number; anisotropy?: number; addressU?: number; addressV?: number; addressW?: number; mipmaps?: boolean; cubemap?: boolean; volume?: boolean; rgbm?: boolean; swizzleGGGR?: boolean; fixCubemapSeams?: boolean; flipY?: boolean; premultiplyAlpha?: boolean; compareOnRead?: boolean; compareFunc?: number; }); /** * @name pc.Texture#minFilter * @type {number} * @description The minification filter to be applied to the texture. Can be: * * {@link pc.FILTER_NEAREST} * * {@link pc.FILTER_LINEAR} * * {@link pc.FILTER_NEAREST_MIPMAP_NEAREST} * * {@link pc.FILTER_NEAREST_MIPMAP_LINEAR} * * {@link pc.FILTER_LINEAR_MIPMAP_NEAREST} * * {@link pc.FILTER_LINEAR_MIPMAP_LINEAR} */ minFilter: number; /** * @name pc.Texture#magFilter * @type {number} * @description The magnification filter to be applied to the texture. Can be: * * {@link pc.FILTER_NEAREST} * * {@link pc.FILTER_LINEAR} */ magFilter: number; /** * @name pc.Texture#addressU * @type {number} * @description The addressing mode to be applied to the texture horizontally. Can be: * * {@link pc.ADDRESS_REPEAT} * * {@link pc.ADDRESS_CLAMP_TO_EDGE} * * {@link pc.ADDRESS_MIRRORED_REPEAT} */ addressU: number; /** * @name pc.Texture#addressV * @type {number} * @description The addressing mode to be applied to the texture vertically. Can be: * * {@link pc.ADDRESS_REPEAT} * * {@link pc.ADDRESS_CLAMP_TO_EDGE} * * {@link pc.ADDRESS_MIRRORED_REPEAT} */ addressV: number; /** * @name pc.Texture#addressW * @type {number} * @description The addressing mode to be applied to the 3D texture depth (WebGL2 only). Can be: * * {@link pc.ADDRESS_REPEAT} * * {@link pc.ADDRESS_CLAMP_TO_EDGE} * * {@link pc.ADDRESS_MIRRORED_REPEAT} */ addressW: number; /** * @name pc.Texture#compareOnRead * @type {boolean} * @description When enabled, and if texture format is pc.PIXELFORMAT_DEPTH or pc.PIXELFORMAT_DEPTHSTENCIL, * hardware PCF is enabled for this texture, and you can get filtered results of comparison using texture() in your shader (WebGL2 only). */ compareOnRead: boolean; /** * @name pc.Texture#compareFunc * @type {number} * @description Comparison function when compareOnRead is enabled (WebGL2 only). * Possible values: * * {@link pc.FUNC_LESS} * * {@link pc.FUNC_LESSEQUAL} * * {@link pc.FUNC_GREATER} * * {@link pc.FUNC_GREATEREQUAL} * * {@link pc.FUNC_EQUAL} * * {@link pc.FUNC_NOTEQUAL} */ compareFunc: number; /** * @name pc.Texture#anisotropy * @type {number} * @description Integer value specifying the level of anisotropic to apply to the texture * ranging from 1 (no anisotropic filtering) to the {@link pc.GraphicsDevice} property maxAnisotropy. */ anisotropy: number; /** * @name pc.Texture#mipmaps * @type {boolean} * @description Defines if texture should generate/upload mipmaps if possible. */ mipmaps: boolean; /** * @readonly * @name pc.Texture#width * @type {number} * @description The width of the texture in pixels. */ readonly width: number; /** * @readonly * @name pc.Texture#height * @type {number} * @description The height of the texture in pixels. */ readonly height: number; /** * @readonly * @name pc.Texture#depth * @type {number} * @description The number of depth slices in a 3D texture (WebGL2 only). */ readonly depth: number; /** * @readonly * @name pc.Texture#format * @type {number} * @description The pixel format of the texture. Can be: * * {@link pc.PIXELFORMAT_A8} * * {@link pc.PIXELFORMAT_L8} * * {@link pc.PIXELFORMAT_L8_A8} * * {@link pc.PIXELFORMAT_R5_G6_B5} * * {@link pc.PIXELFORMAT_R5_G5_B5_A1} * * {@link pc.PIXELFORMAT_R4_G4_B4_A4} * * {@link pc.PIXELFORMAT_R8_G8_B8} * * {@link pc.PIXELFORMAT_R8_G8_B8_A8} * * {@link pc.PIXELFORMAT_DXT1} * * {@link pc.PIXELFORMAT_DXT3} * * {@link pc.PIXELFORMAT_DXT5} * * {@link pc.PIXELFORMAT_RGB16F} * * {@link pc.PIXELFORMAT_RGBA16F} * * {@link pc.PIXELFORMAT_RGB32F} * * {@link pc.PIXELFORMAT_RGBA32F} * * {@link pc.PIXELFORMAT_ETC1} * * {@link pc.PIXELFORMAT_PVRTC_2BPP_RGB_1} * * {@link pc.PIXELFORMAT_PVRTC_2BPP_RGBA_1} * * {@link pc.PIXELFORMAT_PVRTC_4BPP_RGB_1} * * {@link pc.PIXELFORMAT_PVRTC_4BPP_RGBA_1} * * {@link pc.PIXELFORMAT_111110F} * * {@link pc.PIXELFORMAT_ASTC_4x4}>/li> * * {@link pc.PIXELFORMAT_ATC_RGB} * * {@link pc.PIXELFORMAT_ATC_RGBA} */ readonly format: number; /** * @readonly * @name pc.Texture#cubemap * @type {boolean} * @description Returns true if this texture is a cube map and false otherwise. */ readonly cubemap: boolean; /** * @readonly * @name pc.Texture#volume * @type {boolean} * @description Returns true if this texture is a 3D volume and false otherwise. */ readonly volume: boolean; /** * @name pc.Texture#flipY * @type {boolean} * @description Specifies whether the texture should be flipped in the Y-direction. Only affects textures * with a source that is an image, canvas or video element. Does not affect cubemaps, compressed textures * or textures set from raw pixel data. Defaults to true. */ flipY: boolean; /** * @readonly * @name pc.Texture#pot * @type {boolean} * @description Returns true if all dimensions of the texture are power of two, and false otherwise. */ readonly pot: boolean; /** * @function * @name pc.Texture#destroy * @description Forcibly free up the underlying WebGL resource owned by the texture. */ destroy(): void; /** * @function * @name pc.Texture#lock * @description Locks a miplevel of the texture, returning a typed array to be filled with pixel data. * @param {object} [options] - Optional options object. Valid properties are as follows: * @param {number} [options.level] - The mip level to lock with 0 being the top level. Defaults to 0. * @param {number} [options.face] - If the texture is a cubemap, this is the index of the face to lock. * @returns {Uint8Array|Uint16Array|Float32Array} A typed array containing the pixel data of the locked mip level. */ lock(options?: { level?: number; face?: number; }): Uint8Array | Uint16Array | Float32Array; /** * @function * @name pc.Texture#setSource * @description Set the pixel data of the texture from a canvas, image, video DOM element. If the * texture is a cubemap, the supplied source must be an array of 6 canvases, images or videos. * @param {HTMLCanvasElement|HTMLImageElement|HTMLVideoElement|HTMLCanvasElement[]|HTMLImageElement[]|HTMLVideoElement[]} source - A canvas, image or video element, * or an array of 6 canvas, image or video elements. * @param {number} [mipLevel] - A non-negative integer specifying the image level of detail. Defaults to 0, which represents the base image source. * A level value of N, that is greater than 0, represents the image source for the Nth mipmap reduction level. */ setSource(source: HTMLCanvasElement | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement[] | HTMLImageElement[] | HTMLVideoElement[], mipLevel?: number): void; /** * @function * @name pc.Texture#getSource * @description Get the pixel data of the texture. If this is a cubemap then an array of 6 images will be returned otherwise * a single image. * @param {number} [mipLevel] - A non-negative integer specifying the image level of detail. Defaults to 0, which represents the base image source. * A level value of N, that is greater than 0, represents the image source for the Nth mipmap reduction level. * @returns {HTMLImageElement} The source image of this texture. Can be null if source not assigned for specific image level. */ getSource(mipLevel?: number): HTMLImageElement; /** * @function * @name pc.Texture#unlock * @description Unlocks the currently locked mip level and uploads it to VRAM. */ unlock(): void; /** * @function * @name pc.Texture#upload * @description Forces a reupload of the textures pixel data to graphics memory. Ordinarily, this function * is called by internally by {@link pc.Texture#setSource} and {@link pc.Texture#unlock}. However, it still needs to * be called explicitly in the case where an HTMLVideoElement is set as the source of the texture. Normally, * this is done once every frame before video textured geometry is rendered. */ upload(): void; /** * The name of the texture. Defaults to null. */ name: string; } /** * @class * @name pc.TransformFeedback * @classdesc Transform feedback helper object. * @description This object allows you to configure and use the transform feedback feature (WebGL2 * only). How to use: * * 1. First, check that you're on WebGL2, by looking at the `app.graphicsDevice.webgl2`` value. * 2. Define the outputs in your vertex shader. The syntax is `out vec3 out_vertex_position`, * note that there must be out_ in the name. You can then simply assign values to these outputs * in VS. The order and size of shader outputs must match the output buffer layout. * 3. Create the shader using `pc.TransformFeedback.createShader(device, vsCode, yourShaderName)`. * 4. Create/acquire the input vertex buffer. Can be any pc.VertexBuffer, either manually created, * or from a pc.Mesh. * 5. Create the pc.TransformFeedback object: `var tf = new pc.TransformFeedback(inputBuffer)`. * This object will internally create an output buffer. * 6. Run the shader: `tf.process(shader)`. Shader will take the input buffer, process it and * write to the output buffer, then the input/output buffers will be automatically swapped, so * you'll immediately see the result. * @param {pc.VertexBuffer} inputBuffer - The input vertex buffer. * @param {number} [usage] - The optional usage type of the output vertex buffer. Can be: * * * {@link pc.BUFFER_STATIC} * * {@link pc.BUFFER_DYNAMIC} * * {@link pc.BUFFER_STREAM} * * {@link pc.BUFFER_GPUDYNAMIC} * * Defaults to pc.BUFFER_GPUDYNAMIC (which is recommended for continuous update). * @example * // *** shader asset *** * attribute vec3 vertex_position; * attribute vec3 vertex_normal; * attribute vec2 vertex_texCoord0; * attribute vec4 vertex_tangent; * out vec3 out_vertex_position; * out vec3 out_vertex_normal; * out vec2 out_vertex_texCoord0; * out vec4 out_vertex_tangent; * void main(void) { * // read position and normal, write new position (push away) * out_vertex_position = vertex_position + vertex_normal * 0.01; * // pass other attributes unchanged * out_vertex_normal = vertex_normal; * out_vertex_texCoord0 = vertex_texCoord0; * out_vertex_tangent = vertex_tangent; * } * @example * // *** script asset *** * var TransformExample = pc.createScript('transformExample'); * * // attribute that references shader asset and material * TransformExample.attributes.add('shaderCode', { type: 'asset', assetType: 'shader' }); * TransformExample.attributes.add('material', { type: 'asset', assetType: 'material' }); * * TransformExample.prototype.initialize = function() { * var device = this.app.graphicsDevice; * var mesh = pc.createTorus(device, { tubeRadius: 0.01, ringRadius: 3 }); * var node = new pc.GraphNode(); * var meshInstance = new pc.MeshInstance(node, mesh, this.material.resource); * var model = new pc.Model(); * model.graph = node; * model.meshInstances = [ meshInstance ]; * this.app.scene.addModel(model); * * // if webgl2 is not supported, TF is not available * if (!device.webgl2) return; * var inputBuffer = mesh.vertexBuffer; * this.tf = new pc.TransformFeedback(inputBuffer); * this.shader = pc.TransformFeedback.createShader(device, this.shaderCode.resource, "tfMoveUp"); * }; * * TransformExample.prototype.update = function(dt) { * if (!this.app.graphicsDevice.webgl2) return; * this.tf.process(this.shader); * }; */ class TransformFeedback { constructor(inputBuffer: pc.VertexBuffer, usage?: number); /** * @function * @name pc.TransformFeedback#createShader * @description Creates a transform feedback ready vertex shader from code. * @param {pc.GraphicsDevice} graphicsDevice - The graphics device used by the renderer. * @param {string} vsCode - Vertex shader code. Should contain output variables starting with "out_". * @param {string} name - Unique name for caching the shader. * @returns {pc.Shader} A shader to use in the process() function. */ createShader(graphicsDevice: pc.GraphicsDevice, vsCode: string, name: string): pc.Shader; /** * @function * @name pc.TransformFeedback#destroy * @description Destroys the transform feedback helper object. */ destroy(): void; /** * @function * @name pc.TransformFeedback#process * @description Runs the specified shader on the input buffer, writes results into the new buffer, then optionally swaps input/output. * @param {pc.Shader} shader - A vertex shader to run. Should be created with pc.TransformFeedback.createShader. * @param {boolean} [swap] - Swap input/output buffer data. Useful for continuous buffer processing. Default is true. */ process(shader: pc.Shader, swap?: boolean): void; /** * @readonly * @name pc.TransformFeedback#inputBuffer * @type {pc.VertexBuffer} * @description The current input buffer. */ readonly inputBuffer: pc.VertexBuffer; /** * @readonly * @name pc.TransformFeedback#outputBuffer * @type {pc.VertexBuffer} * @description The current output buffer. */ readonly outputBuffer: pc.VertexBuffer; } /** * @class * @name pc.VertexBuffer * @classdesc A vertex buffer is the mechanism via which the application specifies vertex * data to the graphics hardware. * @description Creates a new vertex buffer object. * @param {pc.GraphicsDevice} graphicsDevice - The graphics device used to manage this vertex buffer. * @param {pc.VertexFormat} format - The vertex format of this vertex buffer. * @param {number} numVertices - The number of vertices that this vertex buffer will hold. * @param {number} [usage] - The usage type of the vertex buffer (see pc.BUFFER_*). * @param {ArrayBuffer} [initialData] - Initial data. */ class VertexBuffer { constructor(graphicsDevice: pc.GraphicsDevice, format: pc.VertexFormat, numVertices: number, usage?: number, initialData?: ArrayBuffer); /** * @function * @name pc.VertexBuffer#destroy * @description Frees resources associated with this vertex buffer. */ destroy(): void; /** * @function * @name pc.VertexBuffer#getFormat * @description Returns the data format of the specified vertex buffer. * @returns {pc.VertexFormat} The data format of the specified vertex buffer. */ getFormat(): pc.VertexFormat; /** * @function * @name pc.VertexBuffer#getUsage * @description Returns the usage type of the specified vertex buffer. This indicates * whether the buffer can be modified once and used many times (pc.BUFFER_STATIC), * modified repeatedly and used many times (pc.BUFFER_DYNAMIC) or modified once * and used at most a few times (pc.BUFFER_STREAM). * @returns {number} The usage type of the vertex buffer (see pc.BUFFER_*). */ getUsage(): number; /** * @function * @name pc.VertexBuffer#getNumVertices * @description Returns the number of vertices stored in the specified vertex buffer. * @returns {number} The number of vertices stored in the vertex buffer. */ getNumVertices(): number; /** * @function * @name pc.VertexBuffer#lock * @description Returns a mapped memory block representing the content of the vertex buffer. * @returns {ArrayBuffer} An array containing the byte data stored in the vertex buffer. */ lock(): ArrayBuffer; /** * @function * @name pc.VertexBuffer#unlock * @description Notifies the graphics engine that the client side copy of the vertex buffer's * memory can be returned to the control of the graphics driver. */ unlock(): void; /** * @function * @name pc.VertexBuffer#setData * @description Copies data into vertex buffer's memory. * @param {ArrayBuffer} [data] - Source data to copy. * @returns {boolean} True if function finished successfuly, false otherwise. */ setData(data?: ArrayBuffer): boolean; } /** * @interface * @name pc.VertexAttributeDescription * @description Interface for describing a vertex attribute in {@link pc.VertexFormat}. * @param {string} semantic - The meaning of the vertex element. This is used to link * the vertex data to a shader input. Can be: * * {@link pc.SEMANTIC_POSITION} * * {@link pc.SEMANTIC_NORMAL} * * {@link pc.SEMANTIC_TANGENT} * * {@link pc.SEMANTIC_BLENDWEIGHT} * * {@link pc.SEMANTIC_BLENDINDICES} * * {@link pc.SEMANTIC_COLOR} * * {@link pc.SEMANTIC_TEXCOORD0} * * {@link pc.SEMANTIC_TEXCOORD1} * * {@link pc.SEMANTIC_TEXCOORD2} * * {@link pc.SEMANTIC_TEXCOORD3} * * {@link pc.SEMANTIC_TEXCOORD4} * * {@link pc.SEMANTIC_TEXCOORD5} * * {@link pc.SEMANTIC_TEXCOORD6} * * {@link pc.SEMANTIC_TEXCOORD7} * If vertex data has a meaning other that one of those listed above, use the user-defined * semantics: pc.SEMANTIC_ATTR0 to pc.SEMANTIC_ATTR15. * @param {number} components - The number of components of the vertex attribute. * Can be 1, 2, 3 or 4. * @param {number} type - The data type of the attribute. Can be: * * {@link pc.TYPE_INT8} * * {@link pc.TYPE_UINT8} * * {@link pc.TYPE_INT16} * * {@link pc.TYPE_UINT16} * * {@link pc.TYPE_INT32} * * {@link pc.TYPE_UINT32} * * {@link pc.TYPE_FLOAT32} * @param {boolean} [normalize] - If true, vertex attribute data will be mapped from a * 0 to 255 range down to 0 to 1 when fed to a shader. If false, vertex attribute data is left * unchanged. If this property is unspecified, false is assumed. */ interface VertexAttributeDescription { /** * @name pc.VertexAttributeDescription#semantic * @type {string} * @description The meaning of the vertex element. This is used to link * the vertex data to a shader input. Can be: * * * {@link pc.SEMANTIC_POSITION} * * {@link pc.SEMANTIC_NORMAL} * * {@link pc.SEMANTIC_TANGENT} * * {@link pc.SEMANTIC_BLENDWEIGHT} * * {@link pc.SEMANTIC_BLENDINDICES} * * {@link pc.SEMANTIC_COLOR} * * {@link pc.SEMANTIC_TEXCOORD0} * * {@link pc.SEMANTIC_TEXCOORD1} * * {@link pc.SEMANTIC_TEXCOORD2} * * {@link pc.SEMANTIC_TEXCOORD3} * * {@link pc.SEMANTIC_TEXCOORD4} * * {@link pc.SEMANTIC_TEXCOORD5} * * {@link pc.SEMANTIC_TEXCOORD6} * * {@link pc.SEMANTIC_TEXCOORD7} * * If vertex data has a meaning other that one of those listed above, use the user-defined * semantics: pc.SEMANTIC_ATTR0 to pc.SEMANTIC_ATTR15. */ semantic: string; /** * @name pc.VertexAttributeDescription#components * @type {number} * @description The number of components of the vertex attribute. * Can be 1, 2, 3 or 4. */ components: number; /** * @name pc.VertexAttributeDescription#type * @type {number} * @description The data type of the attribute. Can be: * * * {@link pc.TYPE_INT8} * * {@link pc.TYPE_UINT8} * * {@link pc.TYPE_INT16} * * {@link pc.TYPE_UINT16} * * {@link pc.TYPE_INT32} * * {@link pc.TYPE_UINT32} * * {@link pc.TYPE_FLOAT32} */ type: number; /** * @name pc.VertexAttributeDescription#[normalize] * @type {boolean} * @description If true, vertex attribute data will be mapped from a * 0 to 255 range down to 0 to 1 when fed to a shader. If false, vertex attribute data is left * unchanged. If this property is unspecified, false is assumed. */ normalize?: boolean; } /** * @interface * @name pc.VertexAttributeElement * @description Interface of a vertex attribute element in {@link pc.VertexFormat}. * @param {string} name - The meaning of the vertex element. This is used to link * the vertex data to a shader input. Can be: * * {@link pc.SEMANTIC_POSITION} * * {@link pc.SEMANTIC_NORMAL} * * {@link pc.SEMANTIC_TANGENT} * * {@link pc.SEMANTIC_BLENDWEIGHT} * * {@link pc.SEMANTIC_BLENDINDICES} * * {@link pc.SEMANTIC_COLOR} * * {@link pc.SEMANTIC_TEXCOORD0} * * {@link pc.SEMANTIC_TEXCOORD1} * * {@link pc.SEMANTIC_TEXCOORD2} * * {@link pc.SEMANTIC_TEXCOORD3} * * {@link pc.SEMANTIC_TEXCOORD4} * * {@link pc.SEMANTIC_TEXCOORD5} * * {@link pc.SEMANTIC_TEXCOORD6} * * {@link pc.SEMANTIC_TEXCOORD7} * If vertex data has a meaning other that one of those listed above, use the user-defined * semantics: pc.SEMANTIC_ATTR0 to pc.SEMANTIC_ATTR15. * @param {number} numComponents - The number of components of the vertex attribute. * Can be 1, 2, 3 or 4. * @param {number} dataType - The data type of the attribute. Can be: * * {@link pc.TYPE_INT8} * * {@link pc.TYPE_UINT8} * * {@link pc.TYPE_INT16} * * {@link pc.TYPE_UINT16} * * {@link pc.TYPE_INT32} * * {@link pc.TYPE_UINT32} * * {@link pc.TYPE_FLOAT32} * @param {boolean} normalize - If true, vertex attribute data will be mapped from a * 0 to 255 range down to 0 to 1 when fed to a shader. If false, vertex attribute data is left * unchanged. If this property is unspecified, false is assumed. * @param {number} offset - The number of initial bytes at the start of a vertex that are not relevant to this attribute. * @param {number} stride - The number of total bytes that are between the start of one vertex, and the start of the next. * @param {pc.ScopeId} scopeId - The shader input variable corresponding to the attribute. * @param {number} size - The size of the attribute in bytes. */ interface VertexAttributeElement { /** * @name pc.VertexAttributeElement#name * @type {string} * @description The meaning of the vertex element. This is used to link * the vertex data to a shader input. Can be: * * * {@link pc.SEMANTIC_POSITION} * * {@link pc.SEMANTIC_NORMAL} * * {@link pc.SEMANTIC_TANGENT} * * {@link pc.SEMANTIC_BLENDWEIGHT} * * {@link pc.SEMANTIC_BLENDINDICES} * * {@link pc.SEMANTIC_COLOR} * * {@link pc.SEMANTIC_TEXCOORD0} * * {@link pc.SEMANTIC_TEXCOORD1} * * {@link pc.SEMANTIC_TEXCOORD2} * * {@link pc.SEMANTIC_TEXCOORD3} * * {@link pc.SEMANTIC_TEXCOORD4} * * {@link pc.SEMANTIC_TEXCOORD5} * * {@link pc.SEMANTIC_TEXCOORD6} * * {@link pc.SEMANTIC_TEXCOORD7} * * If vertex data has a meaning other that one of those listed above, use the user-defined * semantics: pc.SEMANTIC_ATTR0 to pc.SEMANTIC_ATTR15. */ name: string; /** * @name pc.VertexAttributeElement#numComponents * @type {number} * @description The number of components of the vertex attribute. * Can be 1, 2, 3 or 4. */ numComponents: number; /** * @name pc.VertexAttributeElement#dataType * @type {number} * @description The data type of the attribute. Can be: * * * {@link pc.TYPE_INT8} * * {@link pc.TYPE_UINT8} * * {@link pc.TYPE_INT16} * * {@link pc.TYPE_UINT16} * * {@link pc.TYPE_INT32} * * {@link pc.TYPE_UINT32} * * {@link pc.TYPE_FLOAT32} */ dataType: number; /** * @name pc.VertexAttributeElement#normalize * @type {boolean} * @description If true, vertex attribute data will be mapped from a * 0 to 255 range down to 0 to 1 when fed to a shader. If false, vertex attribute data is left * unchanged. If this property is unspecified, false is assumed. */ normalize: boolean; /** * @name pc.VertexAttributeElement#offset * @type {number} * @description The number of initial bytes at the start of a vertex that are not relevant to this attribute. */ offset: number; /** * @name pc.VertexAttributeElement#stride * @type {number} * @description The number of total bytes that are between the start of one vertex, and the start of the next. */ stride: number; /** * @name pc.VertexAttributeElement#scopeId * @type {pc.ScopeId} * @description The shader input variable corresponding to the attribute. */ scopeId: pc.ScopeId; /** * @name pc.VertexAttributeElement#size * @type {number} * @description The size of the attribute in bytes. */ size: number; } /** * @class * @name pc.VertexFormat * @classdesc A vertex format is a descriptor that defines the layout of vertex data inside * a {@link pc.VertexBuffer}. * @description Returns a new pc.VertexFormat object. * @param {pc.GraphicsDevice} graphicsDevice - The graphics device used to manage this vertex format. * @param {pc.VertexAttributeDescription[]} description - An array of vertex attribute descriptions. * @example * // Specify 3-component positions (x, y, z) * var vertexFormat = new pc.VertexFormat(graphicsDevice, [ * { semantic: pc.SEMANTIC_POSITION, components: 3, type: pc.TYPE_FLOAT32 } * ]); * @example * // Specify 2-component positions (x, y), a texture coordinate (u, v) and a vertex color (r, g, b, a) * var vertexFormat = new pc.VertexFormat(graphicsDevice, [ * { semantic: pc.SEMANTIC_POSITION, components: 2, type: pc.TYPE_FLOAT32 }, * { semantic: pc.SEMANTIC_TEXCOORD0, components: 2, type: pc.TYPE_FLOAT32 }, * { semantic: pc.SEMANTIC_COLOR, components: 4, type: pc.TYPE_UINT8, normalize: true } * ]); * * @property {pc.VertexAttributeElement[]} elements The vertex attribute elements. */ class VertexFormat { constructor(graphicsDevice: pc.GraphicsDevice, description: pc.VertexAttributeDescription[]); /** * @field * @static * @readonly * @name pc.VertexFormat.defaultInstancingFormat * @type {pc.VertexFormat} * @description Returns {@link pc.VertexFormat} used to store matrices of type {@link pc.Mat4} for hardware instancing. */ static readonly defaultInstancingFormat: pc.VertexFormat; /** * The vertex attribute elements. */ elements: pc.VertexAttributeElement[]; } /** * @class * @name pc.VertexIteratorAccessor * @classdesc Helps with accessing a specific vertex attribute. * @description Returns a new pc.VertexIteratorAccessor object. * @param {ArrayBuffer} buffer - The vertex buffer containing the attribute to be accessed. * @param {pc.VertexAttributeElement} vertexElement - The vertex attribute to be accessed. */ class VertexIteratorAccessor { constructor(buffer: ArrayBuffer, vertexElement: pc.VertexAttributeElement); /** * @function * @name pc.VertexIteratorAccessor#get * @description Get a attribute component at the current index. * @param {number} offset - The component offset. Should be either 0, 1, 2, or 3. * @returns {number} The value of a attribute component. */ get(offset: number): number; /** * @function * @name pc.VertexIteratorAccessor#set * @description Set all the attribute components at the current index. * @param {number} a - The first component value. * @param {number} [b] - The second component value (if applicable). * @param {number} [c] - The third component value (if applicable). * @param {number} [d] - The fourth component value (if applicable). */ set(a: number, b?: number, c?: number, d?: number): void; } /** * @class * @name pc.VertexIterator * @classdesc A vertex iterator simplifies the process of writing vertex data to a vertex buffer. * @description Returns a new pc.VertexIterator object. * @param {pc.VertexBuffer} vertexBuffer - The vertex buffer to be iterated. * @property {object} element The vertex buffer elements. */ class VertexIterator { constructor(vertexBuffer: pc.VertexBuffer); /** * @function * @name pc.VertexIterator#next * @description Moves the vertex iterator on to the next vertex. * @param {number} [count] - Optional number of steps to move on when calling next, defaults to 1. * @example * var iterator = new pc.VertexIterator(vertexBuffer); * iterator.element[pc.SEMANTIC_POSTIION].set(-0.9, -0.9, 0.0); * iterator.element[pc.SEMANTIC_COLOR].set(255, 0, 0, 255); * iterator.next(); * iterator.element[pc.SEMANTIC_POSTIION].set(0.9, -0.9, 0.0); * iterator.element[pc.SEMANTIC_COLOR].set(0, 255, 0, 255); * iterator.next(); * iterator.element[pc.SEMANTIC_POSTIION].set(0.0, 0.9, 0.0); * iterator.element[pc.SEMANTIC_COLOR].set(0, 0, 255, 255); * iterator.end(); */ next(count?: number): void; /** * @function * @name pc.VertexIterator#end * @description Notifies the vertex buffer being iterated that writes are complete. Internally * the vertex buffer is unlocked and vertex data is uploaded to video memory. * @example * var iterator = new pc.VertexIterator(vertexBuffer); * iterator.element[pc.SEMANTIC_POSTIION].set(-0.9, -0.9, 0.0); * iterator.element[pc.SEMANTIC_COLOR].set(255, 0, 0, 255); * iterator.next(); * iterator.element[pc.SEMANTIC_POSTIION].set(0.9, -0.9, 0.0); * iterator.element[pc.SEMANTIC_COLOR].set(0, 255, 0, 255); * iterator.next(); * iterator.element[pc.SEMANTIC_POSTIION].set(0.0, 0.9, 0.0); * iterator.element[pc.SEMANTIC_COLOR].set(0, 0, 255, 255); * iterator.end(); */ end(): void; /** * The vertex buffer elements. */ element: { [key: string]: pc.VertexIteratorAccessor; }; } /** * @class * @name pc.I18n * @augments pc.EventHandler * @classdesc Handles localization. Responsible for loading localization assets * and returning translations for a certain key. Can also handle plural forms. To override * its default behaviour define a different implementation for {@link pc.I18n#getText} and {@link pc.I18n#getPluralText}. * @param {pc.Application} app - The application. * @property {string} locale The current locale for example "en-US". Changing the locale will raise an event which will cause localized Text Elements to * change language to the new locale. * @property {number[]|pc.Asset[]} assets An array of asset ids or assets that contain localization data in the expected format. I18n will automatically load * translations from these assets as the assets are loaded and it will also automatically unload translations if the assets get removed or unloaded at runtime. */ class I18n extends pc.EventHandler { constructor(app: pc.Application); /** * @function * @name pc.I18n#findAvailableLocale * @description Returns the first available locale based on the desired locale specified. First * tries to find the desired locale and then tries to find an alternative locale based on the language. * @param {string} desiredLocale - The desired locale e.g. En-US. * @param {object} availableLocales - A dictionary where each key is an available locale. * @returns {string} The locale found or if no locale is available returns the default en-US locale. */ findAvailableLocale(desiredLocale: string, availableLocales: any): string; /** * @function * @name pc.I18n#getText * @description Returns the translation for the specified key and locale. If the locale is not specified * it will use the current locale. * @param {string} key - The localization key. * @param {string} [locale] - The desired locale. * @returns {string} The translated text. If no translations are found at all for the locale then it will return * the en-US translation. If no translation exists for that key then it will return the localization key. * @example * var localized = this.app.i18n.getText('localization-key'); * var localizedFrench = this.app.i18n.getText('localization-key', 'fr-FR'); */ getText(key: string, locale?: string): string; /** * @function * @name pc.I18n#getPluralText * @description Returns the pluralized translation for the specified key, number n and locale. If the locale is not specified * it will use the current locale. * @param {string} key - The localization key. * @param {number} n - The number used to determine which plural form to use. E.g. For the phrase "5 Apples" n equals 5. * @param {string} [locale] - The desired locale. * @returns {string} The translated text. If no translations are found at all for the locale then it will return * the en-US translation. If no translation exists for that key then it will return the localization key. * @example * // manually replace {number} in the resulting translation with our number * var localized = this.app.i18n.getPluralText('{number} apples', number).replace("{number}", number); */ getPluralText(key: string, n: number, locale?: string): string; /** * @function * @name pc.I18n#addData * @description Adds localization data. If the locale and key for a translation already exists it will be overwritten. * @param {object} data - The localization data. See example for the expected format of the data. * @example * this.app.i18n.addData({ * header: { * version: 1 * }, * data: [{ * info: { * locale: 'en-US' * }, * messages: { * "key": "translation", * // The number of plural forms depends on the locale. See the manual for more information. * "plural_key": ["one item", "more than one items"] * } * }, { * info: { * locale: 'fr-FR' * }, * messages: { * // ... * } * }] * }); */ addData(data: any): void; /** * @function * @name pc.I18n#removeData * @description Removes localization data. * @param {object} data - The localization data. The data is expected to be in the same format as {@link pc.I18n#addData}. */ removeData(data: any): void; /** * @function * @name pc.I18n#destroy * @description Frees up memory. */ destroy(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The current locale for example "en-US". Changing the locale will raise an event which will cause localized Text Elements to change language to the new locale. */ locale: string; /** * An array of asset ids or assets that contain localization data in the expected format. I18n will automatically load translations from these assets as the assets are loaded and it will also automatically unload translations if the assets get removed or unloaded at runtime. */ assets: number[] | pc.Asset[]; } /** * @class * @name pc.Controller * @classdesc A general input handler which handles both mouse and keyboard input assigned to named actions. * This allows you to define input handlers separately to defining keyboard/mouse configurations. * @description Create a new instance of a Controller. * @param {Element} [element] - Element to attach Controller to. * @param {object} [options] - Optional arguments. * @param {pc.Keyboard} [options.keyboard] - A Keyboard object to use. * @param {pc.Mouse} [options.mouse] - A Mouse object to use. * @param {pc.GamePads} [options.gamepads] - A Gamepads object to use. * @example * var c = new pc.Controller(document); * * // Register the "fire" action and assign it to both the Enter key and the Spacebar. * c.registerKeys("fire", [pc.KEY_ENTER, pc.KEY_SPACE]); */ class Controller { constructor(element?: Element, options?: { keyboard?: pc.Keyboard; mouse?: pc.Mouse; gamepads?: pc.GamePads; }); /** * @function * @name pc.Controller#attach * @description Attach Controller to a Element, this is required before you can monitor for key/mouse inputs. * @param {Element} element - The element to attach mouse and keyboard event handler too. */ attach(element: Element): void; /** * @function * @name pc.Controller#detach * @description Detach Controller from an Element, this should be done before the Controller is destroyed. */ detach(): void; /** * @function * @name pc.Controller#disableContextMenu * @description Disable the context menu usually activated with the right mouse button. */ disableContextMenu(): void; /** * @function * @name pc.Controller#enableContextMenu * @description Enable the context menu usually activated with the right mouse button. This is enabled by default. */ enableContextMenu(): void; /** * @function * @name pc.Controller#update * @description Update the Keyboard and Mouse handlers. * @param {object} dt - The time since the last frame. */ update(dt: any): void; /** * @function * @name pc.Controller#registerKeys * @description Create or update a action which is enabled when the supplied keys are pressed. * @param {string} action - The name of the action. * @param {number[]} keys - A list of keycodes. */ registerKeys(action: string, keys: number[]): void; /** * @function * @name pc.Controller#registerMouse * @description Create or update an action which is enabled when the supplied mouse button is pressed. * @param {string} action - The name of the action. * @param {number} button - The mouse button. */ registerMouse(action: string, button: number): void; /** * @function * @name pc.Controller#registerPadButton * @description Create or update an action which is enabled when the gamepad button is pressed. * @param {string} action - The name of the action. * @param {number} pad - The index of the pad to register (use pc.PAD_1, etc). * @param {number} button - The pad button. */ registerPadButton(action: string, pad: number, button: number): void; /** * @function * @name pc.Controller#registerAxis * @param {object} [options] - Optional options object. * @param {object} [options.pad] - The index of the game pad to register for (use pc.PAD_1, etc). */ registerAxis(options?: { pad?: any; }): void; /** * @function * @name pc.Controller#isPressed * @description Returns true if the current action is enabled. * @param {string} actionName - The name of the action. * @returns {boolean} True if the action is enabled. */ isPressed(actionName: string): boolean; /** * @function * @name pc.Controller#wasPressed * @description Returns true if the action was enabled this since the last update. * @param {string} actionName - The name of the action. * @returns {boolean} True if the action was enabled this since the last update. */ wasPressed(actionName: string): boolean; } /** * @class * @name pc.ElementInputEvent * @classdesc Represents an input event fired on a {@link pc.ElementComponent}. When an event is raised * on an ElementComponent it bubbles up to its parent ElementComponents unless we call stopPropagation(). * @description Create an instance of a pc.ElementInputEvent. * @param {MouseEvent|TouchEvent} event - The MouseEvent or TouchEvent that was originally raised. * @param {pc.ElementComponent} element - The ElementComponent that this event was originally raised on. * @param {pc.CameraComponent} camera - The CameraComponent that this event was originally raised via. * @property {MouseEvent|TouchEvent} event The MouseEvent or TouchEvent that was originally raised. * @property {pc.ElementComponent} element The ElementComponent that this event was originally raised on. * @property {pc.CameraComponent} camera The CameraComponent that this event was originally raised via. */ class ElementInputEvent { constructor(event: MouseEvent | TouchEvent, element: pc.ElementComponent, camera: pc.CameraComponent); /** * @function * @name pc.ElementInputEvent#stopPropagation * @description Stop propagation of the event to parent {@link pc.ElementComponent}s. This also stops propagation of the event to other event listeners of the original DOM Event. */ stopPropagation(): void; /** * The MouseEvent or TouchEvent that was originally raised. */ event: MouseEvent | TouchEvent; /** * The ElementComponent that this event was originally raised on. */ element: pc.ElementComponent; /** * The CameraComponent that this event was originally raised via. */ camera: pc.CameraComponent; } /** * @class * @name pc.ElementMouseEvent * @augments pc.ElementInputEvent * @classdesc Represents a Mouse event fired on a {@link pc.ElementComponent}. * @description Create an instance of a pc.ElementMouseEvent. * @param {MouseEvent} event - The MouseEvent that was originally raised. * @param {pc.ElementComponent} element - The ElementComponent that this event was originally raised on. * @param {pc.CameraComponent} camera - The CameraComponent that this event was originally raised via. * @param {number} x - The x coordinate. * @param {number} y - The y coordinate. * @param {number} lastX - The last x coordinate. * @param {number} lastY - The last y coordinate. * @property {boolean} ctrlKey Whether the ctrl key was pressed. * @property {boolean} altKey Whether the alt key was pressed. * @property {boolean} shiftKey Whether the shift key was pressed. * @property {boolean} metaKey Whether the meta key was pressed. * @property {number} button The mouse button. * @property {number} dx The amount of horizontal movement of the cursor. * @property {number} dy The amount of vertical movement of the cursor. * @property {number} wheelDelta The amount of the wheel movement. */ class ElementMouseEvent extends pc.ElementInputEvent { constructor(event: MouseEvent, element: pc.ElementComponent, camera: pc.CameraComponent, x: number, y: number, lastX: number, lastY: number); /** * @function * @name pc.ElementInputEvent#stopPropagation * @description Stop propagation of the event to parent {@link pc.ElementComponent}s. This also stops propagation of the event to other event listeners of the original DOM Event. */ stopPropagation(): void; /** * Whether the ctrl key was pressed. */ ctrlKey: boolean; /** * Whether the alt key was pressed. */ altKey: boolean; /** * Whether the shift key was pressed. */ shiftKey: boolean; /** * Whether the meta key was pressed. */ metaKey: boolean; /** * The mouse button. */ button: number; /** * The amount of horizontal movement of the cursor. */ dx: number; /** * The amount of vertical movement of the cursor. */ dy: number; /** * The amount of the wheel movement. */ wheelDelta: number; } /** * @class * @name pc.ElementTouchEvent * @augments pc.ElementInputEvent * @classdesc Represents a TouchEvent fired on a {@link pc.ElementComponent}. * @description Create an instance of a pc.ElementTouchEvent. * @param {TouchEvent} event - The TouchEvent that was originally raised. * @param {pc.ElementComponent} element - The ElementComponent that this event was originally raised on. * @param {pc.CameraComponent} camera - The CameraComponent that this event was originally raised via. * @param {number} x - The x coordinate of the touch that triggered the event. * @param {number} y - The y coordinate of the touch that triggered the event. * @param {Touch} touch - The touch object that triggered the event. * @property {Touch[]} touches The Touch objects representing all current points of contact with the surface, regardless of target or changed status. * @property {Touch[]} changedTouches The Touch objects representing individual points of contact whose states changed between the previous touch event and this one. * @property {Touch} touch The touch object that triggered the event. */ class ElementTouchEvent extends pc.ElementInputEvent { constructor(event: TouchEvent, element: pc.ElementComponent, camera: pc.CameraComponent, x: number, y: number, touch: Touch); /** * @function * @name pc.ElementInputEvent#stopPropagation * @description Stop propagation of the event to parent {@link pc.ElementComponent}s. This also stops propagation of the event to other event listeners of the original DOM Event. */ stopPropagation(): void; /** * The Touch objects representing all current points of contact with the surface, regardless of target or changed status. */ touches: Touch[]; /** * The Touch objects representing individual points of contact whose states changed between the previous touch event and this one. */ changedTouches: Touch[]; /** * The touch object that triggered the event. */ touch: Touch; } /** * @class * @name pc.ElementInput * @classdesc Handles mouse and touch events for {@link pc.ElementComponent}s. When input events * occur on an ElementComponent this fires the appropriate events on the ElementComponent. * @description Create a new pc.ElementInput instance. * @param {Element} domElement - The DOM element. * @param {object} [options] - Optional arguments. * @param {boolean} [options.useMouse] - Whether to allow mouse input. Defaults to true. * @param {boolean} [options.useTouch] - Whether to allow touch input. Defaults to true. */ class ElementInput { constructor(domElement: Element, options?: { useMouse?: boolean; useTouch?: boolean; }); /** * @function * @name pc.ElementInput#attach * @description Attach mouse and touch events to a DOM element. * @param {Element} domElement - The DOM element. */ attach(domElement: Element): void; /** * @function * @name pc.ElementInput#detach * @description Remove mouse and touch events from the DOM element that it is attached to. */ detach(): void; /** * @function * @name pc.ElementInput#addElement * @description Add a {@link pc.ElementComponent} to the internal list of ElementComponents that are being checked for input. * @param {pc.ElementComponent} element - The ElementComponent. */ addElement(element: pc.ElementComponent): void; /** * @function * @name pc.ElementInput#removeElement * @description Remove a {@link pc.ElementComponent} from the internal list of ElementComponents that are being checked for input. * @param {pc.ElementComponent} element - The ElementComponent. */ removeElement(element: pc.ElementComponent): void; } /** * @class * @name pc.GamePads * @classdesc Input handler for accessing GamePad input. */ class GamePads { /** * @function * @name pc.GamePads#update * @description Update the current and previous state of the gamepads. This must be called every frame for wasPressed() * to work. */ update(): void; /** * @function * @name pc.GamePads#poll * @description Poll for the latest data from the gamepad API. * @returns {object[]} An array of gamepads and mappings for the model of gamepad that is attached. * @example * var gamepads = new pc.GamePads(); * var pads = gamepads.poll(); */ poll(): object[]; /** * @function * @name pc.GamePads#isPressed * @description Returns true if the button on the pad requested is pressed. * @param {number} index - The index of the pad to check, use constants pc.PAD_1, pc.PAD_2, etc. * @param {number} button - The button to test, use constants pc.PAD_FACE_1, etc. * @returns {boolean} True if the button is pressed. */ isPressed(index: number, button: number): boolean; /** * @function * @name pc.GamePads#wasPressed * @description Returns true if the button was pressed since the last frame. * @param {number} index - The index of the pad to check, use constants pc.PAD_1, pc.PAD_2, etc. * @param {number} button - The button to test, use constants pc.PAD_FACE_1, etc. * @returns {boolean} True if the button was pressed since the last frame. */ wasPressed(index: number, button: number): boolean; /** * @function * @name pc.GamePads#getAxis * @description Get the value of one of the analogue axes of the pad. * @param {number} index - The index of the pad to check, use constants pc.PAD_1, pc.PAD_2, etc. * @param {number} axes - The axes to get the value of, use constants pc.PAD_L_STICK_X, etc. * @returns {number} The value of the axis between -1 and 1. */ getAxis(index: number, axes: number): number; } /** * @constant * @type {string} * @name pc.EVENT_KEYDOWN * @description Name of event fired when a key is pressed. */ const EVENT_KEYDOWN: string; /** * @constant * @type {string} * @name pc.EVENT_KEYUP * @description Name of event fired when a key is released. */ const EVENT_KEYUP: string; /** * @constant * @type {string} * @name pc.EVENT_MOUSEDOWN * @description Name of event fired when a mouse button is pressed. */ const EVENT_MOUSEDOWN: string; /** * @constant * @type {string} * @name pc.EVENT_MOUSEMOVE * @description Name of event fired when the mouse is moved. */ const EVENT_MOUSEMOVE: string; /** * @constant * @type {string} * @name pc.EVENT_MOUSEUP * @description Name of event fired when a mouse button is released. */ const EVENT_MOUSEUP: string; /** * @constant * @type {string} * @name pc.EVENT_MOUSEWHEEL * @description Name of event fired when the mouse wheel is rotated. */ const EVENT_MOUSEWHEEL: string; /** * @constant * @type {string} * @name pc.EVENT_TOUCHSTART * @description Name of event fired when a new touch occurs. For example, a finger is placed on the device. */ const EVENT_TOUCHSTART: string; /** * @constant * @type {string} * @name pc.EVENT_TOUCHEND * @description Name of event fired when touch ends. For example, a finger is lifted off the device. */ const EVENT_TOUCHEND: string; /** * @constant * @type {string} * @name pc.EVENT_TOUCHMOVE * @description Name of event fired when a touch moves. */ const EVENT_TOUCHMOVE: string; /** * @constant * @type {string} * @name pc.EVENT_TOUCHCANCEL * @description Name of event fired when a touch point is interrupted in some way. * The exact reasons for cancelling a touch can vary from device to device. * For example, a modal alert pops up during the interaction; the touch point leaves the document area; * or there are more touch points than the device supports, in which case the earliest touch point is canceled. */ const EVENT_TOUCHCANCEL: string; /** * @constant * @type {number} * @name pc.KEY_BACKSPACE */ const KEY_BACKSPACE: number; /** * @constant * @type {number} * @name pc.KEY_TAB */ const KEY_TAB: number; /** * @constant * @type {number} * @name pc.KEY_RETURN */ const KEY_RETURN: number; /** * @constant * @type {number} * @name pc.KEY_ENTER */ const KEY_ENTER: number; /** * @constant * @type {number} * @name pc.KEY_SHIFT */ const KEY_SHIFT: number; /** * @constant * @type {number} * @name pc.KEY_CONTROL */ const KEY_CONTROL: number; /** * @constant * @type {number} * @name pc.KEY_ALT */ const KEY_ALT: number; /** * @constant * @type {number} * @name pc.KEY_PAUSE */ const KEY_PAUSE: number; /** * @constant * @type {number} * @name pc.KEY_CAPS_LOCK */ const KEY_CAPS_LOCK: number; /** * @constant * @type {number} * @name pc.KEY_ESCAPE */ const KEY_ESCAPE: number; /** * @constant * @type {number} * @name pc.KEY_SPACE */ const KEY_SPACE: number; /** * @constant * @type {number} * @name pc.KEY_PAGE_UP */ const KEY_PAGE_UP: number; /** * @constant * @type {number} * @name pc.KEY_PAGE_DOWN */ const KEY_PAGE_DOWN: number; /** * @constant * @type {number} * @name pc.KEY_END */ const KEY_END: number; /** * @constant * @type {number} * @name pc.KEY_HOME */ const KEY_HOME: number; /** * @constant * @type {number} * @name pc.KEY_LEFT */ const KEY_LEFT: number; /** * @constant * @type {number} * @name pc.KEY_UP */ const KEY_UP: number; /** * @constant * @type {number} * @name pc.KEY_RIGHT */ const KEY_RIGHT: number; /** * @constant * @type {number} * @name pc.KEY_DOWN */ const KEY_DOWN: number; /** * @constant * @type {number} * @name pc.KEY_PRINT_SCREEN */ const KEY_PRINT_SCREEN: number; /** * @constant * @type {number} * @name pc.KEY_INSERT */ const KEY_INSERT: number; /** * @constant * @type {number} * @name pc.KEY_DELETE */ const KEY_DELETE: number; /** * @constant * @type {number} * @name pc.KEY_0 */ const KEY_0: number; /** * @constant * @type {number} * @name pc.KEY_1 */ const KEY_1: number; /** * @constant * @type {number} * @name pc.KEY_2 */ const KEY_2: number; /** * @constant * @type {number} * @name pc.KEY_3 */ const KEY_3: number; /** * @constant * @type {number} * @name pc.KEY_4 */ const KEY_4: number; /** * @constant * @type {number} * @name pc.KEY_5 */ const KEY_5: number; /** * @constant * @type {number} * @name pc.KEY_6 */ const KEY_6: number; /** * @constant * @type {number} * @name pc.KEY_7 */ const KEY_7: number; /** * @constant * @type {number} * @name pc.KEY_8 */ const KEY_8: number; /** * @constant * @type {number} * @name pc.KEY_9 */ const KEY_9: number; /** * @constant * @type {number} * @name pc.KEY_SEMICOLON */ const KEY_SEMICOLON: number; /** * @constant * @type {number} * @name pc.KEY_EQUAL */ const KEY_EQUAL: number; /** * @constant * @type {number} * @name pc.KEY_A */ const KEY_A: number; /** * @constant * @type {number} * @name pc.KEY_B */ const KEY_B: number; /** * @constant * @type {number} * @name pc.KEY_C */ const KEY_C: number; /** * @constant * @type {number} * @name pc.KEY_D */ const KEY_D: number; /** * @constant * @type {number} * @name pc.KEY_E */ const KEY_E: number; /** * @constant * @type {number} * @name pc.KEY_F */ const KEY_F: number; /** * @constant * @type {number} * @name pc.KEY_G */ const KEY_G: number; /** * @constant * @type {number} * @name pc.KEY_H */ const KEY_H: number; /** * @constant * @type {number} * @name pc.KEY_I */ const KEY_I: number; /** * @constant * @type {number} * @name pc.KEY_J */ const KEY_J: number; /** * @constant * @type {number} * @name pc.KEY_K */ const KEY_K: number; /** * @constant * @type {number} * @name pc.KEY_L */ const KEY_L: number; /** * @constant * @type {number} * @name pc.KEY_M */ const KEY_M: number; /** * @constant * @type {number} * @name pc.KEY_N */ const KEY_N: number; /** * @constant * @type {number} * @name pc.KEY_O */ const KEY_O: number; /** * @constant * @type {number} * @name pc.KEY_P */ const KEY_P: number; /** * @constant * @type {number} * @name pc.KEY_Q */ const KEY_Q: number; /** * @constant * @type {number} * @name pc.KEY_R */ const KEY_R: number; /** * @constant * @type {number} * @name pc.KEY_S */ const KEY_S: number; /** * @constant * @type {number} * @name pc.KEY_T */ const KEY_T: number; /** * @constant * @type {number} * @name pc.KEY_U */ const KEY_U: number; /** * @constant * @type {number} * @name pc.KEY_V */ const KEY_V: number; /** * @constant * @type {number} * @name pc.KEY_W */ const KEY_W: number; /** * @constant * @type {number} * @name pc.KEY_X */ const KEY_X: number; /** * @constant * @type {number} * @name pc.KEY_Y */ const KEY_Y: number; /** * @constant * @type {number} * @name pc.KEY_Z */ const KEY_Z: number; /** * @constant * @type {number} * @name pc.KEY_WINDOWS */ const KEY_WINDOWS: number; /** * @constant * @type {number} * @name pc.KEY_CONTEXT_MENU */ const KEY_CONTEXT_MENU: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_0 */ const KEY_NUMPAD_0: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_1 */ const KEY_NUMPAD_1: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_2 */ const KEY_NUMPAD_2: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_3 */ const KEY_NUMPAD_3: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_4 */ const KEY_NUMPAD_4: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_5 */ const KEY_NUMPAD_5: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_6 */ const KEY_NUMPAD_6: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_7 */ const KEY_NUMPAD_7: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_8 */ const KEY_NUMPAD_8: number; /** * @constant * @type {number} * @name pc.KEY_NUMPAD_9 */ const KEY_NUMPAD_9: number; /** * @constant * @type {number} * @name pc.KEY_MULTIPLY */ const KEY_MULTIPLY: number; /** * @constant * @type {number} * @name pc.KEY_ADD */ const KEY_ADD: number; /** * @constant * @type {number} * @name pc.KEY_SEPARATOR */ const KEY_SEPARATOR: number; /** * @constant * @type {number} * @name pc.KEY_SUBTRACT */ const KEY_SUBTRACT: number; /** * @constant * @type {number} * @name pc.KEY_DECIMAL */ const KEY_DECIMAL: number; /** * @constant * @type {number} * @name pc.KEY_DIVIDE */ const KEY_DIVIDE: number; /** * @constant * @type {number} * @name pc.KEY_F1 */ const KEY_F1: number; /** * @constant * @type {number} * @name pc.KEY_F2 */ const KEY_F2: number; /** * @constant * @type {number} * @name pc.KEY_F3 */ const KEY_F3: number; /** * @constant * @type {number} * @name pc.KEY_F4 */ const KEY_F4: number; /** * @constant * @type {number} * @name pc.KEY_F5 */ const KEY_F5: number; /** * @constant * @type {number} * @name pc.KEY_F6 */ const KEY_F6: number; /** * @constant * @type {number} * @name pc.KEY_F7 */ const KEY_F7: number; /** * @constant * @type {number} * @name pc.KEY_F8 */ const KEY_F8: number; /** * @constant * @type {number} * @name pc.KEY_F9 */ const KEY_F9: number; /** * @constant * @type {number} * @name pc.KEY_F10 */ const KEY_F10: number; /** * @constant * @type {number} * @name pc.KEY_F11 */ const KEY_F11: number; /** * @constant * @type {number} * @name pc.KEY_F12 */ const KEY_F12: number; /** * @constant * @type {number} * @name pc.KEY_COMMA */ const KEY_COMMA: number; /** * @constant * @type {number} * @name pc.KEY_PERIOD */ const KEY_PERIOD: number; /** * @constant * @type {number} * @name pc.KEY_SLASH */ const KEY_SLASH: number; /** * @constant * @type {number} * @name pc.KEY_OPEN_BRACKET */ const KEY_OPEN_BRACKET: number; /** * @constant * @type {number} * @name pc.KEY_BACK_SLASH */ const KEY_BACK_SLASH: number; /** * @constant * @type {number} * @name pc.KEY_CLOSE_BRACKET */ const KEY_CLOSE_BRACKET: number; /** * @constant * @type {number} * @name pc.KEY_META */ const KEY_META: number; /** * @constant * @type {number} * @name pc.MOUSEBUTTON_NONE * @description No mouse buttons pressed. */ const MOUSEBUTTON_NONE: number; /** * @constant * @type {number} * @name pc.MOUSEBUTTON_LEFT * @description The left mouse button. */ const MOUSEBUTTON_LEFT: number; /** * @constant * @type {number} * @name pc.MOUSEBUTTON_MIDDLE * @description The middle mouse button. */ const MOUSEBUTTON_MIDDLE: number; /** * @constant * @type {number} * @name pc.MOUSEBUTTON_RIGHT * @description The right mouse button. */ const MOUSEBUTTON_RIGHT: number; /** * @constant * @type {number} * @name pc.PAD_1 * @description Index for pad 1. */ const PAD_1: number; /** * @constant * @type {number} * @name pc.PAD_2 * @description Index for pad 2. */ const PAD_2: number; /** * @constant * @type {number} * @name pc.PAD_3 * @description Index for pad 3. */ const PAD_3: number; /** * @constant * @type {number} * @name pc.PAD_4 * @description Index for pad 4. */ const PAD_4: number; /** * @constant * @type {number} * @name pc.PAD_FACE_1 * @description The first face button, from bottom going clockwise. */ const PAD_FACE_1: number; /** * @constant * @type {number} * @name pc.PAD_FACE_2 * @description The second face button, from bottom going clockwise. */ const PAD_FACE_2: number; /** * @constant * @type {number} * @name pc.PAD_FACE_3 * @description The third face button, from bottom going clockwise. */ const PAD_FACE_3: number; /** * @constant * @type {number} * @name pc.PAD_FACE_4 * @description The fourth face button, from bottom going clockwise. */ const PAD_FACE_4: number; /** * @constant * @type {number} * @name pc.PAD_L_SHOULDER_1 * @description The first shoulder button on the left. */ const PAD_L_SHOULDER_1: number; /** * @constant * @type {number} * @name pc.PAD_R_SHOULDER_1 * @description The first shoulder button on the right. */ const PAD_R_SHOULDER_1: number; /** * @constant * @type {number} * @name pc.PAD_L_SHOULDER_2 * @description The second shoulder button on the left. */ const PAD_L_SHOULDER_2: number; /** * @constant * @type {number} * @name pc.PAD_R_SHOULDER_2 * @description The second shoulder button on the right. */ const PAD_R_SHOULDER_2: number; /** * @constant * @type {number} * @name pc.PAD_SELECT * @description The select button. */ const PAD_SELECT: number; /** * @constant * @type {number} * @name pc.PAD_START * @description The start button. */ const PAD_START: number; /** * @constant * @type {number} * @name pc.PAD_L_STICK_BUTTON * @description The button when depressing the left analogue stick. */ const PAD_L_STICK_BUTTON: number; /** * @constant * @type {number} * @name pc.PAD_R_STICK_BUTTON * @description The button when depressing the right analogue stick. */ const PAD_R_STICK_BUTTON: number; /** * @constant * @type {number} * @name pc.PAD_UP * @description Direction pad up. */ const PAD_UP: number; /** * @constant * @type {number} * @name pc.PAD_DOWN * @description Direction pad down. */ const PAD_DOWN: number; /** * @constant * @type {number} * @name pc.PAD_LEFT * @description Direction pad left. */ const PAD_LEFT: number; /** * @constant * @type {number} * @name pc.PAD_RIGHT * @description Direction pad right. */ const PAD_RIGHT: number; /** * @constant * @type {number} * @name pc.PAD_VENDOR * @description Vendor specific button. */ const PAD_VENDOR: number; /** * @constant * @type {number} * @name pc.PAD_L_STICK_X * @description Horizontal axis on the left analogue stick. */ const PAD_L_STICK_X: number; /** * @constant * @type {number} * @name pc.PAD_L_STICK_Y * @description Vertical axis on the left analogue stick. */ const PAD_L_STICK_Y: number; /** * @constant * @type {number} * @name pc.PAD_R_STICK_X * @description Horizontal axis on the right analogue stick. */ const PAD_R_STICK_X: number; /** * @constant * @type {number} * @name pc.PAD_R_STICK_Y * @description Vertical axis on the right analogue stick. */ const PAD_R_STICK_Y: number; /** * @class * @name pc.KeyboardEvent * @classdesc The KeyboardEvent is passed into all event callbacks from the {@link pc.Keyboard}. It corresponds to a key press or release. * @description Create a new KeyboardEvent. * @param {pc.Keyboard} keyboard - The keyboard object which is firing the event. * @param {KeyboardEvent} event - The original browser event that was fired. * @property {number} key The keyCode of the key that has changed. See the pc.KEY_* constants. * @property {Element} element The element that fired the keyboard event. * @property {KeyboardEvent} event The original browser event which was fired. * @example * var onKeyDown = function (e) { * if (e.key === pc.KEY_SPACE) { * // space key pressed * } * e.event.preventDefault(); // Use original browser event to prevent browser action. * }; * app.keyboard.on("keydown", onKeyDown, this); */ class KeyboardEvent { constructor(keyboard: pc.Keyboard, event: KeyboardEvent); /** * The keyCode of the key that has changed. See the pc.KEY_* constants. */ key: number; /** * The element that fired the keyboard event. */ element: Element; /** * The original browser event which was fired. */ event: KeyboardEvent; } /** * @class * @name pc.Keyboard * @augments pc.EventHandler * @classdesc A Keyboard device bound to an Element. Allows you to detect the state of the key presses. * Note, Keyboard object must be attached to an Element before it can detect any key presses. * @description Create a new Keyboard object. * @param {Element|Window} [element] - Element to attach Keyboard to. Note that elements like <div> can't * accept focus by default. To use keyboard events on an element like this it must have a value of 'tabindex' e.g. tabindex="0". For more details: http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-TECHS/SCR29.html. * @param {object} [options] - Optional options object. * @param {boolean} [options.preventDefault] - Call preventDefault() in key event handlers. This stops the default action of the event occurring. e.g. Ctrl+T will not open a new browser tab * @param {boolean} [options.stopPropagation] - Call stopPropagation() in key event handlers. This stops the event bubbling up the DOM so no parent handlers will be notified of the event * @example * var keyboard = new pc.Keyboard(window); // attach keyboard listeners to the window */ class Keyboard extends pc.EventHandler { constructor(element?: Element | Window, options?: { preventDefault?: boolean; stopPropagation?: boolean; }); /** * @function * @name pc.Keyboard#attach * @description Attach the keyboard event handlers to an Element. * @param {Element} element - The element to listen for keyboard events on. */ attach(element: Element): void; /** * @function * @name pc.Keyboard#detach * @description Detach the keyboard event handlers from the element it is attached to. */ detach(): void; /** * @function * @name pc.Keyboard#isPressed * @description Return true if the key is currently down. * @param {number} key - The keyCode of the key to test. See the pc.KEY_* constants. * @returns {boolean} True if the key was pressed, false if not. */ isPressed(key: number): boolean; /** * @function * @name pc.Keyboard#wasPressed * @description Returns true if the key was pressed since the last update. * @param {number} key - The keyCode of the key to test. See the pc.KEY_* constants. * @returns {boolean} True if the key was pressed. */ wasPressed(key: number): boolean; /** * @function * @name pc.Keyboard#wasReleased * @description Returns true if the key was released since the last update. * @param {number} key - The keyCode of the key to test. See the pc.KEY_* constants. * @returns {boolean} True if the key was pressed. */ wasReleased(key: number): boolean; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.MouseEvent * @classdesc MouseEvent object that is passed to events 'mousemove', 'mouseup', 'mousedown' and 'mousewheel'. * @description Create an new MouseEvent. * @param {pc.Mouse} mouse - The Mouse device that is firing this event. * @param {MouseEvent} event - The original browser event that fired. * @property {number} x The x co-ordinate of the mouse pointer relative to the element pc.Mouse is attached to. * @property {number} y The y co-ordinate of the mouse pointer relative to the element pc.Mouse is attached to. * @property {number} dx The change in x co-ordinate since the last mouse event. * @property {number} dy The change in y co-ordinate since the last mouse event. * @property {number} button The mouse button associated with this event. Can be: * * * {@link pc.MOUSEBUTTON_LEFT} * * {@link pc.MOUSEBUTTON_MIDDLE} * * {@link pc.MOUSEBUTTON_RIGHT} * * @property {number} wheelDelta A value representing the amount the mouse wheel has moved, only * valid for {@link mousewheel} events. * @property {Element} element The element that the mouse was fired from. * @property {boolean} ctrlKey True if the ctrl key was pressed when this event was fired. * @property {boolean} shiftKey True if the shift key was pressed when this event was fired. * @property {boolean} altKey True if the alt key was pressed when this event was fired. * @property {boolean} metaKey True if the meta key was pressed when this event was fired. * @property {MouseEvent} event The original browser event. */ class MouseEvent { constructor(mouse: pc.Mouse, event: MouseEvent); /** * The x co-ordinate of the mouse pointer relative to the element pc.Mouse is attached to. */ x: number; /** * The y co-ordinate of the mouse pointer relative to the element pc.Mouse is attached to. */ y: number; /** * The change in x co-ordinate since the last mouse event. */ dx: number; /** * The change in y co-ordinate since the last mouse event. */ dy: number; /** * The mouse button associated with this event. Can be: * {@link pc.MOUSEBUTTON_LEFT} * {@link pc.MOUSEBUTTON_MIDDLE} * {@link pc.MOUSEBUTTON_RIGHT} */ button: number; /** * A value representing the amount the mouse wheel has moved, only valid for {@link mousewheel} events. */ wheelDelta: number; /** * The element that the mouse was fired from. */ element: Element; /** * True if the ctrl key was pressed when this event was fired. */ ctrlKey: boolean; /** * True if the shift key was pressed when this event was fired. */ shiftKey: boolean; /** * True if the alt key was pressed when this event was fired. */ altKey: boolean; /** * True if the meta key was pressed when this event was fired. */ metaKey: boolean; /** * The original browser event. */ event: MouseEvent; } /** * @class * @name pc.Mouse * @augments pc.EventHandler * @classdesc A Mouse Device, bound to a DOM Element. * @description Create a new Mouse device. * @param {Element} [element] - The Element that the mouse events are attached to. */ class Mouse extends pc.EventHandler { constructor(element?: Element); /** * @static * @function * @name pc.Mouse.isPointerLocked * @description Check if the mouse pointer has been locked, using {@link pc.Mouse#enabledPointerLock}. * @returns {boolean} True if locked. */ static isPointerLocked(): boolean; /** * @function * @name pc.Mouse#attach * @description Attach mouse events to an Element. * @param {Element} element - The DOM element to attach the mouse to. */ attach(element: Element): void; /** * @function * @name pc.Mouse#detach * @description Remove mouse events from the element that it is attached to. */ detach(): void; /** * @function * @name pc.Mouse#disableContextMenu * @description Disable the context menu usually activated with right-click. */ disableContextMenu(): void; /** * @function * @name pc.Mouse#enableContextMenu * @description Enable the context menu usually activated with right-click. This option is active by default. */ enableContextMenu(): void; /** * @function * @name pc.Mouse#enablePointerLock * @description Request that the browser hides the mouse cursor and locks the mouse to the element. * Allowing raw access to mouse movement input without risking the mouse exiting the element. * Notes: * * * In some browsers this will only work when the browser is running in fullscreen mode. See {@link pc.Application#enableFullscreen} * * Enabling pointer lock can only be initiated by a user action e.g. in the event handler for a mouse or keyboard input. * * @param {pc.callbacks.LockMouse} [success] - Function called if the request for mouse lock is successful. * @param {pc.callbacks.LockMouse} [error] - Function called if the request for mouse lock is unsuccessful. */ enablePointerLock(success?: pc.callbacks.LockMouse, error?: pc.callbacks.LockMouse): void; /** * @function * @name pc.Mouse#disablePointerLock * @description Return control of the mouse cursor to the user. * @param {pc.callbacks.LockMouse} [success] - Function called when the mouse lock is disabled. */ disablePointerLock(success?: pc.callbacks.LockMouse): void; /** * @function * @name pc.Mouse#update * @description Update method, should be called once per frame. */ update(): void; /** * @function * @name pc.Mouse#isPressed * @description Returns true if the mouse button is currently pressed. * @param {number} button - The mouse button to test. Can be: * * * {@link pc.MOUSEBUTTON_LEFT} * * {@link pc.MOUSEBUTTON_MIDDLE} * * {@link pc.MOUSEBUTTON_RIGHT} * * @returns {boolean} True if the mouse button is current pressed. */ isPressed(button: number): boolean; /** * @function * @name pc.Mouse#wasPressed * @description Returns true if the mouse button was pressed this frame (since the last call to update). * @param {number} button - The mouse button to test. Can be: * * * {@link pc.MOUSEBUTTON_LEFT} * * {@link pc.MOUSEBUTTON_MIDDLE} * * {@link pc.MOUSEBUTTON_RIGHT} * * @returns {boolean} True if the mouse button was pressed since the last update. */ wasPressed(button: number): boolean; /** * @function * @name pc.Mouse#wasReleased * @description Returns true if the mouse button was released this frame (since the last call to update). * @param {number} button - The mouse button to test. Can be: * * * {@link pc.MOUSEBUTTON_LEFT} * * {@link pc.MOUSEBUTTON_MIDDLE} * * {@link pc.MOUSEBUTTON_RIGHT} * * @returns {boolean} True if the mouse button was released since the last update. */ wasReleased(button: number): boolean; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.Touch * @classdesc A instance of a single point touch on a {@link pc.TouchDevice}. * @description Create a new Touch object from the browser Touch. * @param {Touch} touch - The browser Touch object. * @property {number} id The identifier of the touch. * @property {number} x The x co-ordinate relative to the element that the TouchDevice is attached to. * @property {number} y The y co-ordinate relative to the element that the TouchDevice is attached to. * @property {Element} target The target element of the touch event. * @property {Touch} touch The original browser Touch object. */ class Touch { constructor(touch: Touch); /** * The identifier of the touch. */ id: number; /** * The x co-ordinate relative to the element that the TouchDevice is attached to. */ x: number; /** * The y co-ordinate relative to the element that the TouchDevice is attached to. */ y: number; /** * The target element of the touch event. */ target: Element; /** * The original browser Touch object. */ touch: Touch; } /** * @class * @name pc.TouchEvent * @classdesc A Event corresponding to touchstart, touchend, touchmove or touchcancel. TouchEvent wraps the standard * browser event and provides lists of {@link pc.Touch} objects. * @description Create a new TouchEvent from an existing browser event. * @param {pc.TouchDevice} device - The source device of the touch events. * @param {TouchEvent} event - The original browser TouchEvent. * @property {Element} element The target Element that the event was fired from. * @property {pc.Touch[]} touches A list of all touches currently in contact with the device. * @property {pc.Touch[]} changedTouches A list of touches that have changed since the last event. */ class TouchEvent { constructor(device: pc.TouchDevice, event: TouchEvent); /** * @function * @name pc.TouchEvent#getTouchById * @description Get an event from one of the touch lists by the id. It is useful to access * touches by their id so that you can be sure you are referencing the same touch. * @param {number} id - The identifier of the touch. * @param {pc.Touch[]} list - An array of touches to search. * @returns {pc.Touch} The {@link pc.Touch} object or null. */ getTouchById(id: number, list: pc.Touch[]): pc.Touch; /** * The target Element that the event was fired from. */ element: Element; /** * A list of all touches currently in contact with the device. */ touches: pc.Touch[]; /** * A list of touches that have changed since the last event. */ changedTouches: pc.Touch[]; } /** * @class * @name pc.TouchDevice * @augments pc.EventHandler * @classdesc Attach a TouchDevice to an element and it will receive and fire events when the element is touched. * See also {@link pc.Touch} and {@link pc.TouchEvent}. * @description Create a new touch device and attach it to an element. * @param {Element} element - The element to attach listen for events on. */ class TouchDevice extends pc.EventHandler { constructor(element: Element); /** * @function * @name pc.TouchDevice#attach * @description Attach a device to an element in the DOM. * If the device is already attached to an element this method will detach it first. * @param {Element} element - The element to attach to. */ attach(element: Element): void; /** * @function * @name pc.TouchDevice#detach * @description Detach a device from the element it is attached to. */ detach(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @function * @name pc.getTouchTargetCoords * @description Similiar to {@link pc.getTargetCoords} for the MouseEvents. * This function takes a browser Touch object and returns the co-ordinates of the * touch relative to the target element. * @param {Touch} touch - The browser Touch object. * @returns {object} The co-ordinates of the touch relative to the touch.target element. In the format {x, y}. */ function getTouchTargetCoords(touch: Touch): any; /** * @class * @name pc.CurveSet * @classdesc A curve set is a collection of curves. * @description Creates a new curve set. * @param {Array} [curveKeys] - An array of arrays of keys (pairs of numbers with * the time first and value second). */ class CurveSet { constructor(curveKeys?: number[][]); /** * @function * @name pc.CurveSet#get * @description Return a specific curve in the curve set. * @param {number} index - The index of the curve to return. * @returns {pc.Curve} The curve at the specified index. */ get(index: number): pc.Curve; /** * @function * @name pc.CurveSet#value * @description Returns the interpolated value of all curves in the curve * set at the specified time. * @param {number} time - The time at which to calculate the value. * @param {number[]} [result] - The interpolated curve values at the specified time. * If this parameter is not supplied, the function allocates a new array internally * to return the result. * @returns {number[]} The interpolated curve values at the specified time. */ value(time: number, result?: number[]): number[]; /** * @function * @name pc.CurveSet#clone * @description Returns a clone of the specified curve set object. * @returns {pc.CurveSet} A clone of the specified curve set. */ clone(): pc.CurveSet; /** * @readonly * @name pc.CurveSet#length * @type {number} * @description The number of curves in the curve set. */ readonly length: number; /** * @name pc.CurveSet#type * @type {number} * @description The interpolation scheme applied to all curves in the curve set. Can be: * * * {@link pc.CURVE_LINEAR} * * {@link pc.CURVE_SMOOTHSTEP} * * {@link pc.CURVE_SPLINE} * * {@link pc.CURVE_STEP} * * Defaults to {@link pc.CURVE_SMOOTHSTEP}. */ type: number; } /** * @constant * @type {number} * @name pc.CURVE_LINEAR * @description A linear interpolation scheme. */ const CURVE_LINEAR: number; /** * @constant * @type {number} * @name pc.CURVE_SMOOTHSTEP * @description A smooth step interpolation scheme. */ const CURVE_SMOOTHSTEP: number; /** * @deprecated * @constant * @type {number} * @name pc.CURVE_CATMULL * @description A Catmull-Rom spline interpolation scheme. This interpolation scheme is deprecated. Use CURVE_SPLINE instead. */ const CURVE_CATMULL: number; /** * @deprecated * @constant * @type {number} * @name pc.CURVE_CARDINAL * @description A cardinal spline interpolation scheme. This interpolation scheme is deprecated. Use CURVE_SPLINE instead. */ const CURVE_CARDINAL: number; /** * @constant * @type {number} * @name pc.CURVE_SPLINE * @description Cardinal spline interpolation scheme. For Catmull-Rom, specify curve tension 0.5. */ const CURVE_SPLINE: number; /** * @constant * @type {number} * @name pc.CURVE_STEP * @description A stepped interpolater, free from the shackles of blending. */ const CURVE_STEP: number; /** * @class * @name pc.Curve * @classdesc A curve is a collection of keys (time/value pairs). The shape of the * curve is defined by its type that specifies an interpolation scheme for the keys. * @description Creates a new curve. * @param {number[]} [data] - An array of keys (pairs of numbers with the time first and * value second). * @property {number} length The number of keys in the curve. [read only]. * @property {number} type The curve interpolation scheme. Can be: * * * {@link pc.CURVE_LINEAR} * * {@link pc.CURVE_SMOOTHSTEP} * * {@link pc.CURVE_SPLINE} * * {@link pc.CURVE_STEP} * * Defaults to {@link pc.CURVE_SMOOTHSTEP}. */ class Curve { constructor(data?: number[]); /** * @function * @name pc.Curve#add * @description Add a new key to the curve. * @param {number} time - Time to add new key. * @param {number} value - Value of new key. * @returns {number[]} [time, value] pair. */ add(time: number, value: number): number[]; /** * @function * @name pc.Curve#get * @description Return a specific key. * @param {number} index - The index of the key to return. * @returns {number[]} The key at the specified index. */ get(index: number): number[]; /** * @function * @name pc.Curve#sort * @description Sort keys by time. */ sort(): void; /** * @function * @name pc.Curve#value * @description Returns the interpolated value of the curve at specified time. * @param {number} time - The time at which to calculate the value. * @returns {number} The interpolated value. */ value(time: number): number; /** * @function * @name pc.Curve#clone * @description Returns a clone of the specified curve object. * @returns {pc.Curve} A clone of the specified curve. */ clone(): pc.Curve; /** * The number of keys in the curve. [read only]. */ length: number; /** * The curve interpolation scheme. Can be: * {@link pc.CURVE_LINEAR} * {@link pc.CURVE_SMOOTHSTEP} * {@link pc.CURVE_SPLINE} * {@link pc.CURVE_STEP} Defaults to {@link pc.CURVE_SMOOTHSTEP}. */ type: number; } /** * @class * @name pc.Mat3 * @classdesc A 3x3 matrix. * @description Creates a new identity Mat3 object. * @property {Float32Array} data Matrix elements in the form of a flat array. */ class Mat3 { /** * @function * @name pc.Mat3#clone * @description Creates a duplicate of the specified matrix. * @returns {pc.Mat3} A duplicate matrix. * @example * var src = new pc.Mat3().translate(10, 20, 30); * var dst = src.clone(); * console.log("The two matrices are " + (src.equals(dst) ? "equal" : "different")); */ clone(): pc.Mat3; /** * @function * @name pc.Mat3#copy * @description Copies the contents of a source 3x3 matrix to a destination 3x3 matrix. * @param {pc.Mat3} rhs - A 3x3 matrix to be copied. * @returns {pc.Mat3} Self for chaining. * @example * var src = new pc.Mat3().translate(10, 20, 30); * var dst = new pc.Mat3(); * dst.copy(src); * console.log("The two matrices are " + (src.equals(dst) ? "equal" : "different")); */ copy(rhs: pc.Mat3): pc.Mat3; /** * @function * @name pc.Mat3#set * @description Copies the contents of a source array[9] to a destination 3x3 matrix. * @param {number[]} src - An array[9] to be copied. * @returns {pc.Mat3} Self for chaining. * @example * var dst = new pc.Mat3(); * dst.set([0, 1, 2, 3, 4, 5, 6, 7, 8]); */ set(src: number[]): pc.Mat3; /** * @function * @name pc.Mat3#equals * @param {pc.Mat3} rhs - The other matrix. * @description Reports whether two matrices are equal. * @returns {boolean} True if the matrices are equal and false otherwise. * @example * var a = new pc.Mat3().translate(10, 20, 30); * var b = new pc.Mat3(); * console.log("The two matrices are " + (a.equals(b) ? "equal" : "different")); */ equals(rhs: pc.Mat3): boolean; /** * @function * @name pc.Mat3#isIdentity * @description Reports whether the specified matrix is the identity matrix. * @returns {boolean} True if the matrix is identity and false otherwise. * @example * var m = new pc.Mat3(); * console.log("The matrix is " + (m.isIdentity() ? "identity" : "not identity")); */ isIdentity(): boolean; /** * @function * @name pc.Mat3#setIdentity * @description Sets the matrix to the identity matrix. * @returns {pc.Mat3} Self for chaining. * @example * m.setIdentity(); * console.log("The matrix is " + (m.isIdentity() ? "identity" : "not identity")); */ setIdentity(): pc.Mat3; /** * @function * @name pc.Mat3#toString * @description Converts the matrix to string form. * @returns {string} The matrix in string form. * @example * var m = new pc.Mat3(); * // Should output '[1, 0, 0, 0, 1, 0, 0, 0, 1]' * console.log(m.toString()); */ toString(): string; /** * @function * @name pc.Mat3#transpose * @description Generates the transpose of the specified 3x3 matrix. * @returns {pc.Mat3} Self for chaining. * @example * var m = new pc.Mat3(); * * // Transpose in place * m.transpose(); */ transpose(): pc.Mat3; /** * @field * @static * @readonly * @name pc.Mat3.IDENTITY * @type {pc.Mat3} * @description A constant matrix set to the identity. */ static readonly IDENTITY: pc.Mat3; /** * @field * @static * @readonly * @name pc.Mat3.ZERO * @type {pc.Mat3} * @description A constant matrix with all elements set to 0. */ static readonly ZERO: pc.Mat3; /** * Matrix elements in the form of a flat array. */ data: Float32Array; } /** * @class * @name pc.Mat4 * @classdesc A 4x4 matrix. * @description Creates a new identity Mat4 object. * @property {Float32Array} data Matrix elements in the form of a flat array. */ class Mat4 { /** * @function * @name pc.Mat4#add2 * @description Adds the specified 4x4 matrices together and stores the result in * the current instance. * @param {pc.Mat4} lhs - The 4x4 matrix used as the first operand of the addition. * @param {pc.Mat4} rhs - The 4x4 matrix used as the second operand of the addition. * @returns {pc.Mat4} Self for chaining. * @example * var m = new pc.Mat4(); * * m.add2(pc.Mat4.IDENTITY, pc.Mat4.ONE); * * console.log("The result of the addition is: " + m.toString()); */ add2(lhs: pc.Mat4, rhs: pc.Mat4): pc.Mat4; /** * @function * @name pc.Mat4#add * @description Adds the specified 4x4 matrix to the current instance. * @param {pc.Mat4} rhs - The 4x4 matrix used as the second operand of the addition. * @returns {pc.Mat4} Self for chaining. * @example * var m = new pc.Mat4(); * * m.add(pc.Mat4.ONE); * * console.log("The result of the addition is: " + m.toString()); */ add(rhs: pc.Mat4): pc.Mat4; /** * @function * @name pc.Mat4#clone * @description Creates a duplicate of the specified matrix. * @returns {pc.Mat4} A duplicate matrix. * @example * var src = new pc.Mat4().setFromEulerAngles(10, 20, 30); * var dst = src.clone(); * console.log("The two matrices are " + (src.equals(dst) ? "equal" : "different")); */ clone(): pc.Mat4; /** * @function * @name pc.Mat4#copy * @description Copies the contents of a source 4x4 matrix to a destination 4x4 matrix. * @param {pc.Mat4} rhs - A 4x4 matrix to be copied. * @returns {pc.Mat4} Self for chaining. * @example * var src = new pc.Mat4().setFromEulerAngles(10, 20, 30); * var dst = new pc.Mat4(); * dst.copy(src); * console.log("The two matrices are " + (src.equals(dst) ? "equal" : "different")); */ copy(rhs: pc.Mat4): pc.Mat4; /** * @function * @name pc.Mat4#equals * @description Reports whether two matrices are equal. * @param {pc.Mat4} rhs - The other matrix. * @returns {boolean} True if the matrices are equal and false otherwise. * @example * var a = new pc.Mat4().setFromEulerAngles(10, 20, 30); * var b = new pc.Mat4(); * console.log("The two matrices are " + (a.equals(b) ? "equal" : "different")); */ equals(rhs: pc.Mat4): boolean; /** * @function * @name pc.Mat4#isIdentity * @description Reports whether the specified matrix is the identity matrix. * @returns {boolean} True if the matrix is identity and false otherwise. * @example * var m = new pc.Mat4(); * console.log("The matrix is " + (m.isIdentity() ? "identity" : "not identity")); */ isIdentity(): boolean; /** * @function * @name pc.Mat4#mul2 * @description Multiplies the specified 4x4 matrices together and stores the result in * the current instance. * @param {pc.Mat4} lhs - The 4x4 matrix used as the first multiplicand of the operation. * @param {pc.Mat4} rhs - The 4x4 matrix used as the second multiplicand of the operation. * @returns {pc.Mat4} Self for chaining. * @example * var a = new pc.Mat4().setFromEulerAngles(10, 20, 30); * var b = new pc.Mat4().setFromAxisAngle(pc.Vec3.UP, 180); * var r = new pc.Mat4(); * * // r = a * b * r.mul2(a, b); * * console.log("The result of the multiplication is: " + r.toString()); */ mul2(lhs: pc.Mat4, rhs: pc.Mat4): pc.Mat4; /** * @function * @name pc.Mat4#mul * @description Multiplies the current instance by the specified 4x4 matrix. * @param {pc.Mat4} rhs - The 4x4 matrix used as the second multiplicand of the operation. * @returns {pc.Mat4} Self for chaining. * @example * var a = new pc.Mat4().setFromEulerAngles(10, 20, 30); * var b = new pc.Mat4().setFromAxisAngle(pc.Vec3.UP, 180); * * // a = a * b * a.mul(b); * * console.log("The result of the multiplication is: " + a.toString()); */ mul(rhs: pc.Mat4): pc.Mat4; /** * @function * @name pc.Mat4#transformPoint * @description Transforms a 3-dimensional point by a 4x4 matrix. * @param {pc.Vec3} vec - The 3-dimensional point to be transformed. * @param {pc.Vec3} [res] - An optional 3-dimensional point to receive the result of the transformation. * @returns {pc.Vec3} The input point v transformed by the current instance. * @example * // Create a 3-dimensional point * var v = new pc.Vec3(1, 2, 3); * * // Create a 4x4 rotation matrix * var m = new pc.Mat4().setFromEulerAngles(10, 20, 30); * * var tv = m.transformPoint(v); */ transformPoint(vec: pc.Vec3, res?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Mat4#transformVector * @description Transforms a 3-dimensional vector by a 4x4 matrix. * @param {pc.Vec3} vec - The 3-dimensional vector to be transformed. * @param {pc.Vec3} [res] - An optional 3-dimensional vector to receive the result of the transformation. * @returns {pc.Vec3} The input vector v transformed by the current instance. * @example * // Create a 3-dimensional vector * var v = new pc.Vec3(1, 2, 3); * * // Create a 4x4 rotation matrix * var m = new pc.Mat4().setFromEulerAngles(10, 20, 30); * * var tv = m.transformVector(v); */ transformVector(vec: pc.Vec3, res?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Mat4#transformVec4 * @description Transforms a 4-dimensional vector by a 4x4 matrix. * @param {pc.Vec4} vec - The 4-dimensional vector to be transformed. * @param {pc.Vec4} [res] - An optional 4-dimensional vector to receive the result of the transformation. * @returns {pc.Vec4} The input vector v transformed by the current instance. * @example * // Create an input 4-dimensional vector * var v = new pc.Vec4(1, 2, 3, 4); * * // Create an output 4-dimensional vector * var result = new pc.Vec4(); * * // Create a 4x4 rotation matrix * var m = new pc.Mat4().setFromEulerAngles(10, 20, 30); * * m.transformVec4(v, result); */ transformVec4(vec: pc.Vec4, res?: pc.Vec4): pc.Vec4; /** * @function * @name pc.Mat4#setLookAt * @description Sets the specified matrix to a viewing matrix derived from an eye point, a target point * and an up vector. The matrix maps the target point to the negative z-axis and the eye point to the * origin, so that when you use a typical projection matrix, the center of the scene maps to the center * of the viewport. Similarly, the direction described by the up vector projected onto the viewing plane * is mapped to the positive y-axis so that it points upward in the viewport. The up vector must not be * parallel to the line of sight from the eye to the reference point. * @param {pc.Vec3} position - 3-d vector holding view position. * @param {pc.Vec3} target - 3-d vector holding reference point. * @param {pc.Vec3} up - 3-d vector holding the up direction. * @returns {pc.Mat4} Self for chaining. * @example * var position = new pc.Vec3(10, 10, 10); * var target = new pc.Vec3(0, 0, 0); * var up = new pc.Vec3(0, 1, 0); * var m = new pc.Mat4().setLookAt(position, target, up); */ setLookAt(position: pc.Vec3, target: pc.Vec3, up: pc.Vec3): pc.Mat4; /** * @function * @name pc.Mat4#setPerspective * @description Sets the specified matrix to a perspective projection matrix. The function's * parameters define the shape of a frustum. * @param {number} fov - The frustum's field of view in degrees. The fovIsHorizontal parameter * controls whether this is a vertical or horizontal field of view. By default, it's a vertical * field of view. * @param {number} aspect - The aspect ratio of the frustum's projection plane (width / height). * @param {number} znear - The near clip plane in eye coordinates. * @param {number} zfar - The far clip plane in eye coordinates. * @param {boolean} [fovIsHorizontal=false] - Set to true to treat the fov as horizontal (x-axis) * and false for vertical (y-axis). Defaults to false. * @returns {pc.Mat4} Self for chaining. * @example * // Create a 4x4 perspective projection matrix * var persp = pc.Mat4().setPerspective(45, 16 / 9, 1, 1000); */ setPerspective(fov: number, aspect: number, znear: number, zfar: number, fovIsHorizontal?: boolean): pc.Mat4; /** * @function * @name pc.Mat4#setOrtho * @description Sets the specified matrix to an orthographic projection matrix. The function's parameters * define the shape of a cuboid-shaped frustum. * @param {number} left - The x-coordinate for the left edge of the camera's projection plane in eye space. * @param {number} right - The x-coordinate for the right edge of the camera's projection plane in eye space. * @param {number} bottom - The y-coordinate for the bottom edge of the camera's projection plane in eye space. * @param {number} top - The y-coordinate for the top edge of the camera's projection plane in eye space. * @param {number} near - The near clip plane in eye coordinates. * @param {number} far - The far clip plane in eye coordinates. * @returns {pc.Mat4} Self for chaining. * @example * // Create a 4x4 orthographic projection matrix * var ortho = pc.Mat4().ortho(-2, 2, -2, 2, 1, 1000); */ setOrtho(left: number, right: number, bottom: number, top: number, near: number, far: number): pc.Mat4; /** * @function * @name pc.Mat4#setFromAxisAngle * @description Sets the specified matrix to a rotation matrix equivalent to a rotation around * an axis. The axis must be normalized (unit length) and the angle must be specified in degrees. * @param {pc.Vec3} axis - The normalized axis vector around which to rotate. * @param {number} angle - The angle of rotation in degrees. * @returns {pc.Mat4} Self for chaining. * @example * // Create a 4x4 rotation matrix * var rm = new pc.Mat4().setFromAxisAngle(pc.Vec3.UP, 90); */ setFromAxisAngle(axis: pc.Vec3, angle: number): pc.Mat4; /** * @function * @name pc.Mat4#invert * @description Sets the specified matrix to its inverse. * @returns {pc.Mat4} Self for chaining. * @example * // Create a 4x4 rotation matrix of 180 degrees around the y-axis * var rot = new pc.Mat4().setFromAxisAngle(pc.Vec3.UP, 180); * * // Invert in place * rot.invert(); */ invert(): pc.Mat4; /** * @function * @name pc.Mat4#set * @description Sets matrix data from an array. * @param {number[]} src - Source array. Must have 16 values. * @returns {pc.Mat4} Self for chaining. */ set(src: number[]): pc.Mat4; /** * @function * @name pc.Mat4#setIdentity * @description Sets the specified matrix to the identity matrix. * @returns {pc.Mat4} Self for chaining. * @example * m.setIdentity(); * console.log("The matrix is " + (m.isIdentity() ? "identity" : "not identity")); */ setIdentity(): pc.Mat4; /** * @function * @name pc.Mat4#setTRS * @description Sets the specified matrix to the concatenation of a translation, a * quaternion rotation and a scale. * @param {pc.Vec3} t - A 3-d vector translation. * @param {pc.Quat} r - A quaternion rotation. * @param {pc.Vec3} s - A 3-d vector scale. * @returns {pc.Mat4} Self for chaining. * @example * var t = new pc.Vec3(10, 20, 30); * var r = new pc.Quat(); * var s = new pc.Vec3(2, 2, 2); * * var m = new pc.Mat4(); * m.setTRS(t, r, s); */ setTRS(t: pc.Vec3, r: pc.Quat, s: pc.Vec3): pc.Mat4; /** * @function * @name pc.Mat4#transpose * @description Sets the specified matrix to its transpose. * @returns {pc.Mat4} Self for chaining. * @example * var m = new pc.Mat4(); * * // Transpose in place * m.transpose(); */ transpose(): pc.Mat4; /** * @function * @name pc.Mat4#getTranslation * @description Extracts the translational component from the specified 4x4 matrix. * @param {pc.Vec3} [t] - The vector to receive the translation of the matrix. * @returns {pc.Vec3} The translation of the specified 4x4 matrix. * @example * // Create a 4x4 matrix * var m = new pc.Mat4(); * * // Query the z-axis component * var t = new pc.Vec3(); * m.getTranslation(t); */ getTranslation(t?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Mat4#getX * @description Extracts the x-axis from the specified 4x4 matrix. * @param {pc.Vec3} [x] - The vector to receive the x axis of the matrix. * @returns {pc.Vec3} The x-axis of the specified 4x4 matrix. * @example * // Create a 4x4 matrix * var m = new pc.Mat4(); * * // Query the z-axis component * var x = new pc.Vec3(); * m.getX(x); */ getX(x?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Mat4#getY * @description Extracts the y-axis from the specified 4x4 matrix. * @param {pc.Vec3} [y] - The vector to receive the y axis of the matrix. * @returns {pc.Vec3} The y-axis of the specified 4x4 matrix. * @example * // Create a 4x4 matrix * var m = new pc.Mat4(); * * // Query the z-axis component * var y = new pc.Vec3(); * m.getY(y); */ getY(y?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Mat4#getZ * @description Extracts the z-axis from the specified 4x4 matrix. * @param {pc.Vec3} [z] - The vector to receive the z axis of the matrix. * @returns {pc.Vec3} The z-axis of the specified 4x4 matrix. * @example * // Create a 4x4 matrix * var m = new pc.Mat4(); * * // Query the z-axis component * var z = new pc.Vec3(); * m.getZ(z); */ getZ(z?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Mat4#getScale * @description Extracts the scale component from the specified 4x4 matrix. * @param {pc.Vec3} [scale] - Vector to receive the scale. * @returns {pc.Vec3} The scale in X, Y and Z of the specified 4x4 matrix. * @example * // Create a 4x4 scale matrix * var m = new pc.Mat4().scale(2, 3, 4); * * // Query the scale component * var scale = m.getScale(); */ getScale(scale?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Mat4#setFromEulerAngles * @description Sets the specified matrix to a rotation matrix defined by * Euler angles. The Euler angles are specified in XYZ order and in degrees. * @param {number} ex - Angle to rotate around X axis in degrees. * @param {number} ey - Angle to rotate around Y axis in degrees. * @param {number} ez - Angle to rotate around Z axis in degrees. * @returns {pc.Mat4} Self for chaining. * @example * var m = new pc.Mat4(); * m.setFromEulerAngles(45, 90, 180); */ setFromEulerAngles(ex: number, ey: number, ez: number): pc.Mat4; /** * @function * @name pc.Mat4#getEulerAngles * @description Extracts the Euler angles equivalent to the rotational portion * of the specified matrix. The returned Euler angles are in XYZ order an in degrees. * @param {pc.Vec3} [eulers] - A 3-d vector to receive the Euler angles. * @returns {pc.Vec3} A 3-d vector containing the Euler angles. * @example * // Create a 4x4 rotation matrix of 45 degrees around the y-axis * var m = new pc.Mat4().setFromAxisAngle(pc.Vec3.UP, 45); * * var eulers = m.getEulerAngles(); */ getEulerAngles(eulers?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Mat4#toString * @description Converts the specified matrix to string form. * @returns {string} The matrix in string form. * @example * var m = new pc.Mat4(); * // Should output '[1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]' * console.log(m.toString()); */ toString(): string; /** * @field * @static * @readonly * @name pc.Mat4.IDENTITY * @type {pc.Mat4} * @description A constant matrix set to the identity. */ static readonly IDENTITY: pc.Mat4; /** * @field * @static * @readonly * @name pc.Mat4.ZERO * @type {pc.Mat4} * @description A constant matrix with all elements set to 0. */ static readonly ZERO: pc.Mat4; /** * Matrix elements in the form of a flat array. */ data: Float32Array; } /** * @name pc.math * @namespace * @description Math API. */ namespace math { /** * @constant * @type {number} * @name pc.math.DEG_TO_RAD * @description Conversion factor between degrees and radians. * @example * // Convert 180 degrees to pi radians * var rad = 180 * pc.math.DEG_TO_RAD; */ const DEG_TO_RAD: number; /** * @constant * @type {number} * @name pc.math.RAD_TO_DEG * @description Conversion factor between degrees and radians. * @example * // Convert pi radians to 180 degrees * var deg = Math.PI * pc.math.RAD_TO_DEG; */ const RAD_TO_DEG: number; /** * @function * @name pc.math.clamp * @description Clamp a number between min and max inclusive. * @param {number} value - Number to clamp. * @param {number} min - Min value. * @param {number} max - Max value. * @returns {number} The clamped value. */ function clamp(value: number, min: number, max: number): number; /** * @function * @name pc.math.intToBytes24 * @description Convert an 24 bit integer into an array of 3 bytes. * @param {number} i - Number holding an integer value. * @returns {number[]} An array of 3 bytes. * @example * // Set bytes to [0x11, 0x22, 0x33] * var bytes = pc.math.intToBytes24(0x112233); */ function intToBytes24(i: number): number[]; /** * @function * @name pc.math.intToBytes32 * @description Convert an 32 bit integer into an array of 4 bytes. * @returns {number[]} An array of 4 bytes. * @param {number} i - Number holding an integer value. * @example * // Set bytes to [0x11, 0x22, 0x33, 0x44] * var bytes = pc.math.intToBytes32(0x11223344); */ function intToBytes32(i: number): number[]; /** * @function * @name pc.math.bytesToInt24 * @description Convert 3 8 bit Numbers into a single unsigned 24 bit Number. * @example * // Set result1 to 0x112233 from an array of 3 values * var result1 = pc.math.bytesToInt24([0x11, 0x22, 0x33]); * * // Set result2 to 0x112233 from 3 discrete values * var result2 = pc.math.bytesToInt24(0x11, 0x22, 0x33); * @param {number} r - A single byte (0-255). * @param {number} g - A single byte (0-255). * @param {number} b - A single byte (0-255). * @returns {number} A single unsigned 24 bit Number. */ function bytesToInt24(r: number, g: number, b: number): number; /** * @function * @name pc.math.bytesToInt32 * @description Convert 4 1-byte Numbers into a single unsigned 32bit Number. * @returns {number} A single unsigned 32bit Number. * @example * // Set result1 to 0x11223344 from an array of 4 values * var result1 = pc.math.bytesToInt32([0x11, 0x22, 0x33, 0x44]); * * // Set result2 to 0x11223344 from 4 discrete values * var result2 = pc.math.bytesToInt32(0x11, 0x22, 0x33, 0x44); * @param {number} r - A single byte (0-255). * @param {number} g - A single byte (0-255). * @param {number} b - A single byte (0-255). * @param {number} a - A single byte (0-255). */ function bytesToInt32(r: number, g: number, b: number, a: number): number; /** * @function * @name pc.math.lerp * @returns {number} The linear interpolation of two numbers. * @description Calculates the linear interpolation of two numbers. * @param {number} a - Number to linearly interpolate from. * @param {number} b - Number to linearly interpolate to. * @param {number} alpha - The value controlling the result of interpolation. When alpha is 0, * a is returned. When alpha is 1, b is returned. Between 0 and 1, a linear interpolation between * a and b is returned. alpha is clamped between 0 and 1. */ function lerp(a: number, b: number, alpha: number): number; /** * @function * @name pc.math.lerpAngle * @description Calculates the linear interpolation of two angles ensuring that interpolation * is correctly performed across the 360 to 0 degree boundary. Angles are supplied in degrees. * @returns {number} The linear interpolation of two angles. * @param {number} a - Angle (in degrees) to linearly interpolate from. * @param {number} b - Angle (in degrees) to linearly interpolate to. * @param {number} alpha - The value controlling the result of interpolation. When alpha is 0, * a is returned. When alpha is 1, b is returned. Between 0 and 1, a linear interpolation between * a and b is returned. alpha is clamped between 0 and 1. */ function lerpAngle(a: number, b: number, alpha: number): number; /** * @function * @name pc.math.powerOfTwo * @description Returns true if argument is a power-of-two and false otherwise. * @param {number} x - Number to check for power-of-two property. * @returns {boolean} True if power-of-two and false otherwise. */ function powerOfTwo(x: number): boolean; /** * @function * @name pc.math.nextPowerOfTwo * @description Returns the next power of 2 for the specified value. * @param {number} val - The value for which to calculate the next power of 2. * @returns {number} The next power of 2. */ function nextPowerOfTwo(val: number): number; /** * @function * @name pc.math.random * @description Return a pseudo-random number between min and max. * The number generated is in the range [min, max), that is inclusive of the minimum but exclusive of the maximum. * @param {number} min - Lower bound for range. * @param {number} max - Upper bound for range. * @returns {number} Pseudo-random number between the supplied range. */ function random(min: number, max: number): number; /** * @function * @name pc.math.smoothstep * @description The function interpolates smoothly between two input values based on * a third one that should be between the first two. The returned value is clamped * between 0 and 1. *
The slope (i.e. derivative) of the smoothstep function starts at 0 and ends at 0. * This makes it easy to create a sequence of transitions using smoothstep to interpolate * each segment rather than using a more sophisticated or expensive interpolation technique. *
See http://en.wikipedia.org/wiki/Smoothstep for more details. * @param {number} min - The lower bound of the interpolation range. * @param {number} max - The upper bound of the interpolation range. * @param {number} x - The value to interpolate. * @returns {number} The smoothly interpolated value clamped between zero and one. */ function smoothstep(min: number, max: number, x: number): number; /** * @function * @name pc.math.smootherstep * @description An improved version of the pc.math.smoothstep function which has zero * 1st and 2nd order derivatives at t=0 and t=1. *
See http://en.wikipedia.org/wiki/Smoothstep for more details. * @param {number} min - The lower bound of the interpolation range. * @param {number} max - The upper bound of the interpolation range. * @param {number} x - The value to interpolate. * @returns {number} The smoothly interpolated value clamped between zero and one. */ function smootherstep(min: number, max: number, x: number): number; } /** * @class * @name pc.Quat * @classdesc A quaternion. * @description Create a new Quat object. * @param {number|number[]} [x] - The quaternion's x component. Default value 0. If x is an array of length 4, the array will be used to populate all components. * @param {number} [y] - The quaternion's y component. Default value 0. * @param {number} [z] - The quaternion's z component. Default value 0. * @param {number} [w] - The quaternion's w component. Default value 1. */ class Quat { constructor(x?: number | number[], y?: number, z?: number, w?: number); /** * @field * @name pc.Quat#x * @type {number} * @description The x component of the quaternion. * @example * var quat = new pc.Quat(); * * // Get x * var x = quat.x; * * // Set x * quat.x = 0; */ x: number; /** * @field * @name pc.Quat#y * @type {number} * @description The y component of the quaternion. * @example * var quat = new pc.Quat(); * * // Get y * var y = quat.y; * * // Set y * quat.y = 0; */ y: number; /** * @field * @name pc.Quat#z * @type {number} * @description The z component of the quaternion. * @example * var quat = new pc.Quat(); * * // Get z * var z = quat.z; * * // Set z * quat.z = 0; */ z: number; /** * @field * @name pc.Quat#w * @type {number} * @description The w component of the quaternion. * @example * var quat = new pc.Quat(); * * // Get w * var w = quat.w; * * // Set w * quat.w = 0; */ w: number; /** * @function * @name pc.Quat#clone * @description Returns an identical copy of the specified quaternion. * @returns {pc.Quat} A quaternion containing the result of the cloning. * @example * var q = new pc.Quat(-0.11, -0.15, -0.46, 0.87); * var qclone = q.clone(); * * console.log("The result of the cloning is: " + q.toString()); */ clone(): pc.Quat; /** * @function * @name pc.Quat#copy * @description Copies the contents of a source quaternion to a destination quaternion. * @param {pc.Quat} rhs - The quaternion to be copied. * @returns {pc.Quat} Self for chaining. * @example * var src = new pc.Quat(); * var dst = new pc.Quat(); * dst.copy(src, src); * console.log("The two quaternions are " + (src.equals(dst) ? "equal" : "different")); */ copy(rhs: pc.Quat): pc.Quat; /** * @function * @name pc.Quat#equals * @description Reports whether two quaternions are equal. * @param {pc.Quat} rhs - The quaternion to be compared against. * @returns {boolean} True if the quaternions are equal and false otherwise. * @example * var a = new pc.Quat(); * var b = new pc.Quat(); * console.log("The two quaternions are " + (a.equals(b) ? "equal" : "different")); */ equals(rhs: pc.Quat): boolean; /** * @function * @name pc.Quat#getAxisAngle * @description Gets the rotation axis and angle for a given * quaternion. If a quaternion is created with * setFromAxisAngle, this method will return the same * values as provided in the original parameter list * OR functionally equivalent values. * @param {pc.Vec3} axis - The 3-dimensional vector to receive the axis of rotation. * @returns {number} Angle, in degrees, of the rotation. * @example * var q = new pc.Quat(); * q.setFromAxisAngle(new pc.Vec3(0, 1, 0), 90); * var v = new pc.Vec3(); * var angle = q.getAxisAngle(v); * // Should output 90 * console.log(angle); * // Should output [0, 1, 0] * console.log(v.toString()); */ getAxisAngle(axis: pc.Vec3): number; /** * @function * @name pc.Quat#getEulerAngles * @description Converts the supplied quaternion to Euler angles. * @param {pc.Vec3} [eulers] - The 3-dimensional vector to receive the Euler angles. * @returns {pc.Vec3} The 3-dimensional vector holding the Euler angles that * correspond to the supplied quaternion. */ getEulerAngles(eulers?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Quat#invert * @description Generates the inverse of the specified quaternion. * @returns {pc.Quat} Self for chaining. * @example * // Create a quaternion rotated 180 degrees around the y-axis * var rot = new pc.Quat().setFromEulerAngles(0, 180, 0); * * // Invert in place * rot.invert(); */ invert(): pc.Quat; /** * @function * @name pc.Quat#length * @description Returns the magnitude of the specified quaternion. * @returns {number} The magnitude of the specified quaternion. * @example * var q = new pc.Quat(0, 0, 0, 5); * var len = q.length(); * // Should output 5 * console.log("The length of the quaternion is: " + len); */ length(): number; /** * @function * @name pc.Quat#lengthSq * @description Returns the magnitude squared of the specified quaternion. * @returns {number} The magnitude of the specified quaternion. * @example * var q = new pc.Quat(3, 4, 0); * var lenSq = q.lengthSq(); * // Should output 25 * console.log("The length squared of the quaternion is: " + lenSq); */ lengthSq(): number; /** * @function * @name pc.Quat#mul * @description Returns the result of multiplying the specified quaternions together. * @param {pc.Quat} rhs - The quaternion used as the second multiplicand of the operation. * @returns {pc.Quat} Self for chaining. * @example * var a = new pc.Quat().setFromEulerAngles(0, 30, 0); * var b = new pc.Quat().setFromEulerAngles(0, 60, 0); * * // a becomes a 90 degree rotation around the Y axis * // In other words, a = a * b * a.mul(b); * * console.log("The result of the multiplication is: " + a.toString()); */ mul(rhs: pc.Quat): pc.Quat; /** * @function * @name pc.Quat#mul2 * @description Returns the result of multiplying the specified quaternions together. * @param {pc.Quat} lhs - The quaternion used as the first multiplicand of the operation. * @param {pc.Quat} rhs - The quaternion used as the second multiplicand of the operation. * @returns {pc.Quat} Self for chaining. * @example * var a = new pc.Quat().setFromEulerAngles(0, 30, 0); * var b = new pc.Quat().setFromEulerAngles(0, 60, 0); * var r = new pc.Quat(); * * // r is set to a 90 degree rotation around the Y axis * // In other words, r = a * b * r.mul2(a, b); * * console.log("The result of the multiplication is: " + r.toString()); */ mul2(lhs: pc.Quat, rhs: pc.Quat): pc.Quat; /** * @function * @name pc.Quat#normalize * @description Returns the specified quaternion converted in place to a unit quaternion. * @returns {pc.Quat} The result of the normalization. * @example * var v = new pc.Quat(0, 0, 0, 5); * * v.normalize(); * * // Should output 0, 0, 0, 1 * console.log("The result of the vector normalization is: " + v.toString()); */ normalize(): pc.Quat; /** * @function * @name pc.Quat#set * @description Sets the specified quaternion to the supplied numerical values. * @param {number} x - The x component of the quaternion. * @param {number} y - The y component of the quaternion. * @param {number} z - The z component of the quaternion. * @param {number} w - The w component of the quaternion. * @returns {pc.Quat} Self for chaining. * @example * var q = new pc.Quat(); * q.set(1, 0, 0, 0); * * // Should output 1, 0, 0, 0 * console.log("The result of the vector set is: " + q.toString()); */ set(x: number, y: number, z: number, w: number): pc.Quat; /** * @function * @name pc.Quat#setFromAxisAngle * @description Sets a quaternion from an angular rotation around an axis. * @param {pc.Vec3} axis - World space axis around which to rotate. * @param {number} angle - Angle to rotate around the given axis in degrees. * @returns {pc.Quat} Self for chaining. * @example * var q = new pc.Quat(); * q.setFromAxisAngle(pc.Vec3.UP, 90); */ setFromAxisAngle(axis: pc.Vec3, angle: number): pc.Quat; /** * @function * @name pc.Quat#setFromEulerAngles * @description Sets a quaternion from Euler angles specified in XYZ order. * @param {number} ex - Angle to rotate around X axis in degrees. * @param {number} ey - Angle to rotate around Y axis in degrees. * @param {number} ez - Angle to rotate around Z axis in degrees. * @returns {pc.Quat} Self for chaining. * @example * var q = new pc.Quat(); * q.setFromEulerAngles(45, 90, 180); */ setFromEulerAngles(ex: number, ey: number, ez: number): pc.Quat; /** * @function * @name pc.Quat#setFromMat4 * @description Converts the specified 4x4 matrix to a quaternion. Note that since * a quaternion is purely a representation for orientation, only the translational part * of the matrix is lost. * @param {pc.Mat4} m - The 4x4 matrix to convert. * @returns {pc.Quat} Self for chaining. * @example * // Create a 4x4 rotation matrix of 180 degrees around the y-axis * var rot = new pc.Mat4().setFromAxisAngle(pc.Vec3.UP, 180); * * // Convert to a quaternion * var q = new pc.Quat().setFromMat4(rot); */ setFromMat4(m: pc.Mat4): pc.Quat; /** * @function * @name pc.Quat#slerp * @description Performs a spherical interpolation between two quaternions. The result of * the interpolation is written to the quaternion calling the function. * @param {pc.Quat} lhs - The quaternion to interpolate from. * @param {pc.Quat} rhs - The quaternion to interpolate to. * @param {number} alpha - The value controlling the interpolation in relation to the two input * quaternions. The value is in the range 0 to 1, 0 generating q1, 1 generating q2 and anything * in between generating a spherical interpolation between the two. * @returns {pc.Quat} Self for chaining. * @example * var q1 = new pc.Quat(-0.11, -0.15, -0.46, 0.87); * var q2 = new pc.Quat(-0.21, -0.21, -0.67, 0.68); * * var result; * result = new pc.Quat().slerp(q1, q2, 0); // Return q1 * result = new pc.Quat().slerp(q1, q2, 0.5); // Return the midpoint interpolant * result = new pc.Quat().slerp(q1, q2, 1); // Return q2 */ slerp(lhs: pc.Quat, rhs: pc.Quat, alpha: number): pc.Quat; /** * @function * @name pc.Quat#transformVector * @description Transforms a 3-dimensional vector by the specified quaternion. * @param {pc.Vec3} vec - The 3-dimensional vector to be transformed. * @param {pc.Vec3} [res] - An optional 3-dimensional vector to receive the result of the transformation. * @returns {pc.Vec3} The input vector v transformed by the current instance. * @example * // Create a 3-dimensional vector * var v = new pc.Vec3(1, 2, 3); * * // Create a 4x4 rotation matrix * var q = new pc.Quat().setFromEulerAngles(10, 20, 30); * * var tv = q.transformVector(v); */ transformVector(vec: pc.Vec3, res?: pc.Vec3): pc.Vec3; /** * @function * @name pc.Quat#toString * @description Converts the quaternion to string form. * @returns {string} The quaternion in string form. * @example * var v = new pc.Quat(0, 0, 0, 1); * // Should output '[0, 0, 0, 1]' * console.log(v.toString()); */ toString(): string; /** * @field * @static * @readonly * @name pc.Quat.IDENTITY * @type {pc.Quat} * @description A constant quaternion set to [0, 0, 0, 1] (the identity). */ static readonly IDENTITY: pc.Quat; /** * @field * @static * @readonly * @name pc.Quat.ZERO * @type {pc.Quat} * @description A constant quaternion set to [0, 0, 0, 0]. */ static readonly ZERO: pc.Quat; } /** * @class * @name pc.Vec2 * @classdesc A 2-dimensional vector. * @description Creates a new Vec2 object. * @param {number|number[]} [x] - The x value. If x is an array of length 2, the array will be used to populate all components. * @param {number} [y] - The y value. * @example * var v = new pc.Vec2(1, 2); */ class Vec2 { constructor(x?: number | number[], y?: number); /** * @function * @name pc.Vec2#add * @description Adds a 2-dimensional vector to another in place. * @param {pc.Vec2} rhs - The vector to add to the specified vector. * @returns {pc.Vec2} Self for chaining. * @example * var a = new pc.Vec2(10, 10); * var b = new pc.Vec2(20, 20); * * a.add(b); * * // Should output [30, 30] * console.log("The result of the addition is: " + a.toString()); */ add(rhs: pc.Vec2): pc.Vec2; /** * @function * @name pc.Vec2#add2 * @description Adds two 2-dimensional vectors together and returns the result. * @param {pc.Vec2} lhs - The first vector operand for the addition. * @param {pc.Vec2} rhs - The second vector operand for the addition. * @returns {pc.Vec2} Self for chaining. * @example * var a = new pc.Vec2(10, 10); * var b = new pc.Vec2(20, 20); * var r = new pc.Vec2(); * * r.add2(a, b); * // Should output [30, 30] * * console.log("The result of the addition is: " + r.toString()); */ add2(lhs: pc.Vec2, rhs: pc.Vec2): pc.Vec2; /** * @function * @name pc.Vec2#clone * @description Returns an identical copy of the specified 2-dimensional vector. * @returns {pc.Vec2} A 2-dimensional vector containing the result of the cloning. * @example * var v = new pc.Vec2(10, 20); * var vclone = v.clone(); * console.log("The result of the cloning is: " + vclone.toString()); */ clone(): pc.Vec2; /** * @function * @name pc.Vec2#copy * @description Copied the contents of a source 2-dimensional vector to a destination 2-dimensional vector. * @param {pc.Vec2} rhs - A vector to copy to the specified vector. * @returns {pc.Vec2} Self for chaining. * @example * var src = new pc.Vec2(10, 20); * var dst = new pc.Vec2(); * * dst.copy(src); * * console.log("The two vectors are " + (dst.equals(src) ? "equal" : "different")); */ copy(rhs: pc.Vec2): pc.Vec2; /** * @function * @name pc.Vec2#distance * @description Returns the distance between the two specified 2-dimensional vectors. * @param {pc.Vec2} rhs - The second 2-dimensional vector to test. * @returns {number} The distance between the two vectors. * @example * var v1 = new pc.Vec2(5, 10); * var v2 = new pc.Vec2(10, 20); * var d = v1.distance(v2); * console.log("The between v1 and v2 is: " + d); */ distance(rhs: pc.Vec2): number; /** * @function * @name pc.Vec2#dot * @description Returns the result of a dot product operation performed on the two specified 2-dimensional vectors. * @param {pc.Vec2} rhs - The second 2-dimensional vector operand of the dot product. * @returns {number} The result of the dot product operation. * @example * var v1 = new pc.Vec2(5, 10); * var v2 = new pc.Vec2(10, 20); * var v1dotv2 = v1.dot(v2); * console.log("The result of the dot product is: " + v1dotv2); */ dot(rhs: pc.Vec2): number; /** * @function * @name pc.Vec2#equals * @description Reports whether two vectors are equal. * @param {pc.Vec2} rhs - The vector to compare to the specified vector. * @returns {boolean} True if the vectors are equal and false otherwise. * @example * var a = new pc.Vec2(1, 2); * var b = new pc.Vec2(4, 5); * console.log("The two vectors are " + (a.equals(b) ? "equal" : "different")); */ equals(rhs: pc.Vec2): boolean; /** * @function * @name pc.Vec2#length * @description Returns the magnitude of the specified 2-dimensional vector. * @returns {number} The magnitude of the specified 2-dimensional vector. * @example * var vec = new pc.Vec2(3, 4); * var len = vec.length(); * // Should output 5 * console.log("The length of the vector is: " + len); */ length(): number; /** * @function * @name pc.Vec2#lengthSq * @description Returns the magnitude squared of the specified 2-dimensional vector. * @returns {number} The magnitude of the specified 2-dimensional vector. * @example * var vec = new pc.Vec2(3, 4); * var len = vec.lengthSq(); * // Should output 25 * console.log("The length squared of the vector is: " + len); */ lengthSq(): number; /** * @function * @name pc.Vec2#lerp * @description Returns the result of a linear interpolation between two specified 2-dimensional vectors. * @param {pc.Vec2} lhs - The 2-dimensional to interpolate from. * @param {pc.Vec2} rhs - The 2-dimensional to interpolate to. * @param {number} alpha - The value controlling the point of interpolation. Between 0 and 1, the linear interpolant * will occur on a straight line between lhs and rhs. Outside of this range, the linear interpolant will occur on * a ray extrapolated from this line. * @returns {pc.Vec2} Self for chaining. * @example * var a = new pc.Vec2(0, 0); * var b = new pc.Vec2(10, 10); * var r = new pc.Vec2(); * * r.lerp(a, b, 0); // r is equal to a * r.lerp(a, b, 0.5); // r is 5, 5 * r.lerp(a, b, 1); // r is equal to b */ lerp(lhs: pc.Vec2, rhs: pc.Vec2, alpha: number): pc.Vec2; /** * @function * @name pc.Vec2#mul * @description Multiplies a 2-dimensional vector to another in place. * @param {pc.Vec2} rhs - The 2-dimensional vector used as the second multiplicand of the operation. * @returns {pc.Vec2} Self for chaining. * @example * var a = new pc.Vec2(2, 3); * var b = new pc.Vec2(4, 5); * * a.mul(b); * * // Should output 8, 15 * console.log("The result of the multiplication is: " + a.toString()); */ mul(rhs: pc.Vec2): pc.Vec2; /** * @function * @name pc.Vec2#mul2 * @description Returns the result of multiplying the specified 2-dimensional vectors together. * @param {pc.Vec2} lhs - The 2-dimensional vector used as the first multiplicand of the operation. * @param {pc.Vec2} rhs - The 2-dimensional vector used as the second multiplicand of the operation. * @returns {pc.Vec2} Self for chaining. * @example * var a = new pc.Vec2(2, 3); * var b = new pc.Vec2(4, 5); * var r = new pc.Vec2(); * * r.mul2(a, b); * * // Should output 8, 15 * console.log("The result of the multiplication is: " + r.toString()); */ mul2(lhs: pc.Vec2, rhs: pc.Vec2): pc.Vec2; /** * @function * @name pc.Vec2#normalize * @description Returns this 2-dimensional vector converted to a unit vector in place. * If the vector has a length of zero, the vector's elements will be set to zero. * @returns {pc.Vec2} Self for chaining. * @example * var v = new pc.Vec2(25, 0); * * v.normalize(); * * // Should output 1, 0 * console.log("The result of the vector normalization is: " + v.toString()); */ normalize(): pc.Vec2; /** * @function * @name pc.Vec2#scale * @description Scales each component of the specified 2-dimensional vector by the supplied * scalar value. * @param {number} scalar - The value by which each vector component is multiplied. * @returns {pc.Vec2} Self for chaining. * @example * var v = new pc.Vec2(2, 4); * * // Multiply by 2 * v.scale(2); * * // Negate * v.scale(-1); * * // Divide by 2 * v.scale(0.5); */ scale(scalar: number): pc.Vec2; /** * @function * @name pc.Vec2#set * @description Sets the specified 2-dimensional vector to the supplied numerical values. * @param {number} x - The value to set on the first component of the vector. * @param {number} y - The value to set on the second component of the vector. * @returns {pc.Vec2} Self for chaining. * @example * var v = new pc.Vec2(); * v.set(5, 10); * * // Should output 5, 10 * console.log("The result of the vector set is: " + v.toString()); */ set(x: number, y: number): pc.Vec2; /** * @function * @name pc.Vec2#sub * @description Subtracts a 2-dimensional vector from another in place. * @param {pc.Vec2} rhs - The vector to add to the specified vector. * @returns {pc.Vec2} Self for chaining. * @example * var a = new pc.Vec2(10, 10); * var b = new pc.Vec2(20, 20); * * a.sub(b); * * // Should output [-10, -10] * console.log("The result of the addition is: " + a.toString()); */ sub(rhs: pc.Vec2): pc.Vec2; /** * @function * @name pc.Vec2#sub2 * @description Subtracts two 2-dimensional vectors from one another and returns the result. * @param {pc.Vec2} lhs - The first vector operand for the addition. * @param {pc.Vec2} rhs - The second vector operand for the addition. * @returns {pc.Vec2} Self for chaining. * @example * var a = new pc.Vec2(10, 10); * var b = new pc.Vec2(20, 20); * var r = new pc.Vec2(); * * r.sub2(a, b); * * // Should output [-10, -10] * console.log("The result of the addition is: " + r.toString()); */ sub2(lhs: pc.Vec2, rhs: pc.Vec2): pc.Vec2; /** * @function * @name pc.Vec2#toString * @description Converts the vector to string form. * @returns {string} The vector in string form. * @example * var v = new pc.Vec2(20, 10); * // Should output '[20, 10]' * console.log(v.toString()); */ toString(): string; /** * @field * @name pc.Vec2#x * @type {number} * @description The first element of the vector. * @example * var vec = new pc.Vec2(10, 20); * * // Get x * var x = vec.x; * * // Set x * vec.x = 0; */ x: number; /** * @field * @name pc.Vec2#y * @type {number} * @description The second element of the vector. * @example * var vec = new pc.Vec2(10, 20); * * // Get y * var y = vec.y; * * // Set y * vec.y = 0; */ y: number; /** * @field * @static * @readonly * @name pc.Vec2.ONE * @type {pc.Vec2} * @description A constant vector set to [1, 1]. */ static readonly ONE: pc.Vec2; /** * @field * @static * @readonly * @name pc.Vec2.RIGHT * @type {pc.Vec2} * @description A constant vector set to [1, 0]. */ static readonly RIGHT: pc.Vec2; /** * @field * @static * @readonly * @name pc.Vec2.LEFT * @type {pc.Vec2} * @description A constant vector set to [-1, 0]. */ static readonly LEFT: pc.Vec2; /** * @field * @static * @readonly * @name pc.Vec2.UP * @type {pc.Vec2} * @description A constant vector set to [0, 1]. */ static readonly UP: pc.Vec2; /** * @field * @static * @readonly * @name pc.Vec2.DOWN * @type {pc.Vec2} * @description A constant vector set to [0, -1]. */ static readonly DOWN: pc.Vec2; /** * @field * @static * @readonly * @name pc.Vec2.ZERO * @type {pc.Vec2} * @description A constant vector set to [0, 0]. */ static readonly ZERO: pc.Vec2; } /** * @class * @name pc.Vec3 * @classdesc A 3-dimensional vector. * @description Creates a new Vec3 object. * @param {number|number[]} [x] - The x value. If x is an array of length 3, the array will be used to populate all components. * @param {number} [y] - The y value. * @param {number} [z] - The z value. * @example * var v = new pc.Vec3(1, 2, 3); */ class Vec3 { constructor(x?: number | number[], y?: number, z?: number); /** * @function * @name pc.Vec3#add * @description Adds a 3-dimensional vector to another in place. * @param {pc.Vec3} rhs - The vector to add to the specified vector. * @returns {pc.Vec3} Self for chaining. * @example * var a = new pc.Vec3(10, 10, 10); * var b = new pc.Vec3(20, 20, 20); * * a.add(b); * * // Should output [30, 30, 30] * console.log("The result of the addition is: " + a.toString()); */ add(rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#add2 * @description Adds two 3-dimensional vectors together and returns the result. * @param {pc.Vec3} lhs - The first vector operand for the addition. * @param {pc.Vec3} rhs - The second vector operand for the addition. * @returns {pc.Vec3} Self for chaining. * @example * var a = new pc.Vec3(10, 10, 10); * var b = new pc.Vec3(20, 20, 20); * var r = new pc.Vec3(); * * r.add2(a, b); * // Should output [30, 30, 30] * * console.log("The result of the addition is: " + r.toString()); */ add2(lhs: pc.Vec3, rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#clone * @description Returns an identical copy of the specified 3-dimensional vector. * @returns {pc.Vec3} A 3-dimensional vector containing the result of the cloning. * @example * var v = new pc.Vec3(10, 20, 30); * var vclone = v.clone(); * console.log("The result of the cloning is: " + vclone.toString()); */ clone(): pc.Vec3; /** * @function * @name pc.Vec3#copy * @description Copied the contents of a source 3-dimensional vector to a destination 3-dimensional vector. * @param {pc.Vec3} rhs - A vector to copy to the specified vector. * @returns {pc.Vec3} Self for chaining. * @example * var src = new pc.Vec3(10, 20, 30); * var dst = new pc.Vec3(); * * dst.copy(src); * * console.log("The two vectors are " + (dst.equals(src) ? "equal" : "different")); */ copy(rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#cross * @description Returns the result of a cross product operation performed on the two specified 3-dimensional vectors. * @param {pc.Vec3} lhs - The first 3-dimensional vector operand of the cross product. * @param {pc.Vec3} rhs - The second 3-dimensional vector operand of the cross product. * @returns {pc.Vec3} Self for chaining. * @example * var back = new pc.Vec3().cross(pc.Vec3.RIGHT, pc.Vec3.UP); * * // Should print the Z axis (i.e. [0, 0, 1]) * console.log("The result of the cross product is: " + back.toString()); */ cross(lhs: pc.Vec3, rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#distance * @description Returns the distance between the two specified 3-dimensional vectors. * @param {pc.Vec3} rhs - The second 3-dimensional vector to test. * @returns {number} The distance between the two vectors. * @example * var v1 = new pc.Vec3(5, 10, 20); * var v2 = new pc.Vec3(10, 20, 40); * var d = v1.distance(v2); * console.log("The between v1 and v2 is: " + d); */ distance(rhs: pc.Vec3): number; /** * @function * @name pc.Vec3#dot * @description Returns the result of a dot product operation performed on the two specified 3-dimensional vectors. * @param {pc.Vec3} rhs - The second 3-dimensional vector operand of the dot product. * @returns {number} The result of the dot product operation. * @example * var v1 = new pc.Vec3(5, 10, 20); * var v2 = new pc.Vec3(10, 20, 40); * var v1dotv2 = v1.dot(v2); * console.log("The result of the dot product is: " + v1dotv2); */ dot(rhs: pc.Vec3): number; /** * @function * @name pc.Vec3#equals * @description Reports whether two vectors are equal. * @param {pc.Vec3} rhs - The vector to compare to the specified vector. * @returns {boolean} True if the vectors are equal and false otherwise. * @example * var a = new pc.Vec3(1, 2, 3); * var b = new pc.Vec3(4, 5, 6); * console.log("The two vectors are " + (a.equals(b) ? "equal" : "different")); */ equals(rhs: pc.Vec3): boolean; /** * @function * @name pc.Vec3#length * @description Returns the magnitude of the specified 3-dimensional vector. * @returns {number} The magnitude of the specified 3-dimensional vector. * @example * var vec = new pc.Vec3(3, 4, 0); * var len = vec.length(); * // Should output 5 * console.log("The length of the vector is: " + len); */ length(): number; /** * @function * @name pc.Vec3#lengthSq * @description Returns the magnitude squared of the specified 3-dimensional vector. * @returns {number} The magnitude of the specified 3-dimensional vector. * @example * var vec = new pc.Vec3(3, 4, 0); * var len = vec.lengthSq(); * // Should output 25 * console.log("The length squared of the vector is: " + len); */ lengthSq(): number; /** * @function * @name pc.Vec3#lerp * @description Returns the result of a linear interpolation between two specified 3-dimensional vectors. * @param {pc.Vec3} lhs - The 3-dimensional to interpolate from. * @param {pc.Vec3} rhs - The 3-dimensional to interpolate to. * @param {number} alpha - The value controlling the point of interpolation. Between 0 and 1, the linear interpolant * will occur on a straight line between lhs and rhs. Outside of this range, the linear interpolant will occur on * a ray extrapolated from this line. * @returns {pc.Vec3} Self for chaining. * @example * var a = new pc.Vec3(0, 0, 0); * var b = new pc.Vec3(10, 10, 10); * var r = new pc.Vec3(); * * r.lerp(a, b, 0); // r is equal to a * r.lerp(a, b, 0.5); // r is 5, 5, 5 * r.lerp(a, b, 1); // r is equal to b */ lerp(lhs: pc.Vec3, rhs: pc.Vec3, alpha: number): pc.Vec3; /** * @function * @name pc.Vec3#mul * @description Multiplies a 3-dimensional vector to another in place. * @param {pc.Vec3} rhs - The 3-dimensional vector used as the second multiplicand of the operation. * @returns {pc.Vec3} Self for chaining. * @example * var a = new pc.Vec3(2, 3, 4); * var b = new pc.Vec3(4, 5, 6); * * a.mul(b); * * // Should output 8, 15, 24 * console.log("The result of the multiplication is: " + a.toString()); */ mul(rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#mul2 * @description Returns the result of multiplying the specified 3-dimensional vectors together. * @param {pc.Vec3} lhs - The 3-dimensional vector used as the first multiplicand of the operation. * @param {pc.Vec3} rhs - The 3-dimensional vector used as the second multiplicand of the operation. * @returns {pc.Vec3} Self for chaining. * @example * var a = new pc.Vec3(2, 3, 4); * var b = new pc.Vec3(4, 5, 6); * var r = new pc.Vec3(); * * r.mul2(a, b); * * // Should output 8, 15, 24 * console.log("The result of the multiplication is: " + r.toString()); */ mul2(lhs: pc.Vec3, rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#normalize * @description Returns this 3-dimensional vector converted to a unit vector in place. * If the vector has a length of zero, the vector's elements will be set to zero. * @returns {pc.Vec3} Self for chaining. * @example * var v = new pc.Vec3(25, 0, 0); * * v.normalize(); * * // Should output 1, 0, 0 * console.log("The result of the vector normalization is: " + v.toString()); */ normalize(): pc.Vec3; /** * @function * @name pc.Vec3#project * @description Projects this 3-dimensional vector onto the specified vector. * @param {pc.Vec3} rhs - The vector onto which the original vector will be projected on. * @returns {pc.Vec3} Self for chaining. * @example * var v = new pc.Vec3(5, 5, 5); * var normal = new pc.Vec3(1, 0, 0); * * v.project(normal); * * // Should output 5, 0, 0 * console.log("The result of the vector projection is: " + v.toString()); */ project(rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#scale * @description Scales each dimension of the specified 3-dimensional vector by the supplied * scalar value. * @param {number} scalar - The value by which each vector component is multiplied. * @returns {pc.Vec3} Self for chaining. * @example * var v = new pc.Vec3(2, 4, 8); * * // Multiply by 2 * v.scale(2); * * // Negate * v.scale(-1); * * // Divide by 2 * v.scale(0.5); */ scale(scalar: number): pc.Vec3; /** * @function * @name pc.Vec3#set * @description Sets the specified 3-dimensional vector to the supplied numerical values. * @param {number} x - The value to set on the first component of the vector. * @param {number} y - The value to set on the second component of the vector. * @param {number} z - The value to set on the third component of the vector. * @returns {pc.Vec3} Self for chaining. * @example * var v = new pc.Vec3(); * v.set(5, 10, 20); * * // Should output 5, 10, 20 * console.log("The result of the vector set is: " + v.toString()); */ set(x: number, y: number, z: number): pc.Vec3; /** * @function * @name pc.Vec3#sub * @description Subtracts a 3-dimensional vector from another in place. * @param {pc.Vec3} rhs - The vector to add to the specified vector. * @returns {pc.Vec3} Self for chaining. * @example * var a = new pc.Vec3(10, 10, 10); * var b = new pc.Vec3(20, 20, 20); * * a.sub(b); * * // Should output [-10, -10, -10] * console.log("The result of the addition is: " + a.toString()); */ sub(rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#sub2 * @description Subtracts two 3-dimensional vectors from one another and returns the result. * @param {pc.Vec3} lhs - The first vector operand for the addition. * @param {pc.Vec3} rhs - The second vector operand for the addition. * @returns {pc.Vec3} Self for chaining. * @example * var a = new pc.Vec3(10, 10, 10); * var b = new pc.Vec3(20, 20, 20); * var r = new pc.Vec3(); * * r.sub2(a, b); * * // Should output [-10, -10, -10] * console.log("The result of the addition is: " + r.toString()); */ sub2(lhs: pc.Vec3, rhs: pc.Vec3): pc.Vec3; /** * @function * @name pc.Vec3#toString * @description Converts the vector to string form. * @returns {string} The vector in string form. * @example * var v = new pc.Vec3(20, 10, 5); * // Should output '[20, 10, 5]' * console.log(v.toString()); */ toString(): string; /** * @name pc.Vec3#x * @type {number} * @description The first component of the vector. * @example * var vec = new pc.Vec3(10, 20, 30); * * // Get x * var x = vec.x; * * // Set x * vec.x = 0; */ x: number; /** * @name pc.Vec3#y * @type {number} * @description The second component of the vector. * @example * var vec = new pc.Vec3(10, 20, 30); * * // Get y * var y = vec.y; * * // Set y * vec.y = 0; */ y: number; /** * @name pc.Vec3#z * @type {number} * @description The third component of the vector. * @example * var vec = new pc.Vec3(10, 20, 30); * * // Get z * var z = vec.z; * * // Set z * vec.z = 0; */ z: number; /** * @static * @readonly * @name pc.Vec3.BACK * @type {pc.Vec3} * @description A constant vector set to [0, 0, 1]. */ static readonly BACK: pc.Vec3; /** * @static * @readonly * @name pc.Vec3.DOWN * @type {pc.Vec3} * @description A constant vector set to [0, -1, 0]. */ static readonly DOWN: pc.Vec3; /** * @static * @readonly * @name pc.Vec3.FORWARD * @type {pc.Vec3} * @description A constant vector set to [0, 0, -1]. */ static readonly FORWARD: pc.Vec3; /** * @field * @static * @readonly * @name pc.Vec3.LEFT * @type {pc.Vec3} * @description A constant vector set to [-1, 0, 0]. */ static readonly LEFT: pc.Vec3; /** * @field * @static * @readonly * @name pc.Vec3.ONE * @type {pc.Vec3} * @description A constant vector set to [1, 1, 1]. */ static readonly ONE: pc.Vec3; /** * @field * @static * @readonly * @name pc.Vec3.RIGHT * @type {pc.Vec3} * @description A constant vector set to [1, 0, 0]. */ static readonly RIGHT: pc.Vec3; /** * @field * @static * @readonly * @name pc.Vec3.UP * @type {pc.Vec3} * @description A constant vector set to [0, 1, 0]. */ static readonly UP: pc.Vec3; /** * @field * @static * @readonly * @name pc.Vec3.ZERO * @type {pc.Vec3} * @description A constant vector set to [0, 0, 0]. */ static readonly ZERO: pc.Vec3; } /** * @class * @name pc.Vec4 * @classdesc A 4-dimensional vector. * @description Creates a new Vec4 object. * @param {number|number[]} [x] - The x value. If x is an array of length 4, the array will be used to populate all components. * @param {number} [y] - The y value. * @param {number} [z] - The z value. * @param {number} [w] - The w value. * @example * var v = new pc.Vec4(1, 2, 3, 4); */ class Vec4 { constructor(x?: number | number[], y?: number, z?: number, w?: number); /** * @function * @name pc.Vec4#add * @description Adds a 4-dimensional vector to another in place. * @param {pc.Vec4} rhs - The vector to add to the specified vector. * @returns {pc.Vec4} Self for chaining. * @example * var a = new pc.Vec4(10, 10, 10, 10); * var b = new pc.Vec4(20, 20, 20, 20); * * a.add(b); * * // Should output [30, 30, 30] * console.log("The result of the addition is: " + a.toString()); */ add(rhs: pc.Vec4): pc.Vec4; /** * @function * @name pc.Vec4#add2 * @description Adds two 4-dimensional vectors together and returns the result. * @param {pc.Vec4} lhs - The first vector operand for the addition. * @param {pc.Vec4} rhs - The second vector operand for the addition. * @returns {pc.Vec4} Self for chaining. * @example * var a = new pc.Vec4(10, 10, 10, 10); * var b = new pc.Vec4(20, 20, 20, 20); * var r = new pc.Vec4(); * * r.add2(a, b); * // Should output [30, 30, 30] * * console.log("The result of the addition is: " + r.toString()); */ add2(lhs: pc.Vec4, rhs: pc.Vec4): pc.Vec4; /** * @function * @name pc.Vec4#clone * @description Returns an identical copy of the specified 4-dimensional vector. * @returns {pc.Vec4} A 4-dimensional vector containing the result of the cloning. * @example * var v = new pc.Vec4(10, 20, 30, 40); * var vclone = v.clone(); * console.log("The result of the cloning is: " + vclone.toString()); */ clone(): pc.Vec4; /** * @function * @name pc.Vec4#copy * @description Copied the contents of a source 4-dimensional vector to a destination 4-dimensional vector. * @param {pc.Vec4} rhs - A vector to copy to the specified vector. * @returns {pc.Vec4} Self for chaining. * @example * var src = new pc.Vec4(10, 20, 30, 40); * var dst = new pc.Vec4(); * * dst.copy(src); * * console.log("The two vectors are " + (dst.equals(src) ? "equal" : "different")); */ copy(rhs: pc.Vec4): pc.Vec4; /** * @function * @name pc.Vec4#dot * @description Returns the result of a dot product operation performed on the two specified 4-dimensional vectors. * @param {pc.Vec4} rhs - The second 4-dimensional vector operand of the dot product. * @returns {number} The result of the dot product operation. * @example * var v1 = new pc.Vec4(5, 10, 20, 40); * var v2 = new pc.Vec4(10, 20, 40, 80); * var v1dotv2 = v1.dot(v2); * console.log("The result of the dot product is: " + v1dotv2); */ dot(rhs: pc.Vec4): number; /** * @function * @name pc.Vec4#equals * @description Reports whether two vectors are equal. * @param {pc.Vec4} rhs - The vector to compare to the specified vector. * @returns {boolean} True if the vectors are equal and false otherwise. * @example * var a = new pc.Vec4(1, 2, 3, 4); * var b = new pc.Vec4(5, 6, 7, 8); * console.log("The two vectors are " + (a.equals(b) ? "equal" : "different")); */ equals(rhs: pc.Vec4): boolean; /** * @function * @name pc.Vec4#length * @description Returns the magnitude of the specified 4-dimensional vector. * @returns {number} The magnitude of the specified 4-dimensional vector. * @example * var vec = new pc.Vec4(3, 4, 0, 0); * var len = vec.length(); * // Should output 5 * console.log("The length of the vector is: " + len); */ length(): number; /** * @function * @name pc.Vec4#lengthSq * @description Returns the magnitude squared of the specified 4-dimensional vector. * @returns {number} The magnitude of the specified 4-dimensional vector. * @example * var vec = new pc.Vec4(3, 4, 0); * var len = vec.lengthSq(); * // Should output 25 * console.log("The length squared of the vector is: " + len); */ lengthSq(): number; /** * @function * @name pc.Vec4#lerp * @description Returns the result of a linear interpolation between two specified 4-dimensional vectors. * @param {pc.Vec4} lhs - The 4-dimensional to interpolate from. * @param {pc.Vec4} rhs - The 4-dimensional to interpolate to. * @param {number} alpha - The value controlling the point of interpolation. Between 0 and 1, the linear interpolant * will occur on a straight line between lhs and rhs. Outside of this range, the linear interpolant will occur on * a ray extrapolated from this line. * @returns {pc.Vec4} Self for chaining. * @example * var a = new pc.Vec4(0, 0, 0, 0); * var b = new pc.Vec4(10, 10, 10, 10); * var r = new pc.Vec4(); * * r.lerp(a, b, 0); // r is equal to a * r.lerp(a, b, 0.5); // r is 5, 5, 5, 5 * r.lerp(a, b, 1); // r is equal to b */ lerp(lhs: pc.Vec4, rhs: pc.Vec4, alpha: number): pc.Vec4; /** * @function * @name pc.Vec4#mul * @description Multiplies a 4-dimensional vector to another in place. * @param {pc.Vec4} rhs - The 4-dimensional vector used as the second multiplicand of the operation. * @returns {pc.Vec4} Self for chaining. * @example * var a = new pc.Vec4(2, 3, 4, 5); * var b = new pc.Vec4(4, 5, 6, 7); * * a.mul(b); * * // Should output 8, 15, 24, 35 * console.log("The result of the multiplication is: " + a.toString()); */ mul(rhs: pc.Vec4): pc.Vec4; /** * @function * @name pc.Vec4#mul2 * @description Returns the result of multiplying the specified 4-dimensional vectors together. * @param {pc.Vec4} lhs - The 4-dimensional vector used as the first multiplicand of the operation. * @param {pc.Vec4} rhs - The 4-dimensional vector used as the second multiplicand of the operation. * @returns {pc.Vec4} Self for chaining. * @example * var a = new pc.Vec4(2, 3, 4, 5); * var b = new pc.Vec4(4, 5, 6, 7); * var r = new pc.Vec4(); * * r.mul2(a, b); * * // Should output 8, 15, 24, 35 * console.log("The result of the multiplication is: " + r.toString()); */ mul2(lhs: pc.Vec4, rhs: pc.Vec4): pc.Vec4; /** * @function * @name pc.Vec4#normalize * @description Returns this 4-dimensional vector converted to a unit vector in place. * If the vector has a length of zero, the vector's elements will be set to zero. * @returns {pc.Vec4} Self for chaining. * @example * var v = new pc.Vec4(25, 0, 0, 0); * * v.normalize(); * * // Should output 1, 0, 0, 0 * console.log("The result of the vector normalization is: " + v.toString()); */ normalize(): pc.Vec4; /** * @function * @name pc.Vec4#scale * @description Scales each dimension of the specified 4-dimensional vector by the supplied * scalar value. * @param {number} scalar - The value by which each vector component is multiplied. * @returns {pc.Vec4} Self for chaining. * @example * var v = new pc.Vec4(2, 4, 8, 16); * * // Multiply by 2 * v.scale(2); * * // Negate * v.scale(-1); * * // Divide by 2 * v.scale(0.5); */ scale(scalar: number): pc.Vec4; /** * @function * @name pc.Vec4#set * @description Sets the specified 4-dimensional vector to the supplied numerical values. * @param {number} x - The value to set on the first component of the vector. * @param {number} y - The value to set on the second component of the vector. * @param {number} z - The value to set on the third component of the vector. * @param {number} w - The value to set on the fourth component of the vector. * @returns {pc.Vec4} Self for chaining. * @example * var v = new pc.Vec4(); * v.set(5, 10, 20, 40); * * // Should output 5, 10, 20, 40 * console.log("The result of the vector set is: " + v.toString()); */ set(x: number, y: number, z: number, w: number): pc.Vec4; /** * @function * @name pc.Vec4#sub * @description Subtracts a 4-dimensional vector from another in place. * @param {pc.Vec4} rhs - The vector to add to the specified vector. * @returns {pc.Vec4} Self for chaining. * @example * var a = new pc.Vec4(10, 10, 10, 10); * var b = new pc.Vec4(20, 20, 20, 20); * * a.sub(b); * * // Should output [-10, -10, -10, -10] * console.log("The result of the subtraction is: " + a.toString()); */ sub(rhs: pc.Vec4): pc.Vec4; /** * @function * @name pc.Vec4#sub2 * @description Subtracts two 4-dimensional vectors from one another and returns the result. * @param {pc.Vec4} lhs - The first vector operand for the subtraction. * @param {pc.Vec4} rhs - The second vector operand for the subtraction. * @returns {pc.Vec4} Self for chaining. * @example * var a = new pc.Vec4(10, 10, 10, 10); * var b = new pc.Vec4(20, 20, 20, 20); * var r = new pc.Vec4(); * * r.sub2(a, b); * * // Should output [-10, -10, -10, -10] * console.log("The result of the subtraction is: " + r.toString()); */ sub2(lhs: pc.Vec4, rhs: pc.Vec4): pc.Vec4; /** * @function * @name pc.Vec4#toString * @description Converts the vector to string form. * @returns {string} The vector in string form. * @example * var v = new pc.Vec4(20, 10, 5, 0); * // Should output '[20, 10, 5, 0]' * console.log(v.toString()); */ toString(): string; /** * @field * @name pc.Vec4#x * @type {number} * @description The first component of the vector. * @example * var vec = new pc.Vec4(10, 20, 30, 40); * * // Get x * var x = vec.x; * * // Set x * vec.x = 0; */ x: number; /** * @field * @name pc.Vec4#y * @type {number} * @description The second component of the vector. * @example * var vec = new pc.Vec4(10, 20, 30, 40); * * // Get y * var y = vec.y; * * // Set y * vec.y = 0; */ y: number; /** * @field * @name pc.Vec4#z * @type {number} * @description The third component of the vector. * @example * var vec = new pc.Vec4(10, 20, 30, 40); * * // Get z * var z = vec.z; * * // Set z * vec.z = 0; */ z: number; /** * @field * @name pc.Vec4#w * @type {number} * @description The fourth component of the vector. * @example * var vec = new pc.Vec4(10, 20, 30, 40); * * // Get w * var w = vec.w; * * // Set w * vec.w = 0; */ w: number; /** * @field * @static * @readonly * @name pc.Vec4.ONE * @type {pc.Vec4} * @description A constant vector set to [1, 1, 1, 1]. */ static readonly ONE: pc.Vec4; /** * @field * @static * @readonly * @name pc.Vec4.ZERO * @type {pc.Vec4} * @description A constant vector set to [0, 0, 0, 0]. */ static readonly ZERO: pc.Vec4; } /** * @class * @name pc.Http * @classdesc Used to send and receive HTTP requests. * @description Create a new Http instance. By default, a PlayCanvas application creates an instance of this * object at `pc.http`. */ class Http { /** * @function * @name pc.Http#get * @description Perform an HTTP GET request to the given url. * @param {string} url - The URL to make the request to. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @example * pc.http.get("http://example.com/", function (err, response) { * console.log(response); * }); * @returns {XMLHttpRequest} The request object. */ get(url: string, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#get * @variation 2 * @description Perform an HTTP GET request to the given url. * @param {string} url - The URL to make the request to. * @param {object} options - Additional options. * @param {object} [options.headers] - HTTP headers to add to the request. * @param {boolean} [options.async] - Make the request asynchronously. Defaults to true. * @param {object} [options.cache] - If false, then add a timestamp to the request to prevent caching. * @param {boolean} [options.withCredentials] - Send cookies with this request. Defaults to false. * @param {string} [options.responseType] - Override the response type. * @param {Document|object} [options.postdata] - Data to send in the body of the request. * Some content types are handled automatically. If postdata is an XML Document, it is handled. If * the Content-Type header is set to 'application/json' then the postdata is JSON stringified. * Otherwise, by default, the data is sent as form-urlencoded. * @param {boolean} [options.retry] - If true then if the request fails it will be retried with an exponential backoff. * @param {number} [options.maxRetries] - If options.retry is true this specifies the maximum number of retries. Defaults to 5. * @param {number} [options.maxRetryDelay] - If options.retry is true this specifies the maximum amount of time to wait between retries in milliseconds. Defaults to 5000. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ get(url: string, options: { headers?: any; async?: boolean; cache?: any; withCredentials?: boolean; responseType?: string; postdata?: Document | any; retry?: boolean; maxRetries?: number; maxRetryDelay?: number; }, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#post * @description Perform an HTTP POST request to the given url. * @param {string} url - The URL to make the request to. * @param {object} data - Data to send in the body of the request. * Some content types are handled automatically. If postdata is an XML Document, it is handled. If * the Content-Type header is set to 'application/json' then the postdata is JSON stringified. * Otherwise, by default, the data is sent as form-urlencoded. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ post(url: string, data: any, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#post * @variation 2 * @description Perform an HTTP POST request to the given url. * @param {string} url - The URL to make the request to. * @param {object} data - Data to send in the body of the request. * Some content types are handled automatically. If postdata is an XML Document, it is handled. If * the Content-Type header is set to 'application/json' then the postdata is JSON stringified. * Otherwise, by default, the data is sent as form-urlencoded. * @param {object} options - Additional options. * @param {object} [options.headers] - HTTP headers to add to the request. * @param {boolean} [options.async] - Make the request asynchronously. Defaults to true. * @param {object} [options.cache] - If false, then add a timestamp to the request to prevent caching. * @param {boolean} [options.withCredentials] - Send cookies with this request. Defaults to false. * @param {string} [options.responseType] - Override the response type. * @param {boolean} [options.retry] - If true then if the request fails it will be retried with an exponential backoff. * @param {number} [options.maxRetries] - If options.retry is true this specifies the maximum number of retries. Defaults to 5. * @param {number} [options.maxRetryDelay] - If options.retry is true this specifies the maximum amount of time to wait between retries in milliseconds. Defaults to 5000. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ post(url: string, data: any, options: { headers?: any; async?: boolean; cache?: any; withCredentials?: boolean; responseType?: string; retry?: boolean; maxRetries?: number; maxRetryDelay?: number; }, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#put * @description Perform an HTTP PUT request to the given url. * @param {string} url - The URL to make the request to. * @param {Document|object} data - Data to send in the body of the request. * Some content types are handled automatically. If postdata is an XML Document, it is handled. If * the Content-Type header is set to 'application/json' then the postdata is JSON stringified. * Otherwise, by default, the data is sent as form-urlencoded. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ put(url: string, data: Document | any, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#put * @variation 2 * @description Perform an HTTP PUT request to the given url. * @param {string} url - The URL to make the request to. * @param {Document|object} data - Data to send in the body of the request. * Some content types are handled automatically. If postdata is an XML Document, it is handled. If * the Content-Type header is set to 'application/json' then the postdata is JSON stringified. * Otherwise, by default, the data is sent as form-urlencoded. * @param {object} options - Additional options. * @param {object} [options.headers] - HTTP headers to add to the request. * @param {boolean} [options.async] - Make the request asynchronously. Defaults to true. * @param {object} [options.cache] - If false, then add a timestamp to the request to prevent caching. * @param {boolean} [options.withCredentials] - Send cookies with this request. Defaults to false. * @param {string} [options.responseType] - Override the response type. * @param {boolean} [options.retry] - If true then if the request fails it will be retried with an exponential backoff. * @param {number} [options.maxRetries] - If options.retry is true this specifies the maximum number of retries. Defaults to 5. * @param {number} [options.maxRetryDelay] - If options.retry is true this specifies the maximum amount of time to wait between retries in milliseconds. Defaults to 5000. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ put(url: string, data: Document | any, options: { headers?: any; async?: boolean; cache?: any; withCredentials?: boolean; responseType?: string; retry?: boolean; maxRetries?: number; maxRetryDelay?: number; }, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#del * @description Perform an HTTP DELETE request to the given url. * @param {object} url - The URL to make the request to. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ del(url: any, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#del * @variation 2 * @description Perform an HTTP DELETE request to the given url. * @param {object} url - The URL to make the request to. * @param {object} options - Additional options. * @param {object} [options.headers] - HTTP headers to add to the request. * @param {boolean} [options.async] - Make the request asynchronously. Defaults to true. * @param {object} [options.cache] - If false, then add a timestamp to the request to prevent caching. * @param {boolean} [options.withCredentials] - Send cookies with this request. Defaults to false. * @param {string} [options.responseType] - Override the response type. * @param {Document|object} [options.postdata] - Data to send in the body of the request. * Some content types are handled automatically. If postdata is an XML Document, it is handled. If * the Content-Type header is set to 'application/json' then the postdata is JSON stringified. * Otherwise, by default, the data is sent as form-urlencoded. * @param {boolean} [options.retry] - If true then if the request fails it will be retried with an exponential backoff. * @param {number} [options.maxRetries] - If options.retry is true this specifies the maximum number of retries. Defaults to 5. * @param {number} [options.maxRetryDelay] - If options.retry is true this specifies the maximum amount of time to wait between retries in milliseconds. Defaults to 5000. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ del(url: any, options: { headers?: any; async?: boolean; cache?: any; withCredentials?: boolean; responseType?: string; postdata?: Document | any; retry?: boolean; maxRetries?: number; maxRetryDelay?: number; }, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#request * @description Make a general purpose HTTP request. * @param {string} method - The HTTP method "GET", "POST", "PUT", "DELETE". * @param {string} url - The url to make the request to. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ request(method: string, url: string, callback: pc.callbacks.HttpResponse): XMLHttpRequest; /** * @function * @name pc.Http#request * @variation 2 * @description Make a general purpose HTTP request. * @param {string} method - The HTTP method "GET", "POST", "PUT", "DELETE". * @param {string} url - The url to make the request to. * @param {object} options - Additional options. * @param {object} [options.headers] - HTTP headers to add to the request. * @param {boolean} [options.async] - Make the request asynchronously. Defaults to true. * @param {object} [options.cache] - If false, then add a timestamp to the request to prevent caching. * @param {boolean} [options.withCredentials] - Send cookies with this request. Defaults to false. * @param {boolean} [options.retry] - If true then if the request fails it will be retried with an exponential backoff. * @param {number} [options.maxRetries] - If options.retry is true this specifies the maximum number of retries. Defaults to 5. * @param {number} [options.maxRetryDelay] - If options.retry is true this specifies the maximum amount of time to wait between retries in milliseconds. Defaults to 5000. * @param {string} [options.responseType] - Override the response type. * @param {Document|object} [options.postdata] - Data to send in the body of the request. * Some content types are handled automatically. If postdata is an XML Document, it is handled. If * the Content-Type header is set to 'application/json' then the postdata is JSON stringified. * Otherwise, by default, the data is sent as form-urlencoded. * @param {pc.callbacks.HttpResponse} callback - The callback used when the response has returned. Passed (err, data) * where data is the response (format depends on response type: text, Object, ArrayBuffer, XML) and * err is the error code. * @returns {XMLHttpRequest} The request object. */ request(method: string, url: string, options: { headers?: any; async?: boolean; cache?: any; withCredentials?: boolean; retry?: boolean; maxRetries?: number; maxRetryDelay?: number; responseType?: string; postdata?: Document | any; }, callback: pc.callbacks.HttpResponse): XMLHttpRequest; } /** * @static * @readonly * @type {pc.Http} * @name pc.http * @description Default instance of {@link pc.Http}. */ const http: pc.Http; interface AnimationHandler extends pc.ResourceHandler { } /** * @class * @name pc.AnimationHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading {@link pc.Animation} resources. */ class AnimationHandler implements pc.ResourceHandler { } interface AudioHandler extends pc.ResourceHandler { } /** * @class * @name pc.AudioHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading {@link pc.Sound} resources. * @param {pc.SoundManager} manager - The sound manager. */ class AudioHandler implements pc.ResourceHandler { constructor(manager: pc.SoundManager); } /** * @class * @name pc.ContainerResource * @classdesc Container for a list of animations, textures, materials and a model. * @param {object} data - The loaded GLB data. */ class ContainerResource { constructor(data: any); } interface ContainerHandler extends pc.ResourceHandler { } /** * @class * @name pc.ContainerHandler * @implements {pc.ResourceHandler} * @classdesc Loads files that contain in them multiple resources. For example GLB files which can contain * textures, models and animations. * @param {pc.GraphicsDevice} device - The graphics device that will be rendering. * @param {pc.StandardMaterial} defaultMaterial - The shared default material that is used in any place that a material is not specified. */ class ContainerHandler implements pc.ResourceHandler { constructor(device: pc.GraphicsDevice, defaultMaterial: pc.StandardMaterial); } /** * @function * @name pc.createStyle * @description Creates a <style> DOM element from a string that contains CSS. * @param {string} cssString - A string that contains valid CSS. * @example * var css = 'body {height: 100;}'; * var style = pc.createStyle(css); * document.head.appendChild(style); * @returns {Element} The style DOM element. */ function createStyle(cssString: string): Element; interface CubemapHandler extends pc.ResourceHandler { } /** * @class * @name pc.CubemapHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading cubemap {@link pc.Texture} resources. * @param {pc.GraphicsDevice} device - The graphics device. * @param {pc.AssetRegistry} assets - The asset registry. * @param {pc.ResourceLoader} loader - The resource loader. */ class CubemapHandler implements pc.ResourceHandler { constructor(device: pc.GraphicsDevice, assets: pc.AssetRegistry, loader: pc.ResourceLoader); } interface FontHandler extends pc.ResourceHandler { } /** * @class * @name pc.FontHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading {@link pc.Font} resources. * @param {pc.ResourceLoader} loader - The resource loader. */ class FontHandler implements pc.ResourceHandler { constructor(loader: pc.ResourceLoader); } /** * @interface * @name pc.ResourceHandler * @description Interface for ResourceHandlers used by {@link pc.ResourceLoader}. */ interface ResourceHandler { /** * @function * @name pc.ResourceHandler#load * @description Load a resource from a remote URL. When loaded (or failed), * use the callback to return an the raw resource data (or error). * @param {string} url - The URL of the resource to load. * @param {pc.callbacks.ResourceHandler} callback - The callback used when the resource is loaded or an error occurs. * @param {pc.Asset} [asset] - Optional asset that is passed by ResourceLoader. */ load(url: string, callback: pc.callbacks.ResourceHandler, asset?: pc.Asset): void; /** * @function * @name pc.ResourceHandler#open * @description Convert raw resource data into a resource instance. E.g. Take 3D model format JSON and return a pc.Model. * @param {string} url - The URL of the resource to open. * @param {*} data - The raw resource data passed by callback from {@link pc.ResourceHandler#load}. * @param {pc.Asset} [asset] - Optional asset that is passed by ResourceLoader. * @returns {*} The parsed resource data. */ open(url: string, data: any, asset?: pc.Asset): any; /** * @function * @name pc.ResourceHandler#[patch] * @description Optional function to perform any operations on a resource, that requires a dependency on its asset data * or any other asset data. * @param {pc.Asset} asset - The asset to patch. * @param {pc.AssetRegistry} assets - The asset registry. */ patch?(asset: pc.Asset, assets: pc.AssetRegistry): void; } /** * @class * @name pc.ResourceLoader * @param {pc.Application} app - The application. * @classdesc Load resource data, potentially from remote sources. Caches resource on load to prevent * multiple requests. Add ResourceHandlers to handle different types of resources. */ class ResourceLoader { constructor(app: pc.Application); /** * @function * @name pc.ResourceLoader#addHandler * @description Add a {@link pc.ResourceHandler} for a resource type. Handler should support atleast load() and open(). * Handlers can optionally support patch(asset, assets) to handle dependencies on other assets. * @param {string} type - The name of the resource type that the handler will be registerd with. Can be: * * * {@link pc.ASSET_ANIMATION} * * {@link pc.ASSET_AUDIO} * * {@link pc.ASSET_IMAGE} * * {@link pc.ASSET_JSON} * * {@link pc.ASSET_MODEL} * * {@link pc.ASSET_MATERIAL} * * {@link pc.ASSET_TEXT} * * {@link pc.ASSET_TEXTURE} * * {@link pc.ASSET_CUBEMAP} * * {@link pc.ASSET_SHADER} * * {@link pc.ASSET_CSS} * * {@link pc.ASSET_HTML} * * {@link pc.ASSET_SCRIPT} * * @param {pc.ResourceHandler} handler - An instance of a resource handler supporting atleast load() and open(). * @example * var loader = new ResourceLoader(); * loader.addHandler("json", new pc.JsonHandler()); */ addHandler(type: string, handler: pc.ResourceHandler): void; /** * @function * @name pc.ResourceLoader#removeHandler * @description Remove a {@link pc.ResourceHandler} for a resource type. * @param {string} type - The name of the type that the handler will be removed. */ removeHandler(type: string): void; /** * @function * @name pc.ResourceLoader#getHandler * @description Get a {@link pc.ResourceHandler} for a resource type. * @param {string} type - The name of the resource type that the handler is registerd with. * @returns {pc.ResourceHandler} The registerd handler. */ getHandler(type: string): pc.ResourceHandler; /** * @function * @name pc.ResourceLoader#load * @description Make a request for a resource from a remote URL. Parse the returned data using the * handler for the specified type. When loaded and parsed, use the callback to return an instance of * the resource. * @param {string} url - The URL of the resource to load. * @param {string} type - The type of resource expected. * @param {pc.callbacks.ResourceLoader} callback - The callback used when the resource is loaded or an error occurs. * @param {pc.Asset} [asset] - Optional asset that is passed into handler * Passed (err, resource) where err is null if there are no errors. * @example * app.loader.load("../path/to/texture.png", "texture", function (err, texture) { * // use texture here * }); */ load(url: string, type: string, callback: pc.callbacks.ResourceLoader, asset?: pc.Asset): void; /** * @function * @name pc.ResourceLoader#open * @description Convert raw resource data into a resource instance. E.g. Take 3D model format JSON and return a pc.Model. * @param {string} type - The type of resource. * @param {*} data - The raw resource data. * @returns {*} The parsed resource data. */ open(type: string, data: any): any; /** * @function * @name pc.ResourceLoader#patch * @description Perform any operations on a resource, that requires a dependency on its asset data * or any other asset data. * @param {pc.Asset} asset - The asset to patch. * @param {pc.AssetRegistry} assets - The asset registry. */ patch(asset: pc.Asset, assets: pc.AssetRegistry): void; /** * @function * @name pc.ResourceLoader#clearCache * @description Remove resource from cache. * @param {string} url - The URL of the resource. * @param {string} type - The type of resource. */ clearCache(url: string, type: string): void; /** * @function * @name pc.ResourceLoader#getFromCache * @description Check cache for resource from a URL. If present, return the cached value. * @param {string} url - The URL of the resource to get from the cache. * @param {string} type - The type of the resource. * @returns {*} The resource loaded from the cache. */ getFromCache(url: string, type: string): any; /** * @function * @name pc.ResourceLoader#destroy * @description Destroys the resource loader. */ destroy(): void; } interface MaterialHandler extends pc.ResourceHandler { } /** * @class * @name pc.MaterialHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading {@link pc.Material} resources. * @param {pc.Application} app - The running {@link pc.Application}. */ class MaterialHandler implements pc.ResourceHandler { constructor(app: pc.Application); } interface ModelHandler extends pc.ResourceHandler { } /** * @class * @name pc.ModelHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading {@link pc.Model} resources. * @param {pc.GraphicsDevice} device - The graphics device that will be rendering. * @param {pc.StandardMaterial} defaultMaterial - The shared default material that is used in any place that a material is not specified. */ class ModelHandler implements pc.ResourceHandler { constructor(device: pc.GraphicsDevice, defaultMaterial: pc.StandardMaterial); /** * @function * @name pc.ModelHandler#load * @description Fetch model data from a remote url. * @param {string} url - The URL of the model data. * @param {pc.callbacks.ResourceHandler} callback - Callback function called when the load completes. The * callback is of the form fn(err, response), where err is a String error message in * the case where the load fails, and response is the model data that has been * successfully loaded. */ load(url: string, callback: pc.callbacks.ResourceHandler): void; /** * @function * @name pc.ModelHandler#open * @description Process data in deserialized format into a pc.Model object. * @param {string} url - The URL of the model data. * @param {object} data - The data from model file deserialized into a JavaScript Object. * @returns {pc.Model} The loaded model. */ open(url: string, data: any): pc.Model; /** * @function * @name pc.ModelHandler#addParser * @description Add a parser that converts raw data into a {@link pc.Model} * Default parser is for JSON models. * @param {object} parser - See JsonModelParser for example. * @param {pc.callbacks.AddParser} decider - Function that decides on which parser to use. * Function should take (url, data) arguments and return true if this parser should be used to parse the data into a {@link pc.Model}. * The first parser to return true is used. */ addParser(parser: any, decider: pc.callbacks.AddParser): void; } interface SceneHandler extends pc.ResourceHandler { } /** * @class * @name pc.SceneHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading {@link pc.Scene} resources. * @param {pc.Application} app - The running {@link pc.Application}. */ class SceneHandler implements pc.ResourceHandler { constructor(app: pc.Application); } interface ScriptHandler extends pc.ResourceHandler { } /** * @class * @name pc.ScriptHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler for loading JavaScript files dynamically * Two types of JavaScript files can be loaded, PlayCanvas scripts which contain calls to {@link pc.createScript}, * or regular JavaScript files, such as third-party libraries. * @param {pc.Application} app - The running {@link pc.Application}. */ class ScriptHandler implements pc.ResourceHandler { constructor(app: pc.Application); } interface SpriteHandler extends pc.ResourceHandler { } /** * @class * @name pc.SpriteHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading {@link pc.Sprite} resources. * @param {pc.AssetRegistry} assets - The asset registry. * @param {pc.GraphicsDevice} device - The graphics device. */ class SpriteHandler implements pc.ResourceHandler { constructor(assets: pc.AssetRegistry, device: pc.GraphicsDevice); } interface TextureAtlasHandler extends pc.ResourceHandler { } /** * @class * @name pc.TextureAtlasHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading {@link pc.TextureAtlas} resources. * @param {pc.ResourceLoader} loader - The resource loader. */ class TextureAtlasHandler implements pc.ResourceHandler { constructor(loader: pc.ResourceLoader); } interface TextureHandler extends pc.ResourceHandler { } /** * @class * @name pc.TextureHandler * @implements {pc.ResourceHandler} * @classdesc Resource handler used for loading 2D and 3D {@link pc.Texture} resources. * @param {pc.GraphicsDevice} device - The graphics device. * @param {pc.AssetRegistry} assets - The asset registry. * @param {pc.ResourceLoader} loader - The resource loader. */ class TextureHandler implements pc.ResourceHandler { constructor(device: pc.GraphicsDevice, assets: pc.AssetRegistry, loader: pc.ResourceLoader); } /** * @class * @name pc.Batch * @classdesc Holds information about batched mesh instances. Created in {@link pc.BatchManager#create}. * @param {pc.MeshInstance[]} meshInstances - The mesh instances to be batched. * @param {boolean} dynamic - Whether this batch is dynamic (supports transforming mesh instances at runtime). * @param {number} batchGroupId - Link this batch to a specific batch group. This is done automatically with default batches. * @property {pc.MeshInstance[]} origMeshInstances An array of original mesh instances, from which this batch was generated. * @property {pc.MeshInstance} meshInstance A single combined mesh instance, the result of batching. * @property {pc.Model} model A handy model object. * @property {boolean} dynamic Whether this batch is dynamic (supports transforming mesh instances at runtime). * @property {number} [batchGroupId] Link this batch to a specific batch group. This is done automatically with default batches. */ class Batch { constructor(meshInstances: pc.MeshInstance[], dynamic: boolean, batchGroupId: number); /** * An array of original mesh instances, from which this batch was generated. */ origMeshInstances: pc.MeshInstance[]; /** * A single combined mesh instance, the result of batching. */ meshInstance: pc.MeshInstance; /** * A handy model object. */ model: pc.Model; /** * Whether this batch is dynamic (supports transforming mesh instances at runtime). */ dynamic: boolean; /** * Link this batch to a specific batch group. This is done automatically with default batches. */ batchGroupId?: number; } /** * @class * @name pc.BatchGroup * @classdesc Holds mesh batching settings and a unique id. Created via {@link pc.BatchManager#addGroup}. * @param {number} id - Unique id. Can be assigned to model and element components. * @param {string} name - The name of the group. * @param {boolean} dynamic - Whether objects within this batch group should support transforming at runtime. * @param {number} maxAabbSize - Maximum size of any dimension of a bounding box around batched objects. * {@link pc.BatchManager#prepare} will split objects into local groups based on this size. * @param {number[]} [layers] - Layer ID array. Default is [pc.LAYERID_WORLD]. The whole batch group will belong * to these layers. Layers of source models will be ignored. * @property {boolean} dynamic Whether objects within this batch group should support transforming at runtime. * @property {number} maxAabbSize Maximum size of any dimension of a bounding box around batched objects. * {@link pc.BatchManager#prepare} will split objects into local groups based on this size. * @property {number} id Unique id. Can be assigned to model and element components. * @property {string} name Name of the group. * @property {number[]} [layers] Layer ID array. Default is [pc.LAYERID_WORLD]. The whole batch group will belong * to these layers. Layers of source models will be ignored. */ class BatchGroup { constructor(id: number, name: string, dynamic: boolean, maxAabbSize: number, layers?: number[]); /** * Whether objects within this batch group should support transforming at runtime. */ dynamic: boolean; /** * Maximum size of any dimension of a bounding box around batched objects. {@link pc.BatchManager#prepare} will split objects into local groups based on this size. */ maxAabbSize: number; /** * Unique id. Can be assigned to model and element components. */ id: number; /** * Name of the group. */ name: string; /** * Layer ID array. Default is [pc.LAYERID_WORLD]. The whole batch group will belong to these layers. Layers of source models will be ignored. */ layers?: number[]; } /** * @class * @name pc.BatchManager * @classdesc Glues many mesh instances into a single one for better performance. * @param {pc.GraphicsDevice} device - The graphics device used by the batch manager. * @param {pc.Entity} root - The entity under which batched models are added. * @param {pc.Scene} scene - The scene that the batch manager affects. */ class BatchManager { constructor(device: pc.GraphicsDevice, root: pc.Entity, scene: pc.Scene); /** * @function * @name pc.BatchManager#addGroup * @description Adds new global batch group. * @param {string} name - Custom name. * @param {boolean} dynamic - Is this batch group dynamic? Will these objects move/rotate/scale after being batched? * @param {number} maxAabbSize - Maximum size of any dimension of a bounding box around batched objects. * {@link pc.BatchManager#prepare} will split objects into local groups based on this size. * @param {number} [id] - Optional custom unique id for the group (will be generated automatically otherwise). * @param {number[]} [layers] - Optional layer ID array. Default is [pc.LAYERID_WORLD]. The whole batch group will * belong to these layers. Layers of source models will be ignored. * @returns {pc.BatchGroup} Group object. */ addGroup(name: string, dynamic: boolean, maxAabbSize: number, id?: number, layers?: number[]): pc.BatchGroup; /** * @function * @name pc.BatchManager#removeGroup * @description Remove global batch group by id. * Note, this traverses the entire scene graph and clears the batch group id from all components. * @param {number} id - Batch Group ID. */ removeGroup(id: number): void; /** * @function * @name pc.BatchManager#markGroupDirty * @description Mark a specific batch group as dirty. Dirty groups are re-batched before the next frame is rendered. * Note, re-batching a group is a potentially expensive operation. * @param {number} id - Batch Group ID to mark as dirty. */ markGroupDirty(id: number): void; /** * @function * @name pc.BatchManager#getGroupByName * @description Retrieves a {@link pc.BatchGroup} object with a corresponding name, if it exists, or null otherwise. * @param {string} name - Name. * @returns {pc.BatchGroup} Group object. */ getGroupByName(name: string): pc.BatchGroup; /** * @function * @name pc.BatchManager#generate * @description Destroys all batches and creates new based on scene models. Hides original models. Called by engine automatically on app start, and if batchGroupIds on models are changed. * @param {number[]} [groupIds] - Optional array of batch group IDs to update. Otherwise all groups are updated. */ generate(groupIds?: number[]): void; /** * @function * @name pc.BatchManager#prepare * @description Takes a list of mesh instances to be batched and sorts them into lists one for each draw call. * The input list will be split, if: * * * Mesh instances use different materials. * * Mesh instances have different parameters (e.g. lightmaps or static lights). * * Mesh instances have different shader defines (shadow receiving, being aligned to screen space, etc). * * Too many vertices for a single batch (65535 is maximum). * * Too many instances for a single batch (hardware-dependent, expect 128 on low-end and 1024 on high-end). * * Bounding box of a batch is larger than maxAabbSize in any dimension. * * @param {pc.MeshInstance[]} meshInstances - Input list of mesh instances * @param {boolean} dynamic - Are we preparing for a dynamic batch? Instance count will matter then (otherwise not). * @param {number} maxAabbSize - Maximum size of any dimension of a bounding box around batched objects. * @param {boolean} translucent - Are we batching UI elements or sprites * This is useful to keep a balance between the number of draw calls and the number of drawn triangles, because smaller batches can be hidden when not visible in camera. * @returns {pc.MeshInstance[]} An array of arrays of mesh instances, each valid to pass to {@link pc.BatchManager#create}. */ prepare(meshInstances: pc.MeshInstance[], dynamic: boolean, maxAabbSize: number, translucent: boolean): pc.MeshInstance[]; /** * @function * @name pc.BatchManager#create * @description Takes a mesh instance list that has been prepared by {@link pc.BatchManager#prepare}, and returns a {@link pc.Batch} object. This method assumes that all mesh instances provided can be rendered in a single draw call. * @param {pc.MeshInstance[]} meshInstances - Input list of mesh instances. * @param {boolean} dynamic - Is it a static or dynamic batch? Will objects be transformed after batching? * @param {number} [batchGroupId] - Link this batch to a specific batch group. This is done automatically with default batches. * @returns {pc.Batch} The resulting batch object. */ create(meshInstances: pc.MeshInstance[], dynamic: boolean, batchGroupId?: number): pc.Batch; /** * @function * @name pc.BatchManager#clone * @description Clones a batch. This method doesn't rebuild batch geometry, but only creates a new model and batch objects, linked to different source mesh instances. * @param {pc.Batch} batch - A batch object. * @param {pc.MeshInstance[]} clonedMeshInstances - New mesh instances. * @returns {pc.Batch} New batch object. */ clone(batch: pc.Batch, clonedMeshInstances: pc.MeshInstance[]): pc.Batch; } /** * @class * @name pc.ForwardRenderer * @classdesc The forward renderer render scene objects. * @description Creates a new forward renderer object. * @param {pc.GraphicsDevice} graphicsDevice - The graphics device used by the renderer. */ class ForwardRenderer { constructor(graphicsDevice: pc.GraphicsDevice); } /** * @class * @name pc.GraphNode * @augments pc.EventHandler * @classdesc A hierarchical scene node. * @param {string} [name] - The non-unique name of the graph node, default is "Untitled". * @property {string} name The non-unique name of a graph node. * @property {pc.Tags} tags Interface for tagging graph nodes. Tag based searches can be performed using the {@link pc.GraphNode#findByTag} function. */ class GraphNode extends pc.EventHandler { constructor(name?: string); /** * @readonly * @name pc.GraphNode#right * @type {pc.Vec3} * @description The normalized local space X-axis vector of the graph node in world space. */ readonly right: pc.Vec3; /** * @readonly * @name pc.GraphNode#up * @type {pc.Vec3} * @description The normalized local space Y-axis vector of the graph node in world space. */ readonly up: pc.Vec3; /** * @readonly * @name pc.GraphNode#forward * @type {pc.Vec3} * @description The normalized local space negative Z-axis vector of the graph node in world space. */ readonly forward: pc.Vec3; /** * @name pc.GraphNode#enabled * @type {boolean} * @description Enable or disable a GraphNode. If one of the GraphNode's parents is disabled * there will be no other side effects. If all the parents are enabled then * the new value will activate / deactivate all the enabled children of the GraphNode. */ enabled: boolean; /** * @readonly * @name pc.GraphNode#parent * @type {pc.GraphNode} * @description A read-only property to get a parent graph node. */ readonly parent: pc.GraphNode; /** * @readonly * @name pc.GraphNode#path * @type {string} * @description A read-only property to get the path of the graph node relative to * the root of the hierarchy. */ readonly path: string; /** * @readonly * @name pc.GraphNode#root * @type {pc.GraphNode} * @description A read-only property to get highest graph node from current node. */ readonly root: pc.GraphNode; /** * @readonly * @name pc.GraphNode#children * @type {pc.GraphNode[]} * @description A read-only property to get the children of this graph node. */ readonly children: pc.GraphNode[]; /** * @readonly * @name pc.GraphNode#graphDepth * @type {number} * @description A read-only property to get the depth of this child within the graph. Note that for performance reasons this is only recalculated when a node is added to a new parent, i.e. It is not recalculated when a node is simply removed from the graph. */ readonly graphDepth: number; /** * @function * @name pc.GraphNode#find * @description Search the graph node and all of its descendants for the nodes that satisfy some search criteria. * @param {pc.callbacks.FindNode|string} attr - This can either be a function or a string. If it's a function, it is executed * for each descendant node to test if node satisfies the search logic. Returning true from the function will * include the node into the results. If it's a string then it represents the name of a field or a method of the * node. If this is the name of a field then the value passed as the second argument will be checked for equality. * If this is the name of a function then the return value of the function will be checked for equality against * the valued passed as the second argument to this function. * @param {object} [value] - If the first argument (attr) is a property name then this value will be checked against * the value of the property. * @returns {pc.GraphNode[]} The array of graph nodes that match the search criteria. * @example * // Finds all nodes that have a model component and have `door` in their lower-cased name * var doors = house.find(function (node) { * return node.model && node.name.toLowerCase().indexOf('door') !== -1; * }); * @example * // Finds all nodes that have the name property set to 'Test' * var entities = parent.find('name', 'Test'); */ find(attr: pc.callbacks.FindNode | string, value?: any): pc.GraphNode[]; /** * @function * @name pc.GraphNode#findOne * @description Search the graph node and all of its descendants for the first node that satisfies some search criteria. * @param {pc.callbacks.FindNode|string} attr - This can either be a function or a string. If it's a function, it is executed * for each descendant node to test if node satisfies the search logic. Returning true from the function will * result in that node being returned from findOne. If it's a string then it represents the name of a field or a method of the * node. If this is the name of a field then the value passed as the second argument will be checked for equality. * If this is the name of a function then the return value of the function will be checked for equality against * the valued passed as the second argument to this function. * @param {object} [value] - If the first argument (attr) is a property name then this value will be checked against * the value of the property. * @returns {pc.GraphNode} A graph node that match the search criteria. * @example * // Find the first node that is called `head` and has a model component * var head = player.findOne(function (node) { * return node.model && node.name === 'head'; * }); * @example * // Finds the first node that has the name property set to 'Test' * var node = parent.findOne('name', 'Test'); */ findOne(attr: pc.callbacks.FindNode | string, value?: any): pc.GraphNode; /** * @function * @name pc.GraphNode#findByTag * @description Return all graph nodes that satisfy the search query. * Query can be simply a string, or comma separated strings, * to have inclusive results of assets that match at least one query. * A query that consists of an array of tags can be used to match graph nodes that have each tag of array. * @param {string} query - Name of a tag or array of tags. * @returns {pc.GraphNode[]} A list of all graph nodes that match the query. * @example * // Return all graph nodes that tagged by `animal` * var animals = node.findByTag("animal"); * @example * // Return all graph nodes that tagged by `bird` OR `mammal` * var birdsAndMammals = node.findByTag("bird", "mammal"); * @example * // Return all assets that tagged by `carnivore` AND `mammal` * var meatEatingMammals = node.findByTag(["carnivore", "mammal"]); * @example * // Return all assets that tagged by (`carnivore` AND `mammal`) OR (`carnivore` AND `reptile`) * var meatEatingMammalsAndReptiles = node.findByTag(["carnivore", "mammal"], ["carnivore", "reptile"]); */ findByTag(query: string): pc.GraphNode[]; /** * @function * @name pc.GraphNode#findByName * @description Get the first node found in the graph with the name. The search * is depth first. * @param {string} name - The name of the graph. * @returns {pc.GraphNode} The first node to be found matching the supplied name. */ findByName(name: string): pc.GraphNode; /** * @function * @name pc.GraphNode#findByPath * @description Get the first node found in the graph by its full path in the graph. * The full path has this form 'parent/child/sub-child'. The search is depth first. * @param {string} path - The full path of the pc.GraphNode. * @returns {pc.GraphNode} The first node to be found matching the supplied path. * @example * var path = this.entity.findByPath('child/another_child'); */ findByPath(path: string): pc.GraphNode; /** * @function * @name pc.GraphNode#forEach * @description Executes a provided function once on this graph node and all of its descendants. * @param {pc.callbacks.ForEach} callback - The function to execute on the graph node and each descendant. * @param {object} [thisArg] - Optional value to use as this when executing callback function. * @example * // Log the path and name of each node in descendant tree starting with "parent" * parent.forEach(function (node) { * console.log(node.path + "/" + node.name); * }); */ forEach(callback: pc.callbacks.ForEach, thisArg?: any): void; /** * @function * @name pc.GraphNode#isDescendantOf * @description Check if node is descendant of another node. * @param {pc.GraphNode} node - Potential ancestor of node. * @returns {boolean} If node is descendant of another node. * @example * if (roof.isDescendantOf(house)) { * // roof is descendant of house entity * } */ isDescendantOf(node: pc.GraphNode): boolean; /** * @function * @name pc.GraphNode#isAncestorOf * @description Check if node is ancestor for another node. * @param {pc.GraphNode} node - Potential descendant of node. * @returns {boolean} If node is ancestor for another node. * @example * if (body.isAncestorOf(foot)) { * // foot is within body's hierarchy * } */ isAncestorOf(node: pc.GraphNode): boolean; /** * @function * @name pc.GraphNode#getEulerAngles * @description Get the world space rotation for the specified GraphNode in Euler angle * form. The order of the returned Euler angles is XYZ. The value returned by this function * should be considered read-only. In order to set the world-space rotation of the graph * node, use {@link pc.GraphNode#setEulerAngles}. * @returns {pc.Vec3} The world space rotation of the graph node in Euler angle form. * @example * var angles = this.entity.getEulerAngles(); // [0,0,0] * angles[1] = 180; // rotate the entity around Y by 180 degrees * this.entity.setEulerAngles(angles); */ getEulerAngles(): pc.Vec3; /** * @function * @name pc.GraphNode#getLocalEulerAngles * @description Get the rotation in local space for the specified GraphNode. The rotation * is returned as euler angles in a 3-dimensional vector where the order is XYZ. The * returned vector should be considered read-only. To update the local rotation, use * {@link pc.GraphNode#setLocalEulerAngles}. * @returns {pc.Vec3} The local space rotation of the graph node as euler angles in XYZ order. * @example * var angles = this.entity.getLocalEulerAngles(); * angles[1] = 180; * this.entity.setLocalEulerAngles(angles); */ getLocalEulerAngles(): pc.Vec3; /** * @function * @name pc.GraphNode#getLocalPosition * @description Get the position in local space for the specified GraphNode. The position * is returned as a 3-dimensional vector. The returned vector should be considered read-only. * To update the local position, use {@link pc.GraphNode#setLocalPosition}. * @returns {pc.Vec3} The local space position of the graph node. * @example * var position = this.entity.getLocalPosition(); * position[0] += 1; // move the entity 1 unit along x. * this.entity.setLocalPosition(position); */ getLocalPosition(): pc.Vec3; /** * @function * @name pc.GraphNode#getLocalRotation * @description Get the rotation in local space for the specified GraphNode. The rotation * is returned as a quaternion. The returned quaternion should be considered read-only. * To update the local rotation, use {@link pc.GraphNode#setLocalRotation}. * @returns {pc.Quat} The local space rotation of the graph node as a quaternion. * @example * var rotation = this.entity.getLocalRotation(); */ getLocalRotation(): pc.Quat; /** * @function * @name pc.GraphNode#getLocalScale * @description Get the scale in local space for the specified GraphNode. The scale * is returned as a 3-dimensional vector. The returned vector should be considered read-only. * To update the local scale, use {@link pc.GraphNode#setLocalScale}. * @returns {pc.Vec3} The local space scale of the graph node. * @example * var scale = this.entity.getLocalScale(); * scale.x = 100; * this.entity.setLocalScale(scale); */ getLocalScale(): pc.Vec3; /** * @function * @name pc.GraphNode#getLocalTransform * @description Get the local transform matrix for this graph node. This matrix * is the transform relative to the node's parent's world transformation matrix. * @returns {pc.Mat4} The node's local transformation matrix. * @example * var transform = this.entity.getLocalTransform(); */ getLocalTransform(): pc.Mat4; /** * @function * @name pc.GraphNode#getPosition * @description Get the world space position for the specified GraphNode. The * value returned by this function should be considered read-only. In order to set * the world-space position of the graph node, use {@link pc.GraphNode#setPosition}. * @returns {pc.Vec3} The world space position of the graph node. * @example * var position = this.entity.getPosition(); * position.x = 10; * this.entity.setPosition(position); */ getPosition(): pc.Vec3; /** * @function * @name pc.GraphNode#getRotation * @description Get the world space rotation for the specified GraphNode in quaternion * form. The value returned by this function should be considered read-only. In order * to set the world-space rotation of the graph node, use {@link pc.GraphNode#setRotation}. * @returns {pc.Quat} The world space rotation of the graph node as a quaternion. * @example * var rotation = this.entity.getRotation(); */ getRotation(): pc.Quat; /** * @function * @name pc.GraphNode#getWorldTransform * @description Get the world transformation matrix for this graph node. * @returns {pc.Mat4} The node's world transformation matrix. * @example * var transform = this.entity.getWorldTransform(); */ getWorldTransform(): pc.Mat4; /** * @function * @name pc.GraphNode#reparent * @description Remove graph node from current parent and add as child to new parent. * @param {pc.GraphNode} parent - New parent to attach graph node to. * @param {number} [index] - The child index where the child node should be placed. */ reparent(parent: pc.GraphNode, index?: number): void; /** * @function * @name pc.GraphNode#setLocalEulerAngles * @description Sets the local-space rotation of the specified graph node using euler angles. * Eulers are interpreted in XYZ order. Eulers must be specified in degrees. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * local-space euler rotation. * @param {pc.Vec3|number} x - 3-dimensional vector holding eulers or rotation around local-space * x-axis in degrees. * @param {number} [y] - Rotation around local-space y-axis in degrees. * @param {number} [z] - Rotation around local-space z-axis in degrees. * @example * // Set rotation of 90 degrees around y-axis via 3 numbers * this.entity.setLocalEulerAngles(0, 90, 0); * @example * // Set rotation of 90 degrees around y-axis via a vector * var angles = new pc.Vec3(0, 90, 0); * this.entity.setLocalEulerAngles(angles); */ setLocalEulerAngles(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#setLocalPosition * @description Sets the local-space position of the specified graph node. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * local-space position. * @param {pc.Vec3|number} x - 3-dimensional vector holding local-space position or * x-coordinate of local-space position. * @param {number} [y] - Y-coordinate of local-space position. * @param {number} [z] - Z-coordinate of local-space position. * @example * // Set via 3 numbers * this.entity.setLocalPosition(0, 10, 0); * @example * // Set via vector * var pos = new pc.Vec3(0, 10, 0); * this.entity.setLocalPosition(pos); */ setLocalPosition(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#setLocalRotation * @description Sets the local-space rotation of the specified graph node. This function * has two valid signatures: you can either pass a quaternion or 3 numbers to specify the * local-space rotation. * @param {pc.Quat|number} x - Quaternion holding local-space rotation or x-component of * local-space quaternion rotation. * @param {number} [y] - Y-component of local-space quaternion rotation. * @param {number} [z] - Z-component of local-space quaternion rotation. * @param {number} [w] - W-component of local-space quaternion rotation. * @example * // Set via 4 numbers * this.entity.setLocalRotation(0, 0, 0, 1); * @example * // Set via quaternion * var q = pc.Quat(); * this.entity.setLocalRotation(q); */ setLocalRotation(x: pc.Quat | number, y?: number, z?: number, w?: number): void; /** * @function * @name pc.GraphNode#setLocalScale * @description Sets the local-space scale factor of the specified graph node. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * local-space scale. * @param {pc.Vec3|number} x - 3-dimensional vector holding local-space scale or x-coordinate * of local-space scale. * @param {number} [y] - Y-coordinate of local-space scale. * @param {number} [z] - Z-coordinate of local-space scale. * @example * // Set via 3 numbers * this.entity.setLocalScale(10, 10, 10); * @example * // Set via vector * var scale = new pc.Vec3(10, 10, 10); * this.entity.setLocalScale(scale); */ setLocalScale(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#setPosition * @description Sets the world-space position of the specified graph node. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * world-space position. * @param {pc.Vec3|number} x - 3-dimensional vector holding world-space position or * x-coordinate of world-space position. * @param {number} [y] - Y-coordinate of world-space position. * @param {number} [z] - Z-coordinate of world-space position. * @example * // Set via 3 numbers * this.entity.setPosition(0, 10, 0); * @example * // Set via vector * var position = new pc.Vec3(0, 10, 0); * this.entity.setPosition(position); */ setPosition(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#setRotation * @description Sets the world-space rotation of the specified graph node. This function * has two valid signatures: you can either pass a quaternion or 3 numbers to specify the * world-space rotation. * @param {pc.Quat|number} x - Quaternion holding world-space rotation or x-component of * world-space quaternion rotation. * @param {number} [y] - Y-component of world-space quaternion rotation. * @param {number} [z] - Z-component of world-space quaternion rotation. * @param {number} [w] - W-component of world-space quaternion rotation. * @example * // Set via 4 numbers * this.entity.setRotation(0, 0, 0, 1); * @example * // Set via quaternion * var q = pc.Quat(); * this.entity.setRotation(q); */ setRotation(x: pc.Quat | number, y?: number, z?: number, w?: number): void; /** * @function * @name pc.GraphNode#setEulerAngles * @description Sets the world-space rotation of the specified graph node using euler angles. * Eulers are interpreted in XYZ order. Eulers must be specified in degrees. This function * has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the * world-space euler rotation. * @param {pc.Vec3|number} x - 3-dimensional vector holding eulers or rotation around world-space * x-axis in degrees. * @param {number} [y] - Rotation around world-space y-axis in degrees. * @param {number} [z] - Rotation around world-space z-axis in degrees. * @example * // Set rotation of 90 degrees around world-space y-axis via 3 numbers * this.entity.setEulerAngles(0, 90, 0); * @example * // Set rotation of 90 degrees around world-space y-axis via a vector * var angles = new pc.Vec3(0, 90, 0); * this.entity.setEulerAngles(angles); */ setEulerAngles(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#addChild * @description Add a new child to the child list and update the parent value of the child node. * @param {pc.GraphNode} node - The new child to add. * @example * var e = new pc.Entity(app); * this.entity.addChild(e); */ addChild(node: pc.GraphNode): void; /** * @function * @name pc.GraphNode#insertChild * @description Insert a new child to the child list at the specified index and update the parent value of the child node. * @param {pc.GraphNode} node - The new child to insert. * @param {number} index - The index in the child list of the parent where the new node will be inserted. * @example * var e = new pc.Entity(app); * this.entity.insertChild(e, 1); */ insertChild(node: pc.GraphNode, index: number): void; /** * @function * @name pc.GraphNode#removeChild * @description Remove the node from the child list and update the parent value of the child. * @param {pc.GraphNode} child - The node to remove. * @example * var child = this.entity.children[0]; * this.entity.removeChild(child); */ removeChild(child: pc.GraphNode): void; /** * @function * @name pc.GraphNode#lookAt * @description Reorients the graph node so that the negative z-axis points towards the target. * This function has two valid signatures. Either pass 3D vectors for the look at coordinate and up * vector, or pass numbers to represent the vectors. * @param {pc.Vec3|number} x - If passing a 3D vector, this is the world-space coordinate to look at. * Otherwise, it is the x-component of the world-space coordinate to look at. * @param {pc.Vec3|number} y - If passing a 3D vector, this is the world-space up vector for look at * transform. Otherwise, it is the y-component of the world-space coordinate to look at. * @param {number} z - Z-component of the world-space coordinate to look at. * @param {number} [ux=0] - X-component of the up vector for the look at transform. * @param {number} [uy=1] - Y-component of the up vector for the look at transform. * @param {number} [uz=0] - Z-component of the up vector for the look at transform. * @example * // Look at another entity, using the (default) positive y-axis for up * var position = otherEntity.getPosition(); * this.entity.lookAt(position); * @example * // Look at another entity, using the negative world y-axis for up * var position = otherEntity.getPosition(); * this.entity.lookAt(position, pc.Vec3.DOWN); * @example * // Look at the world space origin, using the (default) positive y-axis for up * this.entity.lookAt(0, 0, 0); * @example * // Look at world-space coordinate [10, 10, 10], using the negative world y-axis for up * this.entity.lookAt(10, 10, 10, 0, -1, 0); */ lookAt(x: pc.Vec3 | number, y: pc.Vec3 | number, z: number, ux?: number, uy?: number, uz?: number): void; /** * @function * @name pc.GraphNode#translate * @description Translates the graph node in world-space by the specified translation vector. * This function has two valid signatures: you can either pass a 3D vector or 3 numbers to * specify the world-space translation. * @param {pc.Vec3|number} x - 3-dimensional vector holding world-space translation or * x-coordinate of world-space translation. * @param {number} [y] - Y-coordinate of world-space translation. * @param {number} [z] - Z-coordinate of world-space translation. * @example * // Translate via 3 numbers * this.entity.translate(10, 0, 0); * @example * // Translate via vector * var t = new pc.Vec3(10, 0, 0); * this.entity.translate(t); */ translate(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#translateLocal * @description Translates the graph node in local-space by the specified translation vector. * This function has two valid signatures: you can either pass a 3D vector or 3 numbers to * specify the local-space translation. * @param {pc.Vec3|number} x - 3-dimensional vector holding local-space translation or * x-coordinate of local-space translation. * @param {number} [y] - Y-coordinate of local-space translation. * @param {number} [z] - Z-coordinate of local-space translation. * @example * // Translate via 3 numbers * this.entity.translateLocal(10, 0, 0); * @example * // Translate via vector * var t = new pc.Vec3(10, 0, 0); * this.entity.translateLocal(t); */ translateLocal(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#rotate * @description Rotates the graph node in world-space by the specified Euler angles. * Eulers are specified in degrees in XYZ order. This function has two valid signatures: * you can either pass a 3D vector or 3 numbers to specify the world-space rotation. * @param {pc.Vec3|number} x - 3-dimensional vector holding world-space rotation or * rotation around world-space x-axis in degrees. * @param {number} [y] - Rotation around world-space y-axis in degrees. * @param {number} [z] - Rotation around world-space z-axis in degrees. * @example * // Rotate via 3 numbers * this.entity.rotate(0, 90, 0); * @example * // Rotate via vector * var r = new pc.Vec3(0, 90, 0); * this.entity.rotate(r); */ rotate(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.GraphNode#rotateLocal * @description Rotates the graph node in local-space by the specified Euler angles. * Eulers are specified in degrees in XYZ order. This function has two valid signatures: * you can either pass a 3D vector or 3 numbers to specify the local-space rotation. * @param {pc.Vec3|number} x - 3-dimensional vector holding local-space rotation or * rotation around local-space x-axis in degrees. * @param {number} [y] - Rotation around local-space y-axis in degrees. * @param {number} [z] - Rotation around local-space z-axis in degrees. * @example * // Rotate via 3 numbers * this.entity.rotateLocal(0, 90, 0); * @example * // Rotate via vector * var r = new pc.Vec3(0, 90, 0); * this.entity.rotateLocal(r); */ rotateLocal(x: pc.Vec3 | number, y?: number, z?: number): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The non-unique name of a graph node. */ name: string; /** * Interface for tagging graph nodes. Tag based searches can be performed using the {@link pc.GraphNode#findByTag} function. */ tags: pc.Tags; } /** * @class * @name pc.LayerComposition * @augments pc.EventHandler * @classdesc Layer Composition is a collection of {@link pc.Layer} that is fed to {@link pc.Scene#layers} to define rendering order. * @description Create a new layer composition. * @property {pc.Layer[]} layerList A read-only array of {@link pc.Layer} sorted in the order they will be rendered. * @property {boolean[]} subLayerList A read-only array of boolean values, matching {@link pc.Layer#layerList}. * True means only semi-transparent objects are rendered, and false means opaque. * @property {boolean[]} subLayerEnabled A read-only array of boolean values, matching {@link pc.Layer#layerList}. * True means the layer is rendered, false means it's skipped. * @property {pc.CameraComponent[]} cameras A read-only array of {@link pc.CameraComponent} that can be used during rendering, e.g. Inside * {@link pc.Layer#onPreCull}, {@link pc.Layer#onPostCull}, {@link pc.Layer#onPreRender}, {@link pc.Layer#onPostRender}. */ class LayerComposition extends pc.EventHandler { /** * @function * @name pc.LayerComposition#push * @description Adds a layer (both opaque and semi-transparent parts) to the end of the {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to add. */ push(layer: pc.Layer): void; /** * @function * @name pc.LayerComposition#insert * @description Inserts a layer (both opaque and semi-transparent parts) at the chosen index in the {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to add. * @param {number} index - Insertion position. */ insert(layer: pc.Layer, index: number): void; /** * @function * @name pc.LayerComposition#remove * @description Removes a layer (both opaque and semi-transparent parts) from {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to remove. */ remove(layer: pc.Layer): void; /** * @function * @name pc.LayerComposition#pushOpaque * @description Adds part of the layer with opaque (non semi-transparent) objects to the end of the {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to add. */ pushOpaque(layer: pc.Layer): void; /** * @function * @name pc.LayerComposition#insertOpaque * @description Inserts an opaque part of the layer (non semi-transparent mesh instances) at the chosen index in the {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to add. * @param {number} index - Insertion position. */ insertOpaque(layer: pc.Layer, index: number): void; /** * @function * @name pc.LayerComposition#removeOpaque * @description Removes an opaque part of the layer (non semi-transparent mesh instances) from {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to remove. */ removeOpaque(layer: pc.Layer): void; /** * @function * @name pc.LayerComposition#pushTransparent * @description Adds part of the layer with semi-transparent objects to the end of the {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to add. */ pushTransparent(layer: pc.Layer): void; /** * @function * @name pc.LayerComposition#insertTransparent * @description Inserts a semi-transparent part of the layer at the chosen index in the {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to add. * @param {number} index - Insertion position. */ insertTransparent(layer: pc.Layer, index: number): void; /** * @function * @name pc.LayerComposition#removeTransparent * @description Removes a transparent part of the layer from {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to remove. */ removeTransparent(layer: pc.Layer): void; /** * @function * @name pc.LayerComposition#getOpaqueIndex * @description Gets index of the opaque part of the supplied layer in the {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to find index of. * @returns {number} The index of the opaque part of the specified layer. */ getOpaqueIndex(layer: pc.Layer): number; /** * @function * @name pc.LayerComposition#getTransparentIndex * @description Gets index of the semi-transparent part of the supplied layer in the {@link pc.Layer#layerList}. * @param {pc.Layer} layer - A {@link pc.Layer} to find index of. * @returns {number} The index of the semi-transparent part of the specified layer. */ getTransparentIndex(layer: pc.Layer): number; /** * @function * @name pc.LayerComposition#getLayerById * @description Finds a layer inside this composition by its ID. Null is returned, if nothing is found. * @param {number} id - An ID of the layer to find. * @returns {pc.Layer} The layer corresponding to the specified ID. Returns null if layer is not found. */ getLayerById(id: number): pc.Layer; /** * @function * @name pc.LayerComposition#getLayerByName * @description Finds a layer inside this composition by its name. Null is returned, if nothing is found. * @param {string} name - The name of the layer to find. * @returns {pc.Layer} The layer corresponding to the specified name. Returns null if layer is not found. */ getLayerByName(name: string): pc.Layer; /** * @function * @name pc.LayerComposition#sortTransparentLayers * @description Used to determine which array of layers has any transparent sublayer that is on top of all the transparent sublayers in the other array. * @param {number[]} layersA - IDs of layers. * @param {number[]} layersB - IDs of layers. * @returns {number} Returns a negative number if any of the transparent sublayers in layersA is on top of all the transparent sublayers in layersB, * or a positive number if any of the transparent sublayers in layersB is on top of all the transparent sublayers in layersA, or 0 otherwise. */ sortTransparentLayers(layersA: number[], layersB: number[]): number; /** * @function * @name pc.LayerComposition#sortOpaqueLayers * @description Used to determine which array of layers has any opaque sublayer that is on top of all the opaque sublayers in the other array. * @param {number[]} layersA - IDs of layers. * @param {number[]} layersB - IDs of layers. * @returns {number} Returns a negative number if any of the opaque sublayers in layersA is on top of all the opaque sublayers in layersB, * or a positive number if any of the opaque sublayers in layersB is on top of all the opaque sublayers in layersA, or 0 otherwise. */ sortOpaqueLayers(layersA: number[], layersB: number[]): number; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * A read-only array of {@link pc.Layer} sorted in the order they will be rendered. */ layerList: pc.Layer[]; /** * A read-only array of boolean values, matching {@link pc.Layer#layerList}. True means only semi-transparent objects are rendered, and false means opaque. */ subLayerList: boolean[]; /** * A read-only array of boolean values, matching {@link pc.Layer#layerList}. True means the layer is rendered, false means it's skipped. */ subLayerEnabled: boolean[]; /** * A read-only array of {@link pc.CameraComponent} that can be used during rendering, e.g. Inside {@link pc.Layer#onPreCull}, {@link pc.Layer#onPostCull}, {@link pc.Layer#onPreRender}, {@link pc.Layer#onPostRender}. */ cameras: pc.CameraComponent[]; } /** * @class * @name pc.Layer * @classdesc Layer represents a renderable subset of the scene. It can contain a list of mesh instances, lights and cameras, * their render settings and also defines custom callbacks before, after or during rendering. * Layers are organized inside {@link pc.LayerComposition} in a desired order. * @description Create a new layer. * @param {object} options - Object for passing optional arguments. These arguments are the same as properties of the Layer. * @property {boolean} enabled Enable the layer. Disabled layers are skipped. Defaults to true. * @property {string} name Name of the layer. Can be used in {@link pc.LayerComposition#getLayerByName}. * @property {number} opaqueSortMode Defines the method used for sorting opaque (that is, not semi-transparent) mesh instances before rendering. * Possible values are: * * * {@link pc.SORTMODE_NONE} * * {@link pc.SORTMODE_MANUAL} * * {@link pc.SORTMODE_MATERIALMESH} * * {@link pc.SORTMODE_BACK2FRONT} * * {@link pc.SORTMODE_FRONT2BACK} * * Defaults to pc.SORTMODE_MATERIALMESH. * @property {number} transparentSortMode Defines the method used for sorting semi-transparent mesh instances before rendering. * Possible values are: * * * {@link pc.SORTMODE_NONE} * * {@link pc.SORTMODE_MANUAL} * * {@link pc.SORTMODE_MATERIALMESH} * * {@link pc.SORTMODE_BACK2FRONT} * * {@link pc.SORTMODE_FRONT2BACK} * * Defaults to pc.SORTMODE_BACK2FRONT. * @property {pc.RenderTarget} renderTarget Render target to which rendering is performed. If not set, will render simply to the screen. * @property {number} shaderPass A type of shader to use during rendering. Possible values are: * * * {@link pc.SHADER_FORWARD} * * {@link pc.SHADER_FORWARDHDR} * * {@link pc.SHADER_DEPTH} * * Your own custom value. Should be in 19 - 31 range. Use {@link pc.StandardMaterial#onUpdateShader} to apply shader modifications based on this value. * * Defaults to pc.SHADER_FORWARD. * @property {boolean} passThrough Tells that this layer is simple and needs to just render a bunch of mesh instances without lighting, skinning and morphing (faster). * * @property {boolean} overrideClear Defines if layer should use camera clear parameters (true) or ignore them and use {@link pc.Layer#clearColor}, {@link pc.Layer#clearColorBuffer}, * {@link pc.Layer#clearDepthBuffer} and {@link pc.Layer#clearStencilBuffer}. * @property {pc.Color} clearColor The color used to clear the canvas to before each camera starts to render. * @property {boolean} clearColorBuffer If true cameras will clear the color buffer to the color set in clearColor. * @property {boolean} clearDepthBuffer If true cameras will clear the depth buffer. * @property {boolean} clearStencilBuffer If true cameras will clear the stencil buffer. * * @property {pc.Layer} layerReference Make this layer render the same mesh instances that another layer does instead of having its own mesh instance list. * Both layers must share cameras. Frustum culling is only performed for one layer. * @property {Function} cullingMask Visibility mask that interacts with {@link pc.MeshInstance#mask}. * @property {Function} onEnable Custom function that is called after the layer has been enabled. * This happens when: * * * The layer is created with {@link pc.Layer#enabled} set to true (which is the default value). * * {@link pc.Layer#enabled} was changed from false to true * * {@link pc.Layer#incrementCounter} was called and incremented the counter above zero. * * Useful for allocating resources this layer will use (e.g. creating render targets). * @property {Function} onDisable Custom function that is called after the layer has been disabled. * This happens when: * * * {@link pc.Layer#enabled} was changed from true to false * * {@link pc.Layer#decrementCounter} was called and set the counter to zero. * * @property {Function} onPreCull Custom function that is called before visibility culling is performed for this layer. * Useful, for example, if you want to modify camera projection while still using the same camera and make frustum culling work correctly with it * (see {@link pc.CameraComponent#calculateTransform} and {@link pc.CameraComponent#calculateProjection}). * This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. * @property {Function} onPostCull Custom function that is called after visibiliy culling is performed for this layer. * Useful for reverting changes done in {@link pc.Layer#onPreCull} and determining final mesh instance visibility (see {@link pc.MeshInstance#visibleThisFrame}). * This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. * @property {Function} onPreRender Custom function that is called before this layer is rendered. * Useful, for example, for reacting on screen size changes. * This function is called before the first occurrence of this layer in {@link pc.LayerComposition}. * It will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. * @property {Function} onPreRenderOpaque Custom function that is called before opaque mesh instances (not semi-transparent) in this layer are rendered. * This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. * @property {Function} onPreRenderTransparent Custom function that is called before semi-transparent mesh instances in this layer are rendered. * This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. * @property {Function} onPostRender Custom function that is called after this layer is rendered. * Useful to revert changes made in {@link pc.Layer#onPreRender} or performing some processing on {@link pc.Layer#renderTarget}. * This function is called after the last occurrence of this layer in {@link pc.LayerComposition}. * It will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. * @property {Function} onPostRenderOpaque Custom function that is called after opaque mesh instances (not semi-transparent) in this layer are rendered. * This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. * @property {Function} onPostRenderTransparent Custom function that is called after semi-transparent mesh instances in this layer are rendered. * This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. * @property {Function} onDrawCall Custom function that is called before every mesh instance in this layer is rendered. * It is not recommended to set this function when rendering many objects every frame due to performance reasons. * @property {number} id A unique ID of the layer. * Layer IDs are stored inside {@link pc.ModelComponent#layers}, {@link pc.CameraComponent#layers}, {@link pc.LightComponent#layers} and {@link pc.ElementComponent#layers} instead of names. * Can be used in {@link pc.LayerComposition#getLayerById}. */ class Layer { constructor(options: any); /** * @function * @name pc.Layer#addMeshInstances * @description Adds an array of mesh instances to this layer. * @param {pc.MeshInstance[]} meshInstances - Array of {@link pc.MeshInstance}. * @param {boolean} [skipShadowCasters] - Set it to true if you don't want these mesh instances to cast shadows in this layer. */ addMeshInstances(meshInstances: pc.MeshInstance[], skipShadowCasters?: boolean): void; /** * @function * @name pc.Layer#removeMeshInstances * @description Removes multiple mesh instances from this layer. * @param {pc.MeshInstance[]} meshInstances - Array of {@link pc.MeshInstance}. If they were added to this layer, they will be removed. * @param {boolean} [skipShadowCasters] - Set it to true if you want to still cast shadows from removed mesh instances or if they never did cast shadows before. */ removeMeshInstances(meshInstances: pc.MeshInstance[], skipShadowCasters?: boolean): void; /** * @function * @name pc.Layer#clearMeshInstances * @description Removes all mesh instances from this layer. * @param {boolean} [skipShadowCasters] - Set it to true if you want to still cast shadows from removed mesh instances or if they never did cast shadows before. */ clearMeshInstances(skipShadowCasters?: boolean): void; /** * @function * @name pc.Layer#addLight * @description Adds a light to this layer. * @param {pc.LightComponent} light - A {@link pc.LightComponent}. */ addLight(light: pc.LightComponent): void; /** * @function * @name pc.Layer#removeLight * @description Removes a light from this layer. * @param {pc.LightComponent} light - A {@link pc.LightComponent}. */ removeLight(light: pc.LightComponent): void; /** * @function * @name pc.Layer#clearLights * @description Removes all lights from this layer. */ clearLights(): void; /** * @function * @name pc.Layer#addShadowCasters * @description Adds an array of mesh instances to this layer, but only as shadow casters (they will not be rendered anywhere, but only cast shadows on other objects). * @param {pc.MeshInstance[]} meshInstances - Array of {@link pc.MeshInstance}. */ addShadowCasters(meshInstances: pc.MeshInstance[]): void; /** * @function * @name pc.Layer#removeShadowCasters * @description Removes multiple mesh instances from the shadow casters list of this layer, meaning they will stop casting shadows. * @param {pc.MeshInstance[]} meshInstances - Array of {@link pc.MeshInstance}. If they were added to this layer, they will be removed. */ removeShadowCasters(meshInstances: pc.MeshInstance[]): void; /** * @function * @name pc.Layer#addCamera * @description Adds a camera to this layer. * @param {pc.CameraComponent} camera - A {@link pc.CameraComponent}. */ addCamera(camera: pc.CameraComponent): void; /** * @function * @name pc.Layer#removeCamera * @description Removes a camera from this layer. * @param {pc.CameraComponent} camera - A {@link pc.CameraComponent}. */ removeCamera(camera: pc.CameraComponent): void; /** * @function * @name pc.Layer#clearCameras * @description Removes all cameras from this layer. */ clearCameras(): void; /** * Enable the layer. Disabled layers are skipped. Defaults to true. */ enabled: boolean; /** * Name of the layer. Can be used in {@link pc.LayerComposition#getLayerByName}. */ name: string; /** * Defines the method used for sorting opaque (that is, not semi-transparent) mesh instances before rendering. Possible values are: * {@link pc.SORTMODE_NONE} * {@link pc.SORTMODE_MANUAL} * {@link pc.SORTMODE_MATERIALMESH} * {@link pc.SORTMODE_BACK2FRONT} * {@link pc.SORTMODE_FRONT2BACK} Defaults to pc.SORTMODE_MATERIALMESH. */ opaqueSortMode: number; /** * Defines the method used for sorting semi-transparent mesh instances before rendering. Possible values are: * {@link pc.SORTMODE_NONE} * {@link pc.SORTMODE_MANUAL} * {@link pc.SORTMODE_MATERIALMESH} * {@link pc.SORTMODE_BACK2FRONT} * {@link pc.SORTMODE_FRONT2BACK} Defaults to pc.SORTMODE_BACK2FRONT. */ transparentSortMode: number; /** * Render target to which rendering is performed. If not set, will render simply to the screen. */ renderTarget: pc.RenderTarget; /** * A type of shader to use during rendering. Possible values are: * {@link pc.SHADER_FORWARD} * {@link pc.SHADER_FORWARDHDR} * {@link pc.SHADER_DEPTH} * Your own custom value. Should be in 19 - 31 range. Use {@link pc.StandardMaterial#onUpdateShader} to apply shader modifications based on this value. Defaults to pc.SHADER_FORWARD. */ shaderPass: number; /** * Tells that this layer is simple and needs to just render a bunch of mesh instances without lighting, skinning and morphing (faster). */ passThrough: boolean; /** * Defines if layer should use camera clear parameters (true) or ignore them and use {@link pc.Layer#clearColor}, {@link pc.Layer#clearColorBuffer}, {@link pc.Layer#clearDepthBuffer} and {@link pc.Layer#clearStencilBuffer}. */ overrideClear: boolean; /** * The color used to clear the canvas to before each camera starts to render. */ clearColor: pc.Color; /** * If true cameras will clear the color buffer to the color set in clearColor. */ clearColorBuffer: boolean; /** * If true cameras will clear the depth buffer. */ clearDepthBuffer: boolean; /** * If true cameras will clear the stencil buffer. */ clearStencilBuffer: boolean; /** * Make this layer render the same mesh instances that another layer does instead of having its own mesh instance list. Both layers must share cameras. Frustum culling is only performed for one layer. */ layerReference: pc.Layer; /** * Visibility mask that interacts with {@link pc.MeshInstance#mask}. */ cullingMask: (...params: any[]) => any; /** * Custom function that is called after the layer has been enabled. This happens when: * The layer is created with {@link pc.Layer#enabled} set to true (which is the default value). * {@link pc.Layer#enabled} was changed from false to true * {@link pc.Layer#incrementCounter} was called and incremented the counter above zero. Useful for allocating resources this layer will use (e.g. creating render targets). */ onEnable: (...params: any[]) => any; /** * Custom function that is called after the layer has been disabled. This happens when: * {@link pc.Layer#enabled} was changed from true to false * {@link pc.Layer#decrementCounter} was called and set the counter to zero. */ onDisable: (...params: any[]) => any; /** * Custom function that is called before visibility culling is performed for this layer. Useful, for example, if you want to modify camera projection while still using the same camera and make frustum culling work correctly with it (see {@link pc.CameraComponent#calculateTransform} and {@link pc.CameraComponent#calculateProjection}). This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. */ onPreCull: (...params: any[]) => any; /** * Custom function that is called after visibiliy culling is performed for this layer. Useful for reverting changes done in {@link pc.Layer#onPreCull} and determining final mesh instance visibility (see {@link pc.MeshInstance#visibleThisFrame}). This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. */ onPostCull: (...params: any[]) => any; /** * Custom function that is called before this layer is rendered. Useful, for example, for reacting on screen size changes. This function is called before the first occurrence of this layer in {@link pc.LayerComposition}. It will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. */ onPreRender: (...params: any[]) => any; /** * Custom function that is called before opaque mesh instances (not semi-transparent) in this layer are rendered. This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. */ onPreRenderOpaque: (...params: any[]) => any; /** * Custom function that is called before semi-transparent mesh instances in this layer are rendered. This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. */ onPreRenderTransparent: (...params: any[]) => any; /** * Custom function that is called after this layer is rendered. Useful to revert changes made in {@link pc.Layer#onPreRender} or performing some processing on {@link pc.Layer#renderTarget}. This function is called after the last occurrence of this layer in {@link pc.LayerComposition}. It will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. */ onPostRender: (...params: any[]) => any; /** * Custom function that is called after opaque mesh instances (not semi-transparent) in this layer are rendered. This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. */ onPostRenderOpaque: (...params: any[]) => any; /** * Custom function that is called after semi-transparent mesh instances in this layer are rendered. This function will receive camera index as the only argument. You can get the actual camera being used by looking up {@link pc.LayerComposition#cameras} with this index. */ onPostRenderTransparent: (...params: any[]) => any; /** * Custom function that is called before every mesh instance in this layer is rendered. It is not recommended to set this function when rendering many objects every frame due to performance reasons. */ onDrawCall: (...params: any[]) => any; /** * A unique ID of the layer. Layer IDs are stored inside {@link pc.ModelComponent#layers}, {@link pc.CameraComponent#layers}, {@link pc.LightComponent#layers} and {@link pc.ElementComponent#layers} instead of names. Can be used in {@link pc.LayerComposition#getLayerById}. */ id: number; } /** * @class * @name pc.Lightmapper * @classdesc The lightmapper is used to bake scene lights into textures. * @param {pc.GraphicsDevice} device - The grahpics device used by the lightmapper. * @param {pc.Entity} root - The root entity of the scene. * @param {pc.Scene} scene - The scene to lightmap. * @param {pc.ForwardRenderer} renderer - The renderer. * @param {pc.AssetRegistry} assets - Registry of assets to lightmap. */ class Lightmapper { constructor(device: pc.GraphicsDevice, root: pc.Entity, scene: pc.Scene, renderer: pc.ForwardRenderer, assets: pc.AssetRegistry); /** * @function * @name pc.Lightmapper#bake * @description Generates and applies the lightmaps. * @param {pc.Entity[]} nodes - An array of entities (with model components) to render * lightmaps for. If not supplied, the entire scene will be baked. * @param {number} [mode] - Baking mode. Can be: * * * {@link pc.BAKE_COLOR}: single color lightmap * * {@link pc.BAKE_COLORDIR}: single color lightmap + dominant light direction (used for bump/specular) * * Only lights with bakeDir=true will be used for generating the dominant light direction. */ bake(nodes: pc.Entity[], mode?: number): void; } /** * @class * @name pc.BasicMaterial * @augments pc.Material * @classdesc A Basic material is for rendering unlit geometry, either using a constant color or a * color map modulated with a color. * @property {pc.Color} color The flat color of the material (RGBA, where each component is 0 to 1). * @property {pc.Texture|null} colorMap The color map of the material (default is null). If specified, the color map is * modulated by the color property. * @example * // Create a new Basic material * var material = new pc.BasicMaterial(); * * // Set the material to have a texture map that is multiplied by a red color * material.color.set(1, 0, 0); * material.colorMap = diffuseMap; * * // Notify the material that it has been modified * material.update(); */ class BasicMaterial extends pc.Material { /** * @function * @name pc.BasicMaterial#clone * @description Duplicates a Basic material. All properties are duplicated except textures * where only the references are copied. * @returns {pc.BasicMaterial} A cloned Basic material. */ clone(): pc.BasicMaterial; /** * @function * @name pc.Material#update * @description Applies any changes made to the material's properties. */ update(): void; /** * @function * @name pc.Material#getParameter * @description Retrieves the specified shader parameter from a material. * @param {string} name - The name of the parameter to query. * @returns {object} The named parameter. */ getParameter(name: string): any; /** * @function * @name pc.Material#setParameter * @description Sets a shader parameter on a material. * @param {string} name - The name of the parameter to set. * @param {number|number[]|pc.Texture} data - The value for the specified parameter. * @param {number} [passFlags] - Mask describing which passes the material should be included in. */ setParameter(name: string, data: number | number[] | pc.Texture, passFlags?: number): void; /** * @function * @name pc.Material#deleteParameter * @description Deletes a shader parameter on a material. * @param {string} name - The name of the parameter to delete. */ deleteParameter(name: string): void; /** * @function * @name pc.Material#setParameters * @description Pushes all material parameters into scope. */ setParameters(): void; /** * @function * @name pc.Material#destroy * @description Removes this material from the scene and possibly frees up memory from its shaders (if there are no other materials using it). */ destroy(): void; /** * The flat color of the material (RGBA, where each component is 0 to 1). */ color: pc.Color; /** * The color map of the material (default is null). If specified, the color map is * modulated by the color property. */ colorMap: pc.Texture | null; } /** * @class * @name pc.Material * @classdesc A material determines how a particular mesh instance is rendered. It specifies the shader and render state that is * set before the mesh instance is submitted to the graphics device. * @description Create a new Material instance. * @property {number} alphaTest The alpha test reference value to control which fragments are written to the currently * active render target based on alpha value. All fragments with an alpha value of less than the alphaTest reference value * will be discarded. alphaTest defaults to 0 (all fragments pass). * @property {boolean} alphaToCoverage Enables or disables alpha to coverage (WebGL2 only). When enabled, and if hardware anti-aliasing is on, * limited order-independent transparency can be achieved. Quality depends on the number of MSAA samples of the current render target. * It can nicely soften edges of otherwise sharp alpha cutouts, but isn't recommended for large area semi-transparent surfaces. * Note, that you don't need to enable blending to make alpha to coverage work. It will work without it, just like alphaTest. * @property {boolean} alphaWrite If true, the alpha component of fragments generated by the shader of this material is written to * the color buffer of the currently active render target. If false, the alpha component will not be written. Defaults to true. * @property {number} blendType Controls how primitives are blended when being written to the currently active render target. * Can be: * * * {@link pc.BLEND_SUBTRACTIVE}: Subtract the color of the source fragment from the destination fragment and write the result to the frame buffer. * * {@link pc.BLEND_ADDITIVE}: Add the color of the source fragment to the destination fragment and write the result to the frame buffer. * * {@link pc.BLEND_NORMAL}: Enable simple translucency for materials such as glass. This is equivalent to enabling a source blend mode of pc.BLENDMODE_SRC_ALPHA and a destination blend mode of pc.BLENDMODE_ONE_MINUS_SRC_ALPHA. * * {@link pc.BLEND_NONE}: Disable blending. * * {@link pc.BLEND_PREMULTIPLIED}: Similar to pc.BLEND_NORMAL expect the source fragment is assumed to have already been multiplied by the source alpha value. * * {@link pc.BLEND_MULTIPLICATIVE}: Multiply the color of the source fragment by the color of the destination fragment and write the result to the frame buffer. * * {@link pc.BLEND_ADDITIVEALPHA}: Same as pc.BLEND_ADDITIVE except the source RGB is multiplied by the source alpha. * * Defaults to pc.BLEND_NONE. * @property {boolean} blueWrite If true, the blue component of fragments generated by the shader of this material is written to * the color buffer of the currently active render target. If false, the blue component will not be written. Defaults to true. * @property {number} cull Controls how triangles are culled based on their face direction with respect to the viewpoint. * Can be: * * * {@link pc.CULLFACE_NONE}: Do not cull triangles based on face direction. * * {@link pc.CULLFACE_BACK}: Cull the back faces of triangles (do not render triangles facing away from the view point). * * {@link pc.CULLFACE_FRONT}: Cull the front faces of triangles (do not render triangles facing towards the view point). * * {@link pc.CULLFACE_FRONTANDBACK}: Cull both front and back faces (triangles will not be rendered). * * Defaults to pc.CULLFACE_BACK. * @property {boolean} depthTest If true, fragments generated by the shader of this material are only written to the * current render target if they pass the depth test. If false, fragments generated by the shader of this material are * written to the current render target regardless of what is in the depth buffer. Defaults to true. * @property {boolean} depthWrite If true, fragments generated by the shader of this material write a depth value to * the depth buffer of the currently active render target. If false, no depth value is written. Defaults to true. * @property {boolean} greenWrite If true, the green component of fragments generated by the shader of this material is written to * the color buffer of the currently active render target. If false, the green component will not be written. Defaults to true. * @property {string} name The name of the material. * @property {boolean} redWrite If true, the red component of fragments generated by the shader of this material is written to * the color buffer of the currently active render target. If false, the red component will not be written. Defaults to true. * @property {pc.Shader|null} shader The shader used by this material to render mesh instances (default is null). * @property {pc.StencilParameters|null} stencilFront Stencil parameters for front faces (default is null). * @property {pc.StencilParameters|null} stencilBack Stencil parameters for back faces (default is null). * @property {number} depthBias Offsets the output depth buffer value. Useful for decals to prevent z-fighting. * @property {number} slopeDepthBias Same as {@link pc.Material#depthBias}, but also depends on the slope of the triangle relative to the camera. */ class Material { /** * @function * @name pc.Material#update * @description Applies any changes made to the material's properties. */ update(): void; /** * @function * @name pc.Material#getParameter * @description Retrieves the specified shader parameter from a material. * @param {string} name - The name of the parameter to query. * @returns {object} The named parameter. */ getParameter(name: string): any; /** * @function * @name pc.Material#setParameter * @description Sets a shader parameter on a material. * @param {string} name - The name of the parameter to set. * @param {number|number[]|pc.Texture} data - The value for the specified parameter. * @param {number} [passFlags] - Mask describing which passes the material should be included in. */ setParameter(name: string, data: number | number[] | pc.Texture, passFlags?: number): void; /** * @function * @name pc.Material#deleteParameter * @description Deletes a shader parameter on a material. * @param {string} name - The name of the parameter to delete. */ deleteParameter(name: string): void; /** * @function * @name pc.Material#setParameters * @description Pushes all material parameters into scope. */ setParameters(): void; /** * @function * @name pc.Material#destroy * @description Removes this material from the scene and possibly frees up memory from its shaders (if there are no other materials using it). */ destroy(): void; /** * The alpha test reference value to control which fragments are written to the currently active render target based on alpha value. All fragments with an alpha value of less than the alphaTest reference value will be discarded. alphaTest defaults to 0 (all fragments pass). */ alphaTest: number; /** * Enables or disables alpha to coverage (WebGL2 only). When enabled, and if hardware anti-aliasing is on, limited order-independent transparency can be achieved. Quality depends on the number of MSAA samples of the current render target. It can nicely soften edges of otherwise sharp alpha cutouts, but isn't recommended for large area semi-transparent surfaces. Note, that you don't need to enable blending to make alpha to coverage work. It will work without it, just like alphaTest. */ alphaToCoverage: boolean; /** * If true, the alpha component of fragments generated by the shader of this material is written to the color buffer of the currently active render target. If false, the alpha component will not be written. Defaults to true. */ alphaWrite: boolean; /** * Controls how primitives are blended when being written to the currently active render target. Can be: * {@link pc.BLEND_SUBTRACTIVE}: Subtract the color of the source fragment from the destination fragment and write the result to the frame buffer. * {@link pc.BLEND_ADDITIVE}: Add the color of the source fragment to the destination fragment and write the result to the frame buffer. * {@link pc.BLEND_NORMAL}: Enable simple translucency for materials such as glass. This is equivalent to enabling a source blend mode of pc.BLENDMODE_SRC_ALPHA and a destination blend mode of pc.BLENDMODE_ONE_MINUS_SRC_ALPHA. * {@link pc.BLEND_NONE}: Disable blending. * {@link pc.BLEND_PREMULTIPLIED}: Similar to pc.BLEND_NORMAL expect the source fragment is assumed to have already been multiplied by the source alpha value. * {@link pc.BLEND_MULTIPLICATIVE}: Multiply the color of the source fragment by the color of the destination fragment and write the result to the frame buffer. * {@link pc.BLEND_ADDITIVEALPHA}: Same as pc.BLEND_ADDITIVE except the source RGB is multiplied by the source alpha. Defaults to pc.BLEND_NONE. */ blendType: number; /** * If true, the blue component of fragments generated by the shader of this material is written to the color buffer of the currently active render target. If false, the blue component will not be written. Defaults to true. */ blueWrite: boolean; /** * Controls how triangles are culled based on their face direction with respect to the viewpoint. Can be: * {@link pc.CULLFACE_NONE}: Do not cull triangles based on face direction. * {@link pc.CULLFACE_BACK}: Cull the back faces of triangles (do not render triangles facing away from the view point). * {@link pc.CULLFACE_FRONT}: Cull the front faces of triangles (do not render triangles facing towards the view point). * {@link pc.CULLFACE_FRONTANDBACK}: Cull both front and back faces (triangles will not be rendered). Defaults to pc.CULLFACE_BACK. */ cull: number; /** * If true, fragments generated by the shader of this material are only written to the current render target if they pass the depth test. If false, fragments generated by the shader of this material are written to the current render target regardless of what is in the depth buffer. Defaults to true. */ depthTest: boolean; /** * If true, fragments generated by the shader of this material write a depth value to the depth buffer of the currently active render target. If false, no depth value is written. Defaults to true. */ depthWrite: boolean; /** * If true, the green component of fragments generated by the shader of this material is written to the color buffer of the currently active render target. If false, the green component will not be written. Defaults to true. */ greenWrite: boolean; /** * The name of the material. */ name: string; /** * If true, the red component of fragments generated by the shader of this material is written to the color buffer of the currently active render target. If false, the red component will not be written. Defaults to true. */ redWrite: boolean; /** * The shader used by this material to render mesh instances (default is null). */ shader: pc.Shader | null; /** * Stencil parameters for front faces (default is null). */ stencilFront: pc.StencilParameters | null; /** * Stencil parameters for back faces (default is null). */ stencilBack: pc.StencilParameters | null; /** * Offsets the output depth buffer value. Useful for decals to prevent z-fighting. */ depthBias: number; /** * Same as {@link pc.Material#depthBias}, but also depends on the slope of the triangle relative to the camera. */ slopeDepthBias: number; } /** * @class * @name pc.StandardMaterial * @augments pc.Material * @classdesc A Standard material is the main, general purpose material that is most often used for rendering. * It can approximate a wide variety of surface types and can simulate dynamic reflected light. * Most maps can use 3 types of input values in any combination: constant (color or number), mesh vertex colors and a texture. All enabled inputs are multiplied together. * * @property {pc.Color} ambient The ambient color of the material. This color value is 3-component (RGB), * where each component is between 0 and 1. * * @property {pc.Color} diffuse The diffuse color of the material. This color value is 3-component (RGB), * where each component is between 0 and 1. * Defines basic surface color (aka albedo). * @property {boolean} diffuseTint Multiply diffuse map and/or diffuse vertex color by the constant diffuse value. * @property {pc.Texture|null} diffuseMap The diffuse map of the material (default is null). * @property {number} diffuseMapUv Diffuse map UV channel. * @property {pc.Vec2} diffuseMapTiling Controls the 2D tiling of the diffuse map. * @property {pc.Vec2} diffuseMapOffset Controls the 2D offset of the diffuse map. Each component is between 0 and 1. * @property {string} diffuseMapChannel Color channels of the diffuse map to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * @property {boolean} diffuseVertexColor Use mesh vertex colors for diffuse. If diffuseMap or are diffuseTint are set, they'll be multiplied by vertex colors. * @property {string} diffuseVertexColorChannel Vertex color channels to use for diffuse. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * * @property {pc.Color} specular The specular color of the material. This color value is 3-component (RGB), * where each component is between 0 and 1. * Defines surface reflection/specular color. Affects specular intensity and tint. * @property {boolean} specularTint Multiply specular map and/or specular vertex color by the constant specular value. * @property {pc.Texture|null} specularMap The specular map of the material (default is null). * @property {number} specularMapUv Specular map UV channel. * @property {pc.Vec2} specularMapTiling Controls the 2D tiling of the specular map. * @property {pc.Vec2} specularMapOffset Controls the 2D offset of the specular map. Each component is between 0 and 1. * @property {string} specularMapChannel Color channels of the specular map to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * @property {boolean} specularVertexColor Use mesh vertex colors for specular. If specularMap or are specularTint are set, they'll be multiplied by vertex colors. * @property {string} specularVertexColorChannel Vertex color channels to use for specular. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * * @property {boolean} useMetalness Use metalness properties instead of specular. * When enabled, diffuse colors also affect specular instead of the dedicated specular map. * This can be used as alternative to specular color to save space. * With metaless == 0, the pixel is assumed to be dielectric, and diffuse color is used as normal. * With metaless == 1, the pixel is fully metallic, and diffuse color is used as specular color instead. * @property {number} metalness Defines how much the surface is metallic. From 0 (dielectric) to 1 (metal). * @property {pc.Texture|null} metalnessMap Monochrome metalness map (default is null). * @property {number} metalnessMapUv Metalness map UV channel. * @property {pc.Vec2} metalnessMapTiling Controls the 2D tiling of the metalness map. * @property {pc.Vec2} metalnessMapOffset Controls the 2D offset of the metalness map. Each component is between 0 and 1. * @property {string} metalnessMapChannel Color channel of the metalness map to use. Can be "r", "g", "b" or "a". * @property {boolean} metalnessVertexColor Use mesh vertex colors for metalness. If metalnessMap is set, it'll be multiplied by vertex colors. * @property {string} metalnessVertexColorChannel Vertex color channel to use for metalness. Can be "r", "g", "b" or "a". * * @property {number} shininess Defines glossiness of the material from 0 (rough) to 100 (shiny mirror). * A higher shininess value results in a more focused specular highlight. * Glossiness map/vertex colors are always multiplied by this value (normalized to 0 - 1 range), or it is used directly as constant output. * @property {pc.Texture|null} glossMap Glossiness map (default is null). If specified, will be multiplied by normalized 'shininess' value and/or vertex colors. * @property {number} glossMapUv Gloss map UV channel. * @property {string} glossMapChannel Color channel of the gloss map to use. Can be "r", "g", "b" or "a". * @property {pc.Vec2} glossMapTiling Controls the 2D tiling of the gloss map. * @property {pc.Vec2} glossMapOffset Controls the 2D offset of the gloss map. Each component is between 0 and 1. * @property {boolean} glossVertexColor Use mesh vertex colors for glossiness. If glossMap is set, it'll be multiplied by vertex colors. * @property {string} glossVertexColorChannel Vertex color channel to use for glossiness. Can be "r", "g", "b" or "a". * * @property {number} refraction Defines the visibility of refraction. Material can refract the same cube map as used for reflections. * @property {number} refractionIndex Defines the index of refraction, i.e. The amount of distortion. * The value is calculated as (outerIor / surfaceIor), where inputs are measured indices of refraction, the one around the object and the one of it's own surface. * In most situations outer medium is air, so outerIor will be approximately 1. Then you only need to do (1.0 / surfaceIor). * * @property {pc.Color} emissive The emissive color of the material. This color value is 3-component (RGB), * where each component is between 0 and 1. * @property {boolean} emissiveTint Multiply emissive map and/or emissive vertex color by the constant emissive value. * @property {pc.Texture|null} emissiveMap The emissive map of the material (default is null). Can be HDR. * @property {number} emissiveIntensity Emissive color multiplier. * @property {number} emissiveMapUv Emissive map UV channel. * @property {pc.Vec2} emissiveMapTiling Controls the 2D tiling of the emissive map. * @property {pc.Vec2} emissiveMapOffset Controls the 2D offset of the emissive map. Each component is between 0 and 1. * @property {string} emissiveMapChannel Color channels of the emissive map to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * @property {boolean} emissiveVertexColor Use mesh vertex colors for emission. If emissiveMap or emissiveTint are set, they'll be multiplied by vertex colors. * @property {string} emissiveVertexColorChannel Vertex color channels to use for emission. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * * @property {number} opacity The opacity of the material. This value can be between 0 and 1, where 0 is fully * transparent and 1 is fully opaque. If you want the material to be semi-transparent you also need to * set the {@link pc.Material#blendType} to pc.BLEND_NORMAL, pc.BLEND_ADDITIVE or any other mode. * Also note that for most semi-transparent objects you want {@link pc.Material#depthWrite} to be false, otherwise they can fully occlude objects behind them. * @property {pc.Texture|null} opacityMap The opacity map of the material (default is null). * @property {number} opacityMapUv Opacity map UV channel. * @property {string} opacityMapChannel Color channel of the opacity map to use. Can be "r", "g", "b" or "a". * @property {pc.Vec2} opacityMapTiling Controls the 2D tiling of the opacity map. * @property {pc.Vec2} opacityMapOffset Controls the 2D offset of the opacity map. Each component is between 0 and 1. * @property {boolean} opacityVertexColor Use mesh vertex colors for opacity. If opacityMap is set, it'll be multiplied by vertex colors. * @property {string} opacityVertexColorChannel Vertex color channels to use for opacity. Can be "r", "g", "b" or "a". * * @property {pc.Texture|null} normalMap The normal map of the material (default is null). * The texture must contains normalized, tangent space normals. * @property {number} normalMapUv Normal map UV channel. * @property {pc.Vec2} normalMapTiling Controls the 2D tiling of the normal map. * @property {pc.Vec2} normalMapOffset Controls the 2D offset of the normal map. Each component is between 0 and 1. * @property {number} bumpiness The bumpiness of the material. This value scales the assigned normal map. * It should be normally between 0 (no bump mapping) and 1 (full bump mapping), but can be set to e.g. 2 to give even more pronounced bump effect. * * @property {pc.Texture|null} heightMap The height map of the material (default is null). Used for a view-dependent parallax effect. * The texture must represent the height of the surface where darker pixels are lower and lighter pixels are higher. * It is recommended to use it together with a normal map. * @property {number} heightMapUv Height map UV channel. * @property {string} heightMapChannel Color channel of the height map to use. Can be "r", "g", "b" or "a". * @property {pc.Vec2} heightMapTiling Controls the 2D tiling of the height map. * @property {pc.Vec2} heightMapOffset Controls the 2D offset of the height map. Each component is between 0 and 1. * @property {number} heightMapFactor Height map multiplier. Affects the strength of the parallax effect. * * @property {pc.Texture|null} sphereMap The spherical environment map of the material (default is null). Affects reflections. * @property {pc.Texture|null} cubeMap The cubic environment map of the material (default is null). Overrides sphereMap. Affects reflections. If cubemap is prefiltered, will also affect ambient color. * @property {number} cubeMapProjection The type of projection applied to the cubeMap property: * * {@link pc.CUBEPROJ_NONE}: The cube map is treated as if it is infinitely far away. * * {@link pc.CUBEPROJ_BOX}: Box-projection based on a world space axis-aligned bounding box. * Defaults to pc.CUBEPROJ_NONE. * @property {pc.BoundingBox} cubeMapProjectionBox The world space axis-aligned bounding box defining the * box-projection used for the cubeMap property. Only used when cubeMapProjection is set to pc.CUBEPROJ_BOX. * @property {number} reflectivity Environment map intensity. * * @property {pc.Texture|null} lightMap A custom lightmap of the material (default is null). Lightmaps are textures that contain pre-rendered lighting. Can be HDR. * @property {number} lightMapUv Lightmap UV channel * @property {string} lightMapChannel Color channels of the lightmap to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * @property {pc.Vec2} lightMapTiling Controls the 2D tiling of the lightmap. * @property {pc.Vec2} lightMapOffset Controls the 2D offset of the lightmap. Each component is between 0 and 1. * @property {boolean} lightVertexColor Use baked vertex lighting. If lightMap is set, it'll be multiplied by vertex colors. * @property {string} lightVertexColorChannel Vertex color channels to use for baked lighting. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. * * @property {boolean} ambientTint Enables scene ambient multiplication by material ambient color. * @property {pc.Texture|null} aoMap Baked ambient occlusion (AO) map (default is null). Modulates ambient color. * @property {number} aoMapUv AO map UV channel * @property {string} aoMapChannel Color channel of the AO map to use. Can be "r", "g", "b" or "a". * @property {pc.Vec2} aoMapTiling Controls the 2D tiling of the AO map. * @property {pc.Vec2} aoMapOffset Controls the 2D offset of the AO map. Each component is between 0 and 1. * @property {boolean} aoVertexColor Use mesh vertex colors for AO. If aoMap is set, it'll be multiplied by vertex colors. * @property {string} aoVertexColorChannel Vertex color channels to use for AO. Can be "r", "g", "b" or "a". * @property {number} occludeSpecular Uses ambient occlusion to darken specular/reflection. It's a hack, because real specular occlusion is view-dependent. However, it can be better than nothing. * * {@link pc.SPECOCC_NONE}: No specular occlusion * * {@link pc.SPECOCC_AO}: Use AO directly to occlude specular. * * {@link pc.SPECOCC_GLOSSDEPENDENT}: Modify AO based on material glossiness/view angle to occlude specular. * @property {number} occludeSpecularIntensity Controls visibility of specular occlusion. * @property {number} occludeDirect Tells if AO should darken directional lighting. * * @property {boolean} specularAntialias Enables Toksvig AA for mipmapped normal maps with specular. * @property {boolean} conserveEnergy Defines how diffuse and specular components are combined when Fresnel is on. * It is recommended that you leave this option enabled, although you may want to disable it in case when all reflection comes only from a few light sources, and you don't use an environment map, therefore having mostly black reflection. * @property {number} shadingModel Defines the shading model. * * {@link pc.SPECULAR_PHONG}: Phong without energy conservation. You should only use it as a backwards compatibility with older projects. * * {@link pc.SPECULAR_BLINN}: Energy-conserving Blinn-Phong. * @property {number} fresnelModel Defines the formula used for Fresnel effect. * As a side-effect, enabling any Fresnel model changes the way diffuse and reflection components are combined. * When Fresnel is off, legacy non energy-conserving combining is used. When it is on, combining behaviour is defined by conserveEnergy parameter. * * {@link pc.FRESNEL_NONE}: No Fresnel. * * {@link pc.FRESNEL_SCHLICK}: Schlick's approximation of Fresnel (recommended). Parameterized by specular color. * @property {boolean} useFog Apply fogging (as configured in scene settings) * @property {boolean} useLighting Apply lighting * @property {boolean} useSkybox Apply scene skybox as prefiltered environment map * @property {boolean} useGammaTonemap Apply gamma correction and tonemapping (as configured in scene settings) * @property {boolean} pixelSnap Align vertices to pixel co-ordinates when rendering. Useful for pixel perfect 2D graphics * @property {boolean} twoSidedLighting Calculate proper normals (and therefore lighting) on backfaces * @property {object} chunks Object containing custom shader chunks that will replace default ones. * * @property {pc.callbacks.UpdateShader} onUpdateShader A custom function that will be called after all shader generator properties are collected and before shader code is generated. * This function will receive an object with shader generator settings (based on current material and scene properties), that you can change and then return. * Returned value will be used instead. This is mostly useful when rendering the same set of objects, but with different shader variations based on the same material. * For example, you may wish to render a depth or normal pass using textures assigned to the material, a reflection pass with simpler shaders and so on. * Properties of the object passed into this function are: * * pass: value of {@link pc.Layer#shaderPass} of the Layer being rendered. * * chunks: Object containing custom shader chunks that will replace default ones. * * customFragmentShader: Completely replace fragment shader with this code. * * forceUv1: if UV1 (second set of texture coordinates) is required in the shader. Will be declared as "vUv1" and passed to the fragment shader. * * fog: the type of fog being applied in the shader. See {@link pc.Scene#fog} for the list of possible values. * * gamma: the type of gamma correction being applied in the shader. See {@link pc.Scene#gammaCorrection} for the list of possible values. * * toneMap: the type of tone mapping being applied in the shader. See {@link pc.Scene#toneMapping} for the list of possible values. * * ambientTint: the value of {@link pc.StandardMaterial#ambientTint}. * * specularAntialias: the value of {@link pc.StandardMaterial#specularAntialias}. * * conserveEnergy: the value of {@link pc.StandardMaterial#conserveEnergy}. * * occludeSpecular: the value of {@link pc.StandardMaterial#occludeSpecular}. * * occludeDirect: the value of {@link pc.StandardMaterial#occludeDirect}. * * shadingModel: the value of {@link pc.StandardMaterial#shadingModel}. * * fresnelModel: the value of {@link pc.StandardMaterial#fresnelModel}. * * cubeMapProjection: the value of {@link pc.StandardMaterial#cubeMapProjection}. * * useMetalness: the value of {@link pc.StandardMaterial#useMetalness}. * * blendType: the value of {@link pc.Material#blendType}. * * twoSidedLighting: the value of {@link pc.Material#twoSidedLighting}. * * diffuseTint: defines if {@link pc.StandardMaterial#diffuse} constant should affect diffuse color. * * specularTint: defines if {@link pc.StandardMaterial#specular} constant should affect specular color. * * metalnessTint: defines if {@link pc.StandardMaterial#metalness} constant should affect metalness value. * * glossTint: defines if {@link pc.StandardMaterial#shininess} constant should affect glossiness value. * * emissiveTint: defines if {@link pc.StandardMaterial#emissive} constant should affect emission value. * * opacityTint: defines if {@link pc.StandardMaterial#opacity} constant should affect opacity value. * * occludeSpecularFloat: defines if {@link pc.StandardMaterial#occludeSpecularIntensity} constant should affect specular occlusion. * * alphaTest: enable alpha testing. See {@link pc.Material#alphaTest}. * * alphaToCoverage: enable alpha to coverage. See {@link pc.Material#alphaToCoverage}. * * sphereMap: if {@link pc.StandardMaterial#sphereMap} is used. * * cubeMap: if {@link pc.StandardMaterial#cubeMap} is used. * * dpAtlas: if dual-paraboloid reflection is used. Dual paraboloid reflections replace prefiltered cubemaps on certain platform (mostly Android) for performance reasons. * * ambientSH: if ambient spherical harmonics are used. Ambient SH replace prefiltered cubemap ambient on certain platform (mostly Android) for performance reasons. * * useSpecular: if any specular or reflections are needed at all. * * rgbmAmbient: if ambient cubemap or spherical harmonics are RGBM-encoded. * * hdrAmbient: if ambient cubemap or spherical harmonics are plain float HDR data. * * rgbmReflection: if reflection cubemap or dual paraboloid are RGBM-encoded. * * hdrReflection: if reflection cubemap or dual paraboloid are plain float HDR data. * * fixSeams: if cubemaps require seam fixing (see {@link pc.Texture#options.fixCubemapSeams}). * * prefilteredCubemap: if prefiltered cubemaps are used. * * emissiveFormat: how emissiveMap must be sampled. This value is based on {@link pc.Texture#options.rgbm} and {@link pc.Texture#options.format}. Possible values are: * * 0: sRGB texture * * 1: RGBM-encoded HDR texture * * 2: Simple read (no conversion from sRGB) * * lightMapFormat: how lightMap must be sampled. This value is based on {@link pc.Texture#options.rgbm} and {@link pc.Texture#options.format}. Possible values are: * * 0: sRGB texture * * 1: RGBM-encoded HDR texture * * 2: Simple read (no conversion from sRGB) * * useRgbm: if decodeRGBM() function is needed in the shader at all. * * packedNormal: if normal map contains X in RGB, Y in Alpha, and Z must be reconstructed. * * forceFragmentPrecision: Override fragment shader numeric precision. Can be "lowp", "mediump", "highp" or null to use default. * * fastTbn: Use slightly cheaper normal mapping code (skip tangent space normalization). Can look buggy sometimes. * * refraction: if refraction is used. * * skyboxIntensity: if reflected skybox intensity should be modulated. * * useTexCubeLod: if textureCubeLodEXT function should be used to read prefiltered cubemaps. Usually true of iOS, false on other devices due to quality/performance balance. * * useInstancing: if hardware instancing compatible shader should be generated. Transform is read from per-instance {@link pc.VertexBuffer} instead of shader's uniforms. * @example * // Create a new Standard material * var material = new pc.StandardMaterial(); * * // Update the material's diffuse and specular properties * material.diffuse.set(1, 0, 0); * material.specular.set(1, 1, 1); * * // Notify the material that it has been modified * material.update(); */ class StandardMaterial extends pc.Material { /** * @function * @name pc.StandardMaterial#clone * @description Duplicates a Standard material. All properties are duplicated except textures * where only the references are copied. * @returns {pc.StandardMaterial} A cloned Standard material. */ clone(): pc.StandardMaterial; /** * @function * @name pc.Material#update * @description Applies any changes made to the material's properties. */ update(): void; /** * @function * @name pc.Material#getParameter * @description Retrieves the specified shader parameter from a material. * @param {string} name - The name of the parameter to query. * @returns {object} The named parameter. */ getParameter(name: string): any; /** * @function * @name pc.Material#setParameter * @description Sets a shader parameter on a material. * @param {string} name - The name of the parameter to set. * @param {number|number[]|pc.Texture} data - The value for the specified parameter. * @param {number} [passFlags] - Mask describing which passes the material should be included in. */ setParameter(name: string, data: number | number[] | pc.Texture, passFlags?: number): void; /** * @function * @name pc.Material#deleteParameter * @description Deletes a shader parameter on a material. * @param {string} name - The name of the parameter to delete. */ deleteParameter(name: string): void; /** * @function * @name pc.Material#setParameters * @description Pushes all material parameters into scope. */ setParameters(): void; /** * @function * @name pc.Material#destroy * @description Removes this material from the scene and possibly frees up memory from its shaders (if there are no other materials using it). */ destroy(): void; /** * The ambient color of the material. This color value is 3-component (RGB), where each component is between 0 and 1. */ ambient: pc.Color; /** * The diffuse color of the material. This color value is 3-component (RGB), where each component is between 0 and 1. Defines basic surface color (aka albedo). */ diffuse: pc.Color; /** * Multiply diffuse map and/or diffuse vertex color by the constant diffuse value. */ diffuseTint: boolean; /** * The diffuse map of the material (default is null). */ diffuseMap: pc.Texture | null; /** * Diffuse map UV channel. */ diffuseMapUv: number; /** * Controls the 2D tiling of the diffuse map. */ diffuseMapTiling: pc.Vec2; /** * Controls the 2D offset of the diffuse map. Each component is between 0 and 1. */ diffuseMapOffset: pc.Vec2; /** * Color channels of the diffuse map to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ diffuseMapChannel: string; /** * Use mesh vertex colors for diffuse. If diffuseMap or are diffuseTint are set, they'll be multiplied by vertex colors. */ diffuseVertexColor: boolean; /** * Vertex color channels to use for diffuse. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ diffuseVertexColorChannel: string; /** * The specular color of the material. This color value is 3-component (RGB), where each component is between 0 and 1. Defines surface reflection/specular color. Affects specular intensity and tint. */ specular: pc.Color; /** * Multiply specular map and/or specular vertex color by the constant specular value. */ specularTint: boolean; /** * The specular map of the material (default is null). */ specularMap: pc.Texture | null; /** * Specular map UV channel. */ specularMapUv: number; /** * Controls the 2D tiling of the specular map. */ specularMapTiling: pc.Vec2; /** * Controls the 2D offset of the specular map. Each component is between 0 and 1. */ specularMapOffset: pc.Vec2; /** * Color channels of the specular map to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ specularMapChannel: string; /** * Use mesh vertex colors for specular. If specularMap or are specularTint are set, they'll be multiplied by vertex colors. */ specularVertexColor: boolean; /** * Vertex color channels to use for specular. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ specularVertexColorChannel: string; /** * Use metalness properties instead of specular. When enabled, diffuse colors also affect specular instead of the dedicated specular map. This can be used as alternative to specular color to save space. With metaless == 0, the pixel is assumed to be dielectric, and diffuse color is used as normal. With metaless == 1, the pixel is fully metallic, and diffuse color is used as specular color instead. */ useMetalness: boolean; /** * Defines how much the surface is metallic. From 0 (dielectric) to 1 (metal). */ metalness: number; /** * Monochrome metalness map (default is null). */ metalnessMap: pc.Texture | null; /** * Metalness map UV channel. */ metalnessMapUv: number; /** * Controls the 2D tiling of the metalness map. */ metalnessMapTiling: pc.Vec2; /** * Controls the 2D offset of the metalness map. Each component is between 0 and 1. */ metalnessMapOffset: pc.Vec2; /** * Color channel of the metalness map to use. Can be "r", "g", "b" or "a". */ metalnessMapChannel: string; /** * Use mesh vertex colors for metalness. If metalnessMap is set, it'll be multiplied by vertex colors. */ metalnessVertexColor: boolean; /** * Vertex color channel to use for metalness. Can be "r", "g", "b" or "a". */ metalnessVertexColorChannel: string; /** * Defines glossiness of the material from 0 (rough) to 100 (shiny mirror). A higher shininess value results in a more focused specular highlight. Glossiness map/vertex colors are always multiplied by this value (normalized to 0 - 1 range), or it is used directly as constant output. */ shininess: number; /** * Glossiness map (default is null). If specified, will be multiplied by normalized 'shininess' value and/or vertex colors. */ glossMap: pc.Texture | null; /** * Gloss map UV channel. */ glossMapUv: number; /** * Color channel of the gloss map to use. Can be "r", "g", "b" or "a". */ glossMapChannel: string; /** * Controls the 2D tiling of the gloss map. */ glossMapTiling: pc.Vec2; /** * Controls the 2D offset of the gloss map. Each component is between 0 and 1. */ glossMapOffset: pc.Vec2; /** * Use mesh vertex colors for glossiness. If glossMap is set, it'll be multiplied by vertex colors. */ glossVertexColor: boolean; /** * Vertex color channel to use for glossiness. Can be "r", "g", "b" or "a". */ glossVertexColorChannel: string; /** * Defines the visibility of refraction. Material can refract the same cube map as used for reflections. */ refraction: number; /** * Defines the index of refraction, i.e. The amount of distortion. The value is calculated as (outerIor / surfaceIor), where inputs are measured indices of refraction, the one around the object and the one of it's own surface. In most situations outer medium is air, so outerIor will be approximately 1. Then you only need to do (1.0 / surfaceIor). */ refractionIndex: number; /** * The emissive color of the material. This color value is 3-component (RGB), where each component is between 0 and 1. */ emissive: pc.Color; /** * Multiply emissive map and/or emissive vertex color by the constant emissive value. */ emissiveTint: boolean; /** * The emissive map of the material (default is null). Can be HDR. */ emissiveMap: pc.Texture | null; /** * Emissive color multiplier. */ emissiveIntensity: number; /** * Emissive map UV channel. */ emissiveMapUv: number; /** * Controls the 2D tiling of the emissive map. */ emissiveMapTiling: pc.Vec2; /** * Controls the 2D offset of the emissive map. Each component is between 0 and 1. */ emissiveMapOffset: pc.Vec2; /** * Color channels of the emissive map to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ emissiveMapChannel: string; /** * Use mesh vertex colors for emission. If emissiveMap or emissiveTint are set, they'll be multiplied by vertex colors. */ emissiveVertexColor: boolean; /** * Vertex color channels to use for emission. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ emissiveVertexColorChannel: string; /** * The opacity of the material. This value can be between 0 and 1, where 0 is fully transparent and 1 is fully opaque. If you want the material to be semi-transparent you also need to set the {@link pc.Material#blendType} to pc.BLEND_NORMAL, pc.BLEND_ADDITIVE or any other mode. Also note that for most semi-transparent objects you want {@link pc.Material#depthWrite} to be false, otherwise they can fully occlude objects behind them. */ opacity: number; /** * The opacity map of the material (default is null). */ opacityMap: pc.Texture | null; /** * Opacity map UV channel. */ opacityMapUv: number; /** * Color channel of the opacity map to use. Can be "r", "g", "b" or "a". */ opacityMapChannel: string; /** * Controls the 2D tiling of the opacity map. */ opacityMapTiling: pc.Vec2; /** * Controls the 2D offset of the opacity map. Each component is between 0 and 1. */ opacityMapOffset: pc.Vec2; /** * Use mesh vertex colors for opacity. If opacityMap is set, it'll be multiplied by vertex colors. */ opacityVertexColor: boolean; /** * Vertex color channels to use for opacity. Can be "r", "g", "b" or "a". */ opacityVertexColorChannel: string; /** * The normal map of the material (default is null). The texture must contains normalized, tangent space normals. */ normalMap: pc.Texture | null; /** * Normal map UV channel. */ normalMapUv: number; /** * Controls the 2D tiling of the normal map. */ normalMapTiling: pc.Vec2; /** * Controls the 2D offset of the normal map. Each component is between 0 and 1. */ normalMapOffset: pc.Vec2; /** * The bumpiness of the material. This value scales the assigned normal map. It should be normally between 0 (no bump mapping) and 1 (full bump mapping), but can be set to e.g. 2 to give even more pronounced bump effect. */ bumpiness: number; /** * The height map of the material (default is null). Used for a view-dependent parallax effect. The texture must represent the height of the surface where darker pixels are lower and lighter pixels are higher. It is recommended to use it together with a normal map. */ heightMap: pc.Texture | null; /** * Height map UV channel. */ heightMapUv: number; /** * Color channel of the height map to use. Can be "r", "g", "b" or "a". */ heightMapChannel: string; /** * Controls the 2D tiling of the height map. */ heightMapTiling: pc.Vec2; /** * Controls the 2D offset of the height map. Each component is between 0 and 1. */ heightMapOffset: pc.Vec2; /** * Height map multiplier. Affects the strength of the parallax effect. */ heightMapFactor: number; /** * The spherical environment map of the material (default is null). Affects reflections. */ sphereMap: pc.Texture | null; /** * The cubic environment map of the material (default is null). Overrides sphereMap. Affects reflections. If cubemap is prefiltered, will also affect ambient color. */ cubeMap: pc.Texture | null; /** * The type of projection applied to the cubeMap property: * {@link pc.CUBEPROJ_NONE}: The cube map is treated as if it is infinitely far away. * {@link pc.CUBEPROJ_BOX}: Box-projection based on a world space axis-aligned bounding box. Defaults to pc.CUBEPROJ_NONE. */ cubeMapProjection: number; /** * The world space axis-aligned bounding box defining the box-projection used for the cubeMap property. Only used when cubeMapProjection is set to pc.CUBEPROJ_BOX. */ cubeMapProjectionBox: pc.BoundingBox; /** * Environment map intensity. */ reflectivity: number; /** * A custom lightmap of the material (default is null). Lightmaps are textures that contain pre-rendered lighting. Can be HDR. */ lightMap: pc.Texture | null; /** * Lightmap UV channel */ lightMapUv: number; /** * Color channels of the lightmap to use. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ lightMapChannel: string; /** * Controls the 2D tiling of the lightmap. */ lightMapTiling: pc.Vec2; /** * Controls the 2D offset of the lightmap. Each component is between 0 and 1. */ lightMapOffset: pc.Vec2; /** * Use baked vertex lighting. If lightMap is set, it'll be multiplied by vertex colors. */ lightVertexColor: boolean; /** * Vertex color channels to use for baked lighting. Can be "r", "g", "b", "a", "rgb" or any swizzled combination. */ lightVertexColorChannel: string; /** * Enables scene ambient multiplication by material ambient color. */ ambientTint: boolean; /** * Baked ambient occlusion (AO) map (default is null). Modulates ambient color. */ aoMap: pc.Texture | null; /** * AO map UV channel */ aoMapUv: number; /** * Color channel of the AO map to use. Can be "r", "g", "b" or "a". */ aoMapChannel: string; /** * Controls the 2D tiling of the AO map. */ aoMapTiling: pc.Vec2; /** * Controls the 2D offset of the AO map. Each component is between 0 and 1. */ aoMapOffset: pc.Vec2; /** * Use mesh vertex colors for AO. If aoMap is set, it'll be multiplied by vertex colors. */ aoVertexColor: boolean; /** * Vertex color channels to use for AO. Can be "r", "g", "b" or "a". */ aoVertexColorChannel: string; /** * Uses ambient occlusion to darken specular/reflection. It's a hack, because real specular occlusion is view-dependent. However, it can be better than nothing. * {@link pc.SPECOCC_NONE}: No specular occlusion * {@link pc.SPECOCC_AO}: Use AO directly to occlude specular. * {@link pc.SPECOCC_GLOSSDEPENDENT}: Modify AO based on material glossiness/view angle to occlude specular. */ occludeSpecular: number; /** * Controls visibility of specular occlusion. */ occludeSpecularIntensity: number; /** * Tells if AO should darken directional lighting. */ occludeDirect: number; /** * Enables Toksvig AA for mipmapped normal maps with specular. */ specularAntialias: boolean; /** * Defines how diffuse and specular components are combined when Fresnel is on. It is recommended that you leave this option enabled, although you may want to disable it in case when all reflection comes only from a few light sources, and you don't use an environment map, therefore having mostly black reflection. */ conserveEnergy: boolean; /** * Defines the shading model. * {@link pc.SPECULAR_PHONG}: Phong without energy conservation. You should only use it as a backwards compatibility with older projects. * {@link pc.SPECULAR_BLINN}: Energy-conserving Blinn-Phong. */ shadingModel: number; /** * Defines the formula used for Fresnel effect. As a side-effect, enabling any Fresnel model changes the way diffuse and reflection components are combined. When Fresnel is off, legacy non energy-conserving combining is used. When it is on, combining behaviour is defined by conserveEnergy parameter. * {@link pc.FRESNEL_NONE}: No Fresnel. * {@link pc.FRESNEL_SCHLICK}: Schlick's approximation of Fresnel (recommended). Parameterized by specular color. */ fresnelModel: number; /** * Apply fogging (as configured in scene settings) */ useFog: boolean; /** * Apply lighting */ useLighting: boolean; /** * Apply scene skybox as prefiltered environment map */ useSkybox: boolean; /** * Apply gamma correction and tonemapping (as configured in scene settings) */ useGammaTonemap: boolean; /** * Align vertices to pixel co-ordinates when rendering. Useful for pixel perfect 2D graphics */ pixelSnap: boolean; /** * Calculate proper normals (and therefore lighting) on backfaces */ twoSidedLighting: boolean; /** * Object containing custom shader chunks that will replace default ones. */ chunks: any; /** * A custom function that will be called after all shader generator properties are collected and before shader code is generated. This function will receive an object with shader generator settings (based on current material and scene properties), that you can change and then return. Returned value will be used instead. This is mostly useful when rendering the same set of objects, but with different shader variations based on the same material. For example, you may wish to render a depth or normal pass using textures assigned to the material, a reflection pass with simpler shaders and so on. Properties of the object passed into this function are: * pass: value of {@link pc.Layer#shaderPass} of the Layer being rendered. * chunks: Object containing custom shader chunks that will replace default ones. * customFragmentShader: Completely replace fragment shader with this code. * forceUv1: if UV1 (second set of texture coordinates) is required in the shader. Will be declared as "vUv1" and passed to the fragment shader. * fog: the type of fog being applied in the shader. See {@link pc.Scene#fog} for the list of possible values. * gamma: the type of gamma correction being applied in the shader. See {@link pc.Scene#gammaCorrection} for the list of possible values. * toneMap: the type of tone mapping being applied in the shader. See {@link pc.Scene#toneMapping} for the list of possible values. * ambientTint: the value of {@link pc.StandardMaterial#ambientTint}. * specularAntialias: the value of {@link pc.StandardMaterial#specularAntialias}. * conserveEnergy: the value of {@link pc.StandardMaterial#conserveEnergy}. * occludeSpecular: the value of {@link pc.StandardMaterial#occludeSpecular}. * occludeDirect: the value of {@link pc.StandardMaterial#occludeDirect}. * shadingModel: the value of {@link pc.StandardMaterial#shadingModel}. * fresnelModel: the value of {@link pc.StandardMaterial#fresnelModel}. * cubeMapProjection: the value of {@link pc.StandardMaterial#cubeMapProjection}. * useMetalness: the value of {@link pc.StandardMaterial#useMetalness}. * blendType: the value of {@link pc.Material#blendType}. * twoSidedLighting: the value of {@link pc.Material#twoSidedLighting}. * diffuseTint: defines if {@link pc.StandardMaterial#diffuse} constant should affect diffuse color. * specularTint: defines if {@link pc.StandardMaterial#specular} constant should affect specular color. * metalnessTint: defines if {@link pc.StandardMaterial#metalness} constant should affect metalness value. * glossTint: defines if {@link pc.StandardMaterial#shininess} constant should affect glossiness value. * emissiveTint: defines if {@link pc.StandardMaterial#emissive} constant should affect emission value. * opacityTint: defines if {@link pc.StandardMaterial#opacity} constant should affect opacity value. * occludeSpecularFloat: defines if {@link pc.StandardMaterial#occludeSpecularIntensity} constant should affect specular occlusion. * alphaTest: enable alpha testing. See {@link pc.Material#alphaTest}. * alphaToCoverage: enable alpha to coverage. See {@link pc.Material#alphaToCoverage}. * sphereMap: if {@link pc.StandardMaterial#sphereMap} is used. * cubeMap: if {@link pc.StandardMaterial#cubeMap} is used. * dpAtlas: if dual-paraboloid reflection is used. Dual paraboloid reflections replace prefiltered cubemaps on certain platform (mostly Android) for performance reasons. * ambientSH: if ambient spherical harmonics are used. Ambient SH replace prefiltered cubemap ambient on certain platform (mostly Android) for performance reasons. * useSpecular: if any specular or reflections are needed at all. * rgbmAmbient: if ambient cubemap or spherical harmonics are RGBM-encoded. * hdrAmbient: if ambient cubemap or spherical harmonics are plain float HDR data. * rgbmReflection: if reflection cubemap or dual paraboloid are RGBM-encoded. * hdrReflection: if reflection cubemap or dual paraboloid are plain float HDR data. * fixSeams: if cubemaps require seam fixing (see {@link pc.Texture#options.fixCubemapSeams}). * prefilteredCubemap: if prefiltered cubemaps are used. * emissiveFormat: how emissiveMap must be sampled. This value is based on {@link pc.Texture#options.rgbm} and {@link pc.Texture#options.format}. Possible values are: * 0: sRGB texture * 1: RGBM-encoded HDR texture * 2: Simple read (no conversion from sRGB) * lightMapFormat: how lightMap must be sampled. This value is based on {@link pc.Texture#options.rgbm} and {@link pc.Texture#options.format}. Possible values are: * 0: sRGB texture * 1: RGBM-encoded HDR texture * 2: Simple read (no conversion from sRGB) * useRgbm: if decodeRGBM() function is needed in the shader at all. * packedNormal: if normal map contains X in RGB, Y in Alpha, and Z must be reconstructed. * forceFragmentPrecision: Override fragment shader numeric precision. Can be "lowp", "mediump", "highp" or null to use default. * fastTbn: Use slightly cheaper normal mapping code (skip tangent space normalization). Can look buggy sometimes. * refraction: if refraction is used. * skyboxIntensity: if reflected skybox intensity should be modulated. * useTexCubeLod: if textureCubeLodEXT function should be used to read prefiltered cubemaps. Usually true of iOS, false on other devices due to quality/performance balance. * useInstancing: if hardware instancing compatible shader should be generated. Transform is read from per-instance {@link pc.VertexBuffer} instead of shader's uniforms. */ onUpdateShader: pc.callbacks.UpdateShader; } /** * @class * @name pc.Mesh * @classdesc A graphical primitive. The mesh is defined by a {@link pc.VertexBuffer} and an optional * {@link pc.IndexBuffer}. It also contains a primitive definition which controls the type of the * primitive and the portion of the vertex or index buffer to use. * @description Create a new mesh. * @property {pc.VertexBuffer} vertexBuffer The vertex buffer holding the vertex data of the mesh. * @property {pc.IndexBuffer[]} indexBuffer An array of index buffers. For unindexed meshes, this array can * be empty. The first index buffer in the array is used by {@link pc.MeshInstance}s with a renderStyle * property set to pc.RENDERSTYLE_SOLID. The second index buffer in the array is used if renderStyle is * set to pc.RENDERSTYLE_WIREFRAME. * @property {object[]} primitive Array of primitive objects defining how vertex (and index) data in the * mesh should be interpreted by the graphics device. For details on the primitive object, see. * @property {number} primitive[].type The type of primitive to render. Can be: * * * {@link pc.PRIMITIVE_POINTS} * * {@link pc.PRIMITIVE_LINES} * * {@link pc.PRIMITIVE_LINELOOP} * * {@link pc.PRIMITIVE_LINESTRIP} * * {@link pc.PRIMITIVE_TRIANGLES} * * {@link pc.PRIMITIVE_TRISTRIP} * * {@link pc.PRIMITIVE_TRIFAN} * * @property {number} primitive[].base The offset of the first index or vertex to dispatch in the draw call. * @property {number} primitive[].count The number of indices or vertices to dispatch in the draw call. * @property {boolean} [primitive[].indexed] True to interpret the primitive as indexed, thereby using the currently set index buffer and false otherwise. * {@link pc.GraphicsDevice#draw}. The primitive is ordered based on render style like the indexBuffer property. * @property {pc.BoundingBox} aabb The axis-aligned bounding box for the object space vertices of this mesh. * @property {pc.Skin} [skin] The skin data (if any) that drives skinned mesh animations for this mesh. * @property {pc.Morph} [morph] The morph data (if any) that drives morph target animations for this mesh. */ class Mesh { /** * The vertex buffer holding the vertex data of the mesh. */ vertexBuffer: pc.VertexBuffer; /** * An array of index buffers. For unindexed meshes, this array can * be empty. The first index buffer in the array is used by {@link pc.MeshInstance}s with a renderStyle * property set to pc.RENDERSTYLE_SOLID. The second index buffer in the array is used if renderStyle is * set to pc.RENDERSTYLE_WIREFRAME. */ indexBuffer: pc.IndexBuffer[]; /** * Array of primitive objects defining how vertex (and index) data in the * mesh should be interpreted by the graphics device. For details on the primitive object, see. */ primitive: object[]; /** * The axis-aligned bounding box for the object space vertices of this mesh. */ aabb: pc.BoundingBox; /** * The skin data (if any) that drives skinned mesh animations for this mesh. */ skin?: pc.Skin; /** * The morph data (if any) that drives morph target animations for this mesh. */ morph?: pc.Morph; } /** * @class * @name pc.MeshInstance * @classdesc An instance of a {@link pc.Mesh}. A single mesh can be referenced by many * mesh instances that can have different transforms and materials. * @description Create a new mesh instance. * @param {pc.GraphNode} node - The graph node defining the transform for this instance. * @param {pc.Mesh} mesh - The graphics mesh being instanced. * @param {pc.Material} material - The material used to render this instance. * @property {pc.BoundingBox} aabb The world space axis-aligned bounding box for this * mesh instance. * @property {boolean} castShadow Controls whether the mesh instance casts shadows. * Defaults to false. * @property {boolean} visible Enable rendering for this mesh instance. Use visible property to enable/disable rendering without overhead of removing from scene. * But note that the mesh instance is still in the hierarchy and still in the draw call list. * @property {pc.GraphNode} node The graph node defining the transform for this instance. * @property {pc.Mesh} mesh The graphics mesh being instanced. * @property {pc.Material} material The material used by this mesh instance. * @property {number} renderStyle The render style of the mesh instance. Can be: * * * {@link pc.RENDERSTYLE_SOLID} * * {@link pc.RENDERSTYLE_WIREFRAME} * * {@link pc.RENDERSTYLE_POINTS} * * Defaults to pc.RENDERSTYLE_SOLID. * @property {boolean} cull Controls whether the mesh instance can be culled by with frustum culling ({@link pc.CameraComponent#frustumCulling}). * @property {number} drawOrder Use this value to affect rendering order of mesh instances. * Only used when mesh instances are added to a {@link pc.Layer} with {@link pc.Layer#opaqueSortMode} or {@link pc.Layer#transparentSortMode} (depending on the material) set to {@link pc.SORTMODE_MANUAL}. * @property {pc.callbacks.CalculateSortDistance} calculateSortDistance In some circumstances mesh instances are sorted by a distance calculation to determine their rendering order. * Set this callback to override the default distance calculation, which gives the dot product of the camera forward vector and the vector between the camera position and * the center of the mesh instance's axis-aligned bounding box. This option can be particularly useful for rendering transparent meshes in a better order than default. * @property {boolean} visibleThisFrame Read this value in {@link pc.Layer#onPostCull} to determine if the object is actually going to be rendered. * @example * // Create a mesh instance pointing to a 1x1x1 'cube' mesh * var mesh = pc.createBox(graphicsDevice); * var material = new pc.StandardMaterial(); * var node = new pc.GraphNode(); * var meshInstance = new pc.MeshInstance(node, mesh, material); */ class MeshInstance { constructor(node: pc.GraphNode, mesh: pc.Mesh, material: pc.Material); /** * @name pc.MeshInstance#mask * @type {number} * @description Mask controlling which {@link pc.LightComponent}s light this mesh instance, which {@link pc.CameraComponent} sees it and in which {@link pc.Layer} it is rendered. * Defaults to 1. */ mask: number; /** * @name pc.MeshInstance#instancingCount * @type {number} * @description Number of instances when using hardware instancing to render the mesh. */ instancingCount: number; /** * @function * @name pc.MeshInstance#setInstancing * @description Sets up {@link pc.MeshInstance} to be rendered using Hardware Instancing. * @param {pc.VertexBuffer|null} vertexBuffer - Vertex buffer to hold per-instance vertex data (usually world matrices). * Pass null to turn off hardware instancing. */ setInstancing(vertexBuffer: pc.VertexBuffer | null): void; /** * The world space axis-aligned bounding box for this * mesh instance. */ aabb: pc.BoundingBox; /** * Controls whether the mesh instance casts shadows. * Defaults to false. */ castShadow: boolean; /** * Enable rendering for this mesh instance. Use visible property to enable/disable rendering without overhead of removing from scene. * But note that the mesh instance is still in the hierarchy and still in the draw call list. */ visible: boolean; /** * The graph node defining the transform for this instance. */ node: pc.GraphNode; /** * The graphics mesh being instanced. */ mesh: pc.Mesh; /** * The material used by this mesh instance. */ material: pc.Material; /** * The render style of the mesh instance. Can be: * * {@link pc.RENDERSTYLE_SOLID} * * {@link pc.RENDERSTYLE_WIREFRAME} * * {@link pc.RENDERSTYLE_POINTS} * Defaults to pc.RENDERSTYLE_SOLID. */ renderStyle: number; /** * Controls whether the mesh instance can be culled by with frustum culling ({@link pc.CameraComponent#frustumCulling}). */ cull: boolean; /** * Use this value to affect rendering order of mesh instances. * Only used when mesh instances are added to a {@link pc.Layer} with {@link pc.Layer#opaqueSortMode} or {@link pc.Layer#transparentSortMode} (depending on the material) set to {@link pc.SORTMODE_MANUAL}. */ drawOrder: number; /** * In some circumstances mesh instances are sorted by a distance calculation to determine their rendering order. * Set this callback to override the default distance calculation, which gives the dot product of the camera forward vector and the vector between the camera position and * the center of the mesh instance's axis-aligned bounding box. This option can be particularly useful for rendering transparent meshes in a better order than default. */ calculateSortDistance: pc.callbacks.CalculateSortDistance; /** * Read this value in {@link pc.Layer#onPostCull} to determine if the object is actually going to be rendered. */ visibleThisFrame: boolean; } /** * @class * @name pc.Model * @classdesc A model is a graphical object that can be added to or removed from a scene. * It contains a hierarchy and any number of mesh instances. * @description Creates a new model. * @example * // Create a new model * var model = new pc.Model(); * @property {pc.GraphNode} graph The root node of the model's graph node hierarchy. * @property {pc.MeshInstance[]} meshInstances An array of MeshInstances contained in this model. * @property {pc.SkinInstance[]} skinInstances An array of SkinInstances contained in this model. * @property {pc.MorphInstance[]} morphInstances An array of MorphInstances contained in this model. */ class Model { /** * @function * @name pc.Model#clone * @description Clones a model. The returned model has a newly created hierarchy * and mesh instances, but meshes are shared between the clone and the specified * model. * @returns {pc.Model} A clone of the specified model. * @example * var clonedModel = model.clone(); */ clone(): pc.Model; /** * @function * @name pc.Model#destroy * @description Destroys skinning texture and possibly deletes vertex/index buffers of a model. * Mesh is reference-counted, so buffers are only deleted if all models with referencing mesh instances were deleted. * That means all in-scene models + the "base" one (asset.resource) which is created when the model is parsed. * It is recommended to use asset.unload() instead, which will also remove the model from the scene. */ destroy(): void; /** * @function * @name pc.Model#generateWireframe * @description Generates the necessary internal data for a model to be * renderable as wireframe. Once this function has been called, any mesh * instance in the model can have its renderStyle property set to * pc.RENDERSTYLE_WIREFRAME. * @example * model.generateWireframe(); * for (var i = 0; i < model.meshInstances.length; i++) { * model.meshInstances[i].renderStyle = pc.RENDERSTYLE_WIREFRAME; * } */ generateWireframe(): void; /** * The root node of the model's graph node hierarchy. */ graph: pc.GraphNode; /** * An array of MeshInstances contained in this model. */ meshInstances: pc.MeshInstance[]; /** * An array of SkinInstances contained in this model. */ skinInstances: pc.SkinInstance[]; /** * An array of MorphInstances contained in this model. */ morphInstances: pc.MorphInstance[]; } /** * @class * @name pc.MorphTarget * @classdesc A Morph Target (also known as Blend Shape) contains deformation data to apply to existing mesh. * Multiple morph targets can be blended together on a mesh. This is useful for effects that are hard to achieve with conventional animation and skinning. * @param {object} options - Object for passing optional arguments. * @param {number[]} options.deltaPositions - An array of 3-dimensional vertex position offsets. * @param {number[]} [options.deltaNormals] - An array of 3-dimensional vertex normal offsets. * @param {number[]} [options.deltaTangents] - An array of 4-dimensional vertex normal tangents. * @param {number[]} [options.indices] - A morph target doesn't have to contain a full copy of the original mesh with added deformations. * Instead, only deformed vertices can be stored. This array contains indices to the original mesh's vertices and must be of the same size * as other arrays. * @param {string} [options.name] - Name. * @param {pc.BoundingBox} [options.aabb] - Bounding box. Will be automatically generated, if undefined. */ class MorphTarget { constructor(options: { deltaPositions: number[]; deltaNormals?: number[]; deltaTangents?: number[]; indices?: number[]; name?: string; aabb?: pc.BoundingBox; }); } /** * @class * @name pc.Morph * @classdesc Contains a list of pc.MorphTarget, a combined AABB and some associated data. * @param {pc.MorphTarget[]} targets - A list of morph targets. */ class Morph { constructor(targets: pc.MorphTarget[]); /** * @function * @name pc.Morph#addTarget * @description Adds a new morph target to the list. * @param {pc.MorphTarget} target - A new morph target. */ addTarget(target: pc.MorphTarget): void; /** * @function * @name pc.Morph#removeTarget * @description Remove the specified morph target from the list. * @param {pc.MorphTarget} target - A morph target to delete. */ removeTarget(target: pc.MorphTarget): void; /** * @function * @name pc.Morph#getTarget * @description Gets the morph target by index. * @param {number} index - An index of morph target. * @returns {pc.MorphTarget} A morph target object. */ getTarget(index: number): pc.MorphTarget; } /** * @class * @name pc.MorphInstance * @classdesc An instance of pc.Morph. Contains weights to assign to every pc.MorphTarget, holds morphed buffer and associated data. * @param {pc.Morph} morph - The pc.Morph to instance. */ class MorphInstance { constructor(morph: pc.Morph); /** * @function * @name pc.MorphInstance#destroy * @description Frees video memory allocated by this object. */ destroy(): void; /** * @function * @name pc.MorphInstance#getWeight * @description Gets current weight of the specified morph target. * @param {number} index - An index of morph target. * @returns {number} Weight. */ getWeight(index: number): number; /** * @function * @name pc.MorphInstance#setWeight * @description Sets weight of the specified morph target. * @param {number} index - An index of morph target. * @param {number} weight - Weight. */ setWeight(index: number, weight: number): void; /** * @function * @name pc.MorphInstance#updateBounds * @param {pc.Mesh} mesh - Base mesh for the morph. * @description Calculates AABB for this morph instance. Called automatically by renderer. */ updateBounds(mesh: pc.Mesh): void; /** * @function * @name pc.MorphInstance#update * @param {pc.Mesh} mesh - Base mesh for the morph. * @description Performs morphing. Called automatically by renderer. */ update(mesh: pc.Mesh): void; } /** * @class * @name pc.Picker * @classdesc Picker object used to select mesh instances from screen coordinates. * @description Create a new instance of a Picker object. * @param {pc.Application} app - The application managing this picker instance. * @param {number} width - The width of the pick buffer in pixels. * @param {number} height - The height of the pick buffer in pixels. * @property {number} width Width of the pick buffer in pixels (read-only). * @property {number} height Height of the pick buffer in pixels (read-only). * @property {pc.RenderTarget} renderTarget The render target used by the picker internally (read-only). */ class Picker { constructor(app: pc.Application, width: number, height: number); /** * @function * @name pc.Picker#getSelection * @description Return the list of mesh instances selected by the specified rectangle in the * previously prepared pick buffer.The rectangle using top-left coordinate system. * @param {number} x - The left edge of the rectangle. * @param {number} y - The top edge of the rectangle. * @param {number} [width] - The width of the rectangle. * @param {number} [height] - The height of the rectangle. * @returns {pc.MeshInstance[]} An array of mesh instances that are in the selection. * @example * // Get the selection at the point (10,20) * var selection = picker.getSelection(10, 20); * @example * // Get all models in rectangle with corners at (10,20) and (20,40) * var selection = picker.getSelection(10, 20, 10, 20); */ getSelection(x: number, y: number, width?: number, height?: number): pc.MeshInstance[]; /** * @function * @name pc.Picker#prepare * @description Primes the pick buffer with a rendering of the specified models from the point of view * of the supplied camera. Once the pick buffer has been prepared, pc.Picker#getSelection can be * called multiple times on the same picker object. Therefore, if the models or camera do not change * in any way, pc.Picker#prepare does not need to be called again. * @param {pc.CameraComponent} camera - The camera component used to render the scene. * @param {pc.Scene} scene - The scene containing the pickable mesh instances. * @param {pc.Layer|pc.RenderTarget} [arg] - Layer or RenderTarget from which objects will be picked. If not supplied, all layers rendering to backbuffer before this layer will be used. */ prepare(camera: pc.CameraComponent, scene: pc.Scene, arg?: pc.Layer | pc.RenderTarget): void; /** * @function * @name pc.Picker#resize * @description Sets the resolution of the pick buffer. The pick buffer resolution does not need * to match the resolution of the corresponding frame buffer use for general rendering of the * 3D scene. However, the lower the resolution of the pick buffer, the less accurate the selection * results returned by pc.Picker#getSelection. On the other hand, smaller pick buffers will * yield greater performance, so there is a trade off. * @param {number} width - The width of the pick buffer in pixels. * @param {number} height - The height of the pick buffer in pixels. */ resize(width: number, height: number): void; /** * Width of the pick buffer in pixels (read-only). */ width: number; /** * Height of the pick buffer in pixels (read-only). */ height: number; /** * The render target used by the picker internally (read-only). */ renderTarget: pc.RenderTarget; } /** * @function * @name pc.calculateNormals * @description Generates normal information from the specified positions and * triangle indices. See {@link pc.createMesh}. * @param {number[]} positions - An array of 3-dimensional vertex positions. * @param {number[]} indices - An array of triangle indices. * @returns {number[]} An array of 3-dimensional vertex normals. * @example * var normals = pc.calculateNormals(positions, indices); * var tangents = pc.calculateTangents(positions, normals, uvs, indices); * var mesh = pc.createMesh(positions, normals, tangents, uvs, indices); */ function calculateNormals(positions: number[], indices: number[]): number[]; /** * @function * @name pc.calculateTangents * @description Generates tangent information from the specified positions, * normals, texture coordinates and triangle indices. See {@link pc.createMesh}. * @param {number[]} positions - An array of 3-dimensional vertex positions. * @param {number[]} normals - An array of 3-dimensional vertex normals. * @param {number[]} uvs - An array of 2-dimensional vertex texture coordinates. * @param {number[]} indices - An array of triangle indices. * @returns {number[]} An array of 3-dimensional vertex tangents. * @example * var tangents = pc.calculateTangents(positions, normals, uvs, indices); * var mesh = pc.createMesh(positions, normals, tangents, uvs, indices); */ function calculateTangents(positions: number[], normals: number[], uvs: number[], indices: number[]): number[]; /** * @function * @name pc.createMesh * @description Creates a new mesh object from the supplied vertex information and topology. * @param {pc.GraphicsDevice} device - The graphics device used to manage the mesh. * @param {number[]} positions - An array of 3-dimensional vertex positions. * @param {object} [opts] - An object that specifies optional inputs for the function as follows: * @param {number[]} [opts.normals] - An array of 3-dimensional vertex normals. * @param {number[]} [opts.tangents] - An array of 3-dimensional vertex tangents. * @param {number[]} [opts.colors] - An array of 4-dimensional vertex colors. * @param {number[]} [opts.uvs] - An array of 2-dimensional vertex texture coordinates. * @param {number[]} [opts.uvs1] - Same as opts.uvs, but for additional UV set * @param {number[]} [opts.indices] - An array of triangle indices. * @returns {pc.Mesh} A new Geometry constructed from the supplied vertex and triangle data. * @example * // Create a new mesh supplying optional parameters using object literal notation * var mesh = pc.createMesh( * graphicsDevice, * positions, * { * normals: treeNormals, * uvs: treeUvs, * indices: treeIndices * }); */ function createMesh(device: pc.GraphicsDevice, positions: number[], opts?: { normals?: number[]; tangents?: number[]; colors?: number[]; uvs?: number[]; uvs1?: number[]; indices?: number[]; }): pc.Mesh; /** * @function * @name pc.createTorus * @description Creates a procedural torus-shaped mesh. * * The size, shape and tesselation properties of the torus can be controlled via function parameters. * By default, the function will create a torus in the XZ-plane with a tube radius of 0.2, a ring radius * of 0.3, 20 segments and 30 sides. * * Note that the torus is created with UVs in the range of 0 to 1. Additionally, tangent information * is generated into the vertex buffer of the torus's mesh. * @param {pc.GraphicsDevice} device - The graphics device used to manage the mesh. * @param {object} [opts] - An object that specifies optional inputs for the function as follows: * @param {number} [opts.tubeRadius] - The radius of the tube forming the body of the torus (defaults to 0.2). * @param {number} [opts.ringRadius] - The radius from the centre of the torus to the centre of the tube (defaults to 0.3). * @param {number} [opts.segments] - The number of radial divisions forming cross-sections of the torus ring (defaults to 20). * @param {number} [opts.sides] - The number of divisions around the tubular body of the torus ring (defaults to 30). * @returns {pc.Mesh} A new torus-shaped mesh. */ function createTorus(device: pc.GraphicsDevice, opts?: { tubeRadius?: number; ringRadius?: number; segments?: number; sides?: number; }): pc.Mesh; /** * @function * @name pc.createCylinder * @description Creates a procedural cylinder-shaped mesh. * * The size, shape and tesselation properties of the cylinder can be controlled via function parameters. * By default, the function will create a cylinder standing vertically centred on the XZ-plane with a radius * of 0.5, a height of 1.0, 1 height segment and 20 cap segments. * * Note that the cylinder is created with UVs in the range of 0 to 1. Additionally, tangent information * is generated into the vertex buffer of the cylinder's mesh. * @param {pc.GraphicsDevice} device - The graphics device used to manage the mesh. * @param {object} [opts] - An object that specifies optional inputs for the function as follows: * @param {number} [opts.radius] - The radius of the tube forming the body of the cylinder (defaults to 0.5). * @param {number} [opts.height] - The length of the body of the cylinder (defaults to 1.0). * @param {number} [opts.heightSegments] - The number of divisions along the length of the cylinder (defaults to 5). * @param {number} [opts.capSegments] - The number of divisions around the tubular body of the cylinder (defaults to 20). * @returns {pc.Mesh} A new cylinder-shaped mesh. */ function createCylinder(device: pc.GraphicsDevice, opts?: { radius?: number; height?: number; heightSegments?: number; capSegments?: number; }): pc.Mesh; /** * @function * @name pc.createCapsule * @description Creates a procedural capsule-shaped mesh. * * The size, shape and tesselation properties of the capsule can be controlled via function * parameters. By default, the function will create a capsule standing vertically centred * on the XZ-plane with a radius of 0.25, a height of 1.0, 1 height segment and 10 cap * segments. * * Note that the capsule is created with UVs in the range of 0 to 1. Additionally, tangent information * is generated into the vertex buffer of the capsule's mesh. * @param {pc.GraphicsDevice} device - The graphics device used to manage the mesh. * @param {object} [opts] - An object that specifies optional inputs for the function as follows: * @param {number} [opts.radius] - The radius of the tube forming the body of the capsule (defaults to 0.3). * @param {number} [opts.height] - The length of the body of the capsule from tip to tip (defaults to 1.0). * @param {number} [opts.heightSegments] - The number of divisions along the tubular length of the capsule (defaults to 1). * @param {number} [opts.sides] - The number of divisions around the tubular body of the capsule (defaults to 20). * @returns {pc.Mesh} A new cylinder-shaped mesh. */ function createCapsule(device: pc.GraphicsDevice, opts?: { radius?: number; height?: number; heightSegments?: number; sides?: number; }): pc.Mesh; /** * @function * @name pc.createCone * @description Creates a procedural cone-shaped mesh. * * The size, shape and tesselation properties of the cone can be controlled via function * parameters. By default, the function will create a cone standing vertically centred * on the XZ-plane with a base radius of 0.5, a height of 1.0, 5 height segments and 20 * cap segments. * * Note that the cone is created with UVs in the range of 0 to 1. Additionally, tangent * information is generated into the vertex buffer of the cone's mesh. * @param {pc.GraphicsDevice} device - The graphics device used to manage the mesh. * @param {object} [opts] - An object that specifies optional inputs for the function as follows: * @param {number} [opts.baseRadius] - The base radius of the cone (defaults to 0.5). * @param {number} [opts.peakRadius] - The peak radius of the cone (defaults to 0.0). * @param {number} [opts.height] - The length of the body of the cone (defaults to 1.0). * @param {number} [opts.heightSegments] - The number of divisions along the length of the cone (defaults to 5). * @param {number} [opts.capSegments] - The number of divisions around the tubular body of the cone (defaults to 18). * @returns {pc.Mesh} A new cone-shaped mesh. */ function createCone(device: pc.GraphicsDevice, opts?: { baseRadius?: number; peakRadius?: number; height?: number; heightSegments?: number; capSegments?: number; }): pc.Mesh; /** * @function * @name pc.createSphere * @description Creates a procedural sphere-shaped mesh. * * The size and tesselation properties of the sphere can be controlled via function * parameters. By default, the function will create a sphere centred on the object * space origin with a radius of 0.5 and 16 segments in both longitude and latitude. * * Note that the sphere is created with UVs in the range of 0 to 1. Additionally, tangent * information is generated into the vertex buffer of the sphere's mesh. * @param {pc.GraphicsDevice} device - The graphics device used to manage the mesh. * @param {object} [opts] - An object that specifies optional inputs for the function as follows: * @param {number} [opts.radius] - The radius of the sphere (defaults to 0.5). * @param {number} [opts.segments] - The number of divisions along the longitudinal * and latitudinal axes of the sphere (defaults to 16). * @returns {pc.Mesh} A new sphere-shaped mesh. */ function createSphere(device: pc.GraphicsDevice, opts?: { radius?: number; segments?: number; }): pc.Mesh; /** * @function * @name pc.createPlane * @description Creates a procedural plane-shaped mesh. * * The size and tesselation properties of the plane can be controlled via function * parameters. By default, the function will create a plane centred on the object * space origin with a width and length of 1.0 and 5 segments in either axis (50 * triangles). The normal vector of the plane is aligned along the positive Y axis. * * Note that the plane is created with UVs in the range of 0 to 1. Additionally, tangent * information is generated into the vertex buffer of the plane's mesh. * @param {pc.GraphicsDevice} device - The graphics device used to manage the mesh. * @param {object} [opts] - An object that specifies optional inputs for the function as follows: * @param {pc.Vec2} [opts.halfExtents] - The half dimensions of the plane in the X and Z axes (defaults to [0.5, 0.5]). * @param {number} [opts.widthSegments] - The number of divisions along the X axis of the plane (defaults to 5). * @param {number} [opts.lengthSegments] - The number of divisions along the Z axis of the plane (defaults to 5). * @returns {pc.Mesh} A new plane-shaped mesh. */ function createPlane(device: pc.GraphicsDevice, opts?: { halfExtents?: pc.Vec2; widthSegments?: number; lengthSegments?: number; }): pc.Mesh; /** * @function * @name pc.createBox * @description Creates a procedural box-shaped mesh. * * The size, shape and tesselation properties of the box can be controlled via function parameters. By * default, the function will create a box centred on the object space origin with a width, length and * height of 1.0 unit and 10 segments in either axis (50 triangles per face). * * Note that the box is created with UVs in the range of 0 to 1 on each face. Additionally, tangent * information is generated into the vertex buffer of the box's mesh. * @param {pc.GraphicsDevice} device - The graphics device used to manage the mesh. * @param {object} [opts] - An object that specifies optional inputs for the function as follows: * @param {pc.Vec3} [opts.halfExtents] - The half dimensions of the box in each axis (defaults to [0.5, 0.5, 0.5]). * @param {number} [opts.widthSegments] - The number of divisions along the X axis of the box (defaults to 1). * @param {number} [opts.lengthSegments] - The number of divisions along the Z axis of the box (defaults to 1). * @param {number} [opts.heightSegments] - The number of divisions along the Y axis of the box (defaults to 1). * @returns {pc.Mesh} A new box-shaped mesh. */ function createBox(device: pc.GraphicsDevice, opts?: { halfExtents?: pc.Vec3; widthSegments?: number; lengthSegments?: number; heightSegments?: number; }): pc.Mesh; /** * @constant * @name pc.BLEND_SUBTRACTIVE * @type {number} * @description Subtract the color of the source fragment from the destination fragment * and write the result to the frame buffer. */ const BLEND_SUBTRACTIVE: number; /** * @constant * @name pc.BLEND_ADDITIVE * @type {number} * @description Add the color of the source fragment to the destination fragment * and write the result to the frame buffer. */ const BLEND_ADDITIVE: number; /** * @constant * @name pc.BLEND_NORMAL * @type {number} * @description Enable simple translucency for materials such as glass. This is * equivalent to enabling a source blend mode of pc.BLENDMODE_SRC_ALPHA and a destination * blend mode of pc.BLENDMODE_ONE_MINUS_SRC_ALPHA. */ const BLEND_NORMAL: number; /** * @constant * @name pc.BLEND_NONE * @type {number} * @description Disable blending. */ const BLEND_NONE: number; /** * @constant * @name pc.BLEND_PREMULTIPLIED * @type {number} * @description Similar to pc.BLEND_NORMAL expect the source fragment is assumed to have * already been multiplied by the source alpha value. */ const BLEND_PREMULTIPLIED: number; /** * @constant * @name pc.BLEND_MULTIPLICATIVE * @type {number} * @description Multiply the color of the source fragment by the color of the destination * fragment and write the result to the frame buffer. */ const BLEND_MULTIPLICATIVE: number; /** * @constant * @name pc.BLEND_ADDITIVEALPHA * @type {number} * @description Same as pc.BLEND_ADDITIVE except the source RGB is multiplied by the source alpha. */ const BLEND_ADDITIVEALPHA: number; /** * @constant * @name pc.BLEND_MULTIPLICATIVE2X * @type {number} * @description Multiplies colors and doubles the result. */ const BLEND_MULTIPLICATIVE2X: number; /** * @constant * @name pc.BLEND_SCREEN * @type {number} * @description Softer version of additive. */ const BLEND_SCREEN: number; /** * @constant * @name pc.BLEND_MIN * @type {number} * @description Minimum color. Check app.graphicsDevice.extBlendMinmax for support. */ const BLEND_MIN: number; /** * @constant * @name pc.BLEND_MAX * @type {number} * @description Maximum color. Check app.graphicsDevice.extBlendMinmax for support. */ const BLEND_MAX: number; /** * @constant * @name pc.FOG_NONE * @type {string} * @description No fog is applied to the scene. */ const FOG_NONE: string; /** * @constant * @name pc.FOG_LINEAR * @type {string} * @description Fog rises linearly from zero to 1 between a start and end depth. */ const FOG_LINEAR: string; /** * @constant * @name pc.FOG_EXP * @type {string} * @description Fog rises according to an exponential curve controlled by a density value. */ const FOG_EXP: string; /** * @constant * @name pc.FOG_EXP2 * @type {string} * @description Fog rises according to an exponential curve controlled by a density value. */ const FOG_EXP2: string; /** * @constant * @name pc.FRESNEL_NONE * @type {number} * @description No Fresnel. */ const FRESNEL_NONE: number; /** * @constant * @name pc.FRESNEL_SCHLICK * @type {number} * @description Schlick's approximation of Fresnel. */ const FRESNEL_SCHLICK: number; /** * @constant * @name pc.LAYERID_WORLD * @type {number} * @description The world layer. */ const LAYERID_WORLD: number; /** * @constant * @name pc.LAYERID_DEPTH * @type {number} * @description The depth layer. */ const LAYERID_DEPTH: number; /** * @constant * @name pc.LAYERID_SKYBOX * @type {number} * @description The skybox layer. */ const LAYERID_SKYBOX: number; /** * @constant * @name pc.LAYERID_IMMEDIATE * @type {number} * @description The immediate layer. */ const LAYERID_IMMEDIATE: number; /** * @constant * @name pc.LAYERID_UI * @type {number} * @description The UI layer. */ const LAYERID_UI: number; /** * @constant * @name pc.LIGHTTYPE_DIRECTIONAL * @type {number} * @description Directional (global) light source. */ const LIGHTTYPE_DIRECTIONAL: number; /** * @constant * @name pc.LIGHTTYPE_POINT * @type {number} * @description Point (local) light source. */ const LIGHTTYPE_POINT: number; /** * @constant * @name pc.LIGHTTYPE_SPOT * @type {number} * @description Spot (local) light source. */ const LIGHTTYPE_SPOT: number; /** * @constant * @name pc.LIGHTFALLOFF_LINEAR * @type {number} * @description Linear distance falloff model for light attenuation. */ const LIGHTFALLOFF_LINEAR: number; /** * @constant * @name pc.LIGHTFALLOFF_INVERSESQUARED * @type {number} * @description Inverse squared distance falloff model for light attenuation. */ const LIGHTFALLOFF_INVERSESQUARED: number; /** * @constant * @name pc.SHADOW_PCF3 * @type {number} * @description Render depth (color-packed on WebGL 1.0), can be used for PCF 3x3 sampling. */ const SHADOW_PCF3: number; /** * @constant * @name pc.SHADOW_VSM8 * @type {number} * @description Render packed variance shadow map. All shadow receivers must also cast shadows for this mode to work correctly. */ const SHADOW_VSM8: number; /** * @constant * @name pc.SHADOW_VSM16 * @type {number} * @description Render 16-bit exponential variance shadow map. Requires OES_texture_half_float extension. Falls back to pc.SHADOW_VSM8, if not supported. */ const SHADOW_VSM16: number; /** * @constant * @name pc.SHADOW_VSM32 * @type {number} * @description Render 32-bit exponential variance shadow map. Requires OES_texture_float extension. Falls back to pc.SHADOW_VSM16, if not supported. */ const SHADOW_VSM32: number; /** * @constant * @name pc.SHADOW_PCF5 * @type {number} * @description Render depth buffer only, can be used for hardware-accelerated PCF 5x5 sampling. Requires WebGL2. Falls back to pc.SHADOW_PCF3 on WebGL 1.0. */ const SHADOW_PCF5: number; /** * @constant * @name pc.BLUR_BOX * @type {number} * @description Box filter. */ const BLUR_BOX: number; /** * @constant * @name pc.BLUR_GAUSSIAN * @type {number} * @description Gaussian filter. May look smoother than box, but requires more samples. */ const BLUR_GAUSSIAN: number; /** * @constant * @name pc.PARTICLESORT_NONE * @type {number} * @description No sorting, particles are drawn in arbitary order. Can be simulated on GPU. */ const PARTICLESORT_NONE: number; /** * @constant * @name pc.PARTICLESORT_DISTANCE * @type {number} * @description Sorting based on distance to the camera. CPU only. */ const PARTICLESORT_DISTANCE: number; /** * @constant * @name pc.PARTICLESORT_NEWER_FIRST * @type {number} * @description Newer particles are drawn first. CPU only. */ const PARTICLESORT_NEWER_FIRST: number; /** * @constant * @name pc.PARTICLESORT_OLDER_FIRST * @type {number} * @description Older particles are drawn first. CPU only. */ const PARTICLESORT_OLDER_FIRST: number; /** * @constant * @name pc.EMITTERSHAPE_BOX * @type {number} * @description Box shape parameterized by emitterExtents. Initial velocity is directed towards local Z axis. */ const EMITTERSHAPE_BOX: number; /** * @constant * @name pc.EMITTERSHAPE_SPHERE * @type {number} * @description Sphere shape parameterized by emitterRadius. Initial velocity is directed outwards from the center. */ const EMITTERSHAPE_SPHERE: number; /** * @constant * @name pc.PARTICLEORIENTATION_SCREEN * @type {number} * @description Particles are facing camera. */ const PARTICLEORIENTATION_SCREEN: number; /** * @constant * @name pc.PARTICLEORIENTATION_WORLD * @type {number} * @description User defines world space normal (particleNormal) to set planes orientation. */ const PARTICLEORIENTATION_WORLD: number; /** * @constant * @name pc.PARTICLEORIENTATION_EMITTER * @type {number} * @description Similar to previous, but the normal is affected by emitter(entity) transformation. */ const PARTICLEORIENTATION_EMITTER: number; /** * @constant * @name pc.PROJECTION_PERSPECTIVE * @type {number} * @description A perspective camera projection where the frustum shape is essentially pyramidal. */ const PROJECTION_PERSPECTIVE: number; /** * @constant * @name pc.PROJECTION_ORTHOGRAPHIC * @type {number} * @description An orthographic camera projection where the frustum shape is essentially a cuboid. */ const PROJECTION_ORTHOGRAPHIC: number; /** * @constant * @name pc.RENDERSTYLE_SOLID * @type {number} * @description Render mesh instance as solid geometry. */ const RENDERSTYLE_SOLID: number; /** * @constant * @name pc.RENDERSTYLE_WIREFRAME * @type {number} * @description Render mesh instance as wireframe. */ const RENDERSTYLE_WIREFRAME: number; /** * @constant * @name pc.RENDERSTYLE_POINTS * @type {number} * @description Render mesh instance as points. */ const RENDERSTYLE_POINTS: number; /** * @constant * @name pc.CUBEPROJ_NONE * @type {number} * @description The cube map is treated as if it is infinitely far away. */ const CUBEPROJ_NONE: number; /** * @constant * @name pc.CUBEPROJ_BOX * @type {number} * @description The cube map is box-projected based on a world space axis-aligned bounding box. */ const CUBEPROJ_BOX: number; /** * @constant * @name pc.SPECULAR_PHONG * @type {number} * @description Phong without energy conservation. You should only use it as a backwards compatibility with older projects. */ const SPECULAR_PHONG: number; /** * @constant * @name pc.SPECULAR_BLINN * @type {number} * @description Energy-conserving Blinn-Phong. */ const SPECULAR_BLINN: number; /** * @constant * @name pc.GAMMA_NONE * @type {number} * @description No gamma correction. */ const GAMMA_NONE: number; /** * @constant * @name pc.GAMMA_SRGB * @type {number} * @description Apply sRGB gamma correction. */ const GAMMA_SRGB: number; /** * @deprecated * @constant * @name pc.GAMMA_SRGBFAST * @type {number} * @description Apply sRGB (fast) gamma correction. */ const GAMMA_SRGBFAST: number; /** * @constant * @name pc.GAMMA_SRGBHDR * @type {number} * @description Apply sRGB (HDR) gamma correction. */ const GAMMA_SRGBHDR: number; /** * @constant * @name pc.TONEMAP_LINEAR * @type {number} * @description Linear tonemapping. */ const TONEMAP_LINEAR: number; /** * @constant * @name pc.TONEMAP_FILMIC * @type {number} * @description Filmic tonemapping curve. */ const TONEMAP_FILMIC: number; /** * @constant * @name pc.TONEMAP_HEJL * @type {number} * @description Hejl filmic tonemapping curve. */ const TONEMAP_HEJL: number; /** * @constant * @name pc.TONEMAP_ACES * @type {number} * @description ACES filmic tonemapping curve. */ const TONEMAP_ACES: number; /** * @constant * @name pc.TONEMAP_ACES2 * @type {number} * @description ACES v2 filmic tonemapping curve. */ const TONEMAP_ACES2: number; /** * @constant * @name pc.SPECOCC_NONE * @type {number} * @description No specular occlusion. */ const SPECOCC_NONE: number; /** * @constant * @name pc.SPECOCC_AO * @type {number} * @description Use AO directly to occlude specular. */ const SPECOCC_AO: number; /** * @constant * @name pc.SPECOCC_GLOSSDEPENDENT * @type {number} * @description Modify AO based on material glossiness/view angle to occlude specular. */ const SPECOCC_GLOSSDEPENDENT: number; /** * @constant * @name pc.SHADOWUPDATE_NONE * @type {number} * @description The shadow map is not to be updated. */ const SHADOWUPDATE_NONE: number; /** * @constant * @name pc.SHADOWUPDATE_THISFRAME * @type {number} * @description The shadow map is regenerated this frame and not on subsequent frames. */ const SHADOWUPDATE_THISFRAME: number; /** * @constant * @name pc.SHADOWUPDATE_REALTIME * @type {number} * @description The shadow map is regenerated every frame. */ const SHADOWUPDATE_REALTIME: number; /** * @constant * @name pc.SHADER_FORWARD * @type {number} * @description Render shaded materials with gamma correction and tonemapping. */ const SHADER_FORWARD: number; /** * @constant * @name pc.SHADER_FORWARDHDR * @type {number} * @description Render shaded materials without gamma correction and tonemapping. */ const SHADER_FORWARDHDR: number; /** * @constant * @name pc.SHADER_DEPTH * @type {number} * @description Render RGBA-encoded depth value. */ const SHADER_DEPTH: number; /** * @constant * @name pc.BAKE_COLOR * @type {number} * @description Single color lightmap. */ const BAKE_COLOR: number; /** * @constant * @name pc.BAKE_COLORDIR * @type {number} * @description Single color lightmap + dominant light direction (used for bump/specular). */ const BAKE_COLORDIR: number; /** * @constant * @name pc.VIEW_CENTER * @type {number} * @description Center of view. */ const VIEW_CENTER: number; /** * @constant * @name pc.VIEW_LEFT * @type {number} * @description Left of view. Only used in stereo rendering. */ const VIEW_LEFT: number; /** * @constant * @name pc.VIEW_RIGHT * @type {number} * @description Right of view. Only used in stereo rendering. */ const VIEW_RIGHT: number; /** * @constant * @name pc.SORTMODE_NONE * @type {number} * @description No sorting is applied. Mesh instances are rendered in the same order they were added to a layer. */ const SORTMODE_NONE: number; /** * @constant * @name pc.SORTMODE_MANUAL * @type {number} * @description Mesh instances are sorted based on {@link pc.MeshInstance#drawOrder}. */ const SORTMODE_MANUAL: number; /** * @constant * @name pc.SORTMODE_MATERIALMESH * @type {number} * @description Mesh instances are sorted to minimize switching between materials and meshes to improve rendering performance. */ const SORTMODE_MATERIALMESH: number; /** * @constant * @name pc.SORTMODE_BACK2FRONT * @type {number} * @description Mesh instances are sorted back to front. This is the way to properly render many semi-transparent objects on different depth, one is blended on top of another. */ const SORTMODE_BACK2FRONT: number; /** * @constant * @name pc.SORTMODE_FRONT2BACK * @type {number} * @description Mesh instances are sorted front to back. Depending on GPU and the scene, this option may give better performance than pc.SORTMODE_MATERIALMESH due to reduced overdraw. */ const SORTMODE_FRONT2BACK: number; /** * @constant * @name pc.ASPECT_AUTO * @type {number} * @description Automatically set aspect ratio to current render target's width divided by height. */ const ASPECT_AUTO: number; /** * @constant * @name pc.ASPECT_MANUAL * @type {number} * @description Use the manual aspect ratio value. */ const ASPECT_MANUAL: number; /** * @constant * @name pc.ORIENTATION_HORIZONTAL * @type {number} * @description Horizontal orientation. */ const ORIENTATION_HORIZONTAL: number; /** * @constant * @name pc.ORIENTATION_VERTICAL * @type {number} * @description Vertical orientation. */ const ORIENTATION_VERTICAL: number; /** * @class * @name pc.Scene * @augments pc.EventHandler * @classdesc A scene is graphical representation of an environment. It manages the * scene hierarchy, all graphical objects, lights, and scene-wide properties. * @description Creates a new Scene. * @property {pc.Color} ambientLight The color of the scene's ambient light. Defaults * to black (0, 0, 0). * @property {string} fog The type of fog used by the scene. Can be: * * * {@link pc.FOG_NONE} * * {@link pc.FOG_LINEAR} * * {@link pc.FOG_EXP} * * {@link pc.FOG_EXP2} * * Defaults to pc.FOG_NONE. * @property {pc.Color} fogColor The color of the fog (if enabled). Defaults to black * (0, 0, 0). * @property {number} fogDensity The density of the fog (if enabled). This property * is only valid if the fog property is set to pc.FOG_EXP or pc.FOG_EXP2. Defaults to 0. * @property {number} fogEnd The distance from the viewpoint where linear fog reaches * its maximum. This property is only valid if the fog property is set to pc.FOG_LINEAR. * Defaults to 1000. * @property {number} fogStart The distance from the viewpoint where linear fog begins. * This property is only valid if the fog property is set to pc.FOG_LINEAR. Defaults to 1. * @property {number} gammaCorrection The gamma correction to apply when rendering the * scene. Can be: * * * {@link pc.GAMMA_NONE} * * {@link pc.GAMMA_SRGB} * * Defaults to pc.GAMMA_NONE. * @property {number} toneMapping The tonemapping transform to apply when writing * fragments to the frame buffer. Can be: * * * {@link pc.TONEMAP_LINEAR} * * {@link pc.TONEMAP_FILMIC} * * {@link pc.TONEMAP_HEJL} * * {@link pc.TONEMAP_ACES} * * Defaults to pc.TONEMAP_LINEAR. * @property {number} exposure The exposure value tweaks the overall brightness of * the scene. Defaults to 1. * @property {pc.Texture} skybox The base cubemap texture used as the scene's skybox, if mip level is 0. Defaults to null. * @property {pc.Texture} skyboxPrefiltered128 The prefiltered cubemap texture (size 128x128) used as the scene's skybox, if mip level 1. Defaults to null. * @property {pc.Texture} skyboxPrefiltered64 The prefiltered cubemap texture (size 64x64) used as the scene's skybox, if mip level 2. Defaults to null. * @property {pc.Texture} skyboxPrefiltered32 The prefiltered cubemap texture (size 32x32) used as the scene's skybox, if mip level 3. Defaults to null. * @property {pc.Texture} skyboxPrefiltered16 The prefiltered cubemap texture (size 16x16) used as the scene's skybox, if mip level 4. Defaults to null. * @property {pc.Texture} skyboxPrefiltered8 The prefiltered cubemap texture (size 8x8) used as the scene's skybox, if mip level 5. Defaults to null. * @property {pc.Texture} skyboxPrefiltered4 The prefiltered cubemap texture (size 4x4) used as the scene's skybox, if mip level 6. Defaults to null. * @property {number} skyboxIntensity Multiplier for skybox intensity. Defaults to 1. * @property {number} skyboxMip The mip level of the skybox to be displayed. Only valid * for prefiltered cubemap skyboxes. Defaults to 0 (base level). * @property {number} lightmapSizeMultiplier The lightmap resolution multiplier. * Defaults to 1. * @property {number} lightmapMaxResolution The maximum lightmap resolution. Defaults to * 2048. * @property {number} lightmapMode The lightmap baking mode. Can be: * * * {@link pc.BAKE_COLOR}: single color lightmap * * {@link pc.BAKE_COLORDIR}: single color lightmap + dominant light direction (used for * bump/specular). Only lights with bakeDir=true will be used for generating the dominant * light direction. * * Defaults to pc.BAKE_COLORDIR. * @property {pc.LayerComposition} layers A {@link pc.LayerComposition} that defines * rendering order of this scene. * @property {pc.StandardMaterial} defaultMaterial The default material used in case no * other material is available. * @property {pc.Entity} root The root entity of the scene, which is usually the only * child to the Application root entity. */ class Scene extends pc.EventHandler { /** * @function * @name pc.Scene#setSkybox * @description Sets the cubemap for the scene skybox. * @param {pc.Texture[]} [cubemaps] - An array of cubemaps corresponding to the skybox at different mip levels. If undefined, scene will remove skybox. * Cubemap array should be of size 7, with the first element (index 0) corresponding to the base cubemap (mip level 0) with original resolution. * Each remaining element (index 1-6) corresponds to a fixed prefiltered resolution (128x128, 64x64, 32x32, 16x16, 8x8, 4x4). */ setSkybox(cubemaps?: pc.Texture[]): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The color of the scene's ambient light. Defaults to black (0, 0, 0). */ ambientLight: pc.Color; /** * The type of fog used by the scene. Can be: * {@link pc.FOG_NONE} * {@link pc.FOG_LINEAR} * {@link pc.FOG_EXP} * {@link pc.FOG_EXP2} Defaults to pc.FOG_NONE. */ fog: string; /** * The color of the fog (if enabled). Defaults to black (0, 0, 0). */ fogColor: pc.Color; /** * The density of the fog (if enabled). This property is only valid if the fog property is set to pc.FOG_EXP or pc.FOG_EXP2. Defaults to 0. */ fogDensity: number; /** * The distance from the viewpoint where linear fog reaches its maximum. This property is only valid if the fog property is set to pc.FOG_LINEAR. Defaults to 1000. */ fogEnd: number; /** * The distance from the viewpoint where linear fog begins. This property is only valid if the fog property is set to pc.FOG_LINEAR. Defaults to 1. */ fogStart: number; /** * The gamma correction to apply when rendering the scene. Can be: * {@link pc.GAMMA_NONE} * {@link pc.GAMMA_SRGB} Defaults to pc.GAMMA_NONE. */ gammaCorrection: number; /** * The tonemapping transform to apply when writing fragments to the frame buffer. Can be: * {@link pc.TONEMAP_LINEAR} * {@link pc.TONEMAP_FILMIC} * {@link pc.TONEMAP_HEJL} * {@link pc.TONEMAP_ACES} Defaults to pc.TONEMAP_LINEAR. */ toneMapping: number; /** * The exposure value tweaks the overall brightness of the scene. Defaults to 1. */ exposure: number; /** * The base cubemap texture used as the scene's skybox, if mip level is 0. Defaults to null. */ skybox: pc.Texture; /** * The prefiltered cubemap texture (size 128x128) used as the scene's skybox, if mip level 1. Defaults to null. */ skyboxPrefiltered128: pc.Texture; /** * The prefiltered cubemap texture (size 64x64) used as the scene's skybox, if mip level 2. Defaults to null. */ skyboxPrefiltered64: pc.Texture; /** * The prefiltered cubemap texture (size 32x32) used as the scene's skybox, if mip level 3. Defaults to null. */ skyboxPrefiltered32: pc.Texture; /** * The prefiltered cubemap texture (size 16x16) used as the scene's skybox, if mip level 4. Defaults to null. */ skyboxPrefiltered16: pc.Texture; /** * The prefiltered cubemap texture (size 8x8) used as the scene's skybox, if mip level 5. Defaults to null. */ skyboxPrefiltered8: pc.Texture; /** * The prefiltered cubemap texture (size 4x4) used as the scene's skybox, if mip level 6. Defaults to null. */ skyboxPrefiltered4: pc.Texture; /** * Multiplier for skybox intensity. Defaults to 1. */ skyboxIntensity: number; /** * The mip level of the skybox to be displayed. Only valid for prefiltered cubemap skyboxes. Defaults to 0 (base level). */ skyboxMip: number; /** * The lightmap resolution multiplier. Defaults to 1. */ lightmapSizeMultiplier: number; /** * The maximum lightmap resolution. Defaults to 2048. */ lightmapMaxResolution: number; /** * The lightmap baking mode. Can be: * {@link pc.BAKE_COLOR}: single color lightmap * {@link pc.BAKE_COLORDIR}: single color lightmap + dominant light direction (used for bump/specular). Only lights with bakeDir=true will be used for generating the dominant light direction. Defaults to pc.BAKE_COLORDIR. */ lightmapMode: number; /** * A {@link pc.LayerComposition} that defines rendering order of this scene. */ layers: pc.LayerComposition; /** * The default material used in case no other material is available. */ defaultMaterial: pc.StandardMaterial; /** * The root entity of the scene, which is usually the only child to the Application root entity. */ root: pc.Entity; } /** * @class * @name pc.Skin * @classdesc A skin contains data about the bones in a hierarchy that drive a skinned mesh animation. * Specifically, the skin stores the bone name and inverse bind matrix and for each bone. * Inverse bind matrices are instrumental in the mathematics of vertex skinning. * @param {pc.GraphicsDevice} graphicsDevice - The graphics device used to manage this skin. * @param {pc.Mat4[]} ibp - The array of inverse bind matrices. * @param {string[]} boneNames - The array of bone names for the bones referenced by this skin. */ class Skin { constructor(graphicsDevice: pc.GraphicsDevice, ibp: pc.Mat4[], boneNames: string[]); } /** * @class * @name pc.SkinInstance * @classdesc A skin instance is responsible for generating the matrix palette that is used to * skin vertices from object space to world space. * @param {pc.Skin} skin - The skin that will provide the inverse bind pose matrices to * generate the final matrix palette. * @property {pc.GraphNode[]} bones An array of nodes representing each bone in this skin instance. */ class SkinInstance { constructor(skin: pc.Skin); /** * An array of nodes representing each bone in this skin instance. */ bones: pc.GraphNode[]; } /** * @constant * @type {number} * @name pc.SPRITE_RENDERMODE_SIMPLE * @description This mode renders a sprite as a simple quad. */ const SPRITE_RENDERMODE_SIMPLE: number; /** * @constant * @type {number} * @name pc.SPRITE_RENDERMODE_SLICED * @description This mode renders a sprite using 9-slicing in 'sliced' mode. Sliced mode stretches the * top and bottom regions of the sprite horizontally, the left and right regions vertically and the middle region * both horizontally and vertically. */ const SPRITE_RENDERMODE_SLICED: number; /** * @constant * @type {number} * @name pc.SPRITE_RENDERMODE_TILED * @description This mode renders a sprite using 9-slicing in 'tiled' mode. Tiled mode tiles the * top and bottom regions of the sprite horizontally, the left and right regions vertically and the middle region * both horizontally and vertically. */ const SPRITE_RENDERMODE_TILED: number; /** * @class * @name pc.Sprite * @augments pc.EventHandler * @classdesc A pc.Sprite is contains references to one or more frames of a {@link pc.TextureAtlas}. * It can be used by the {@link pc.SpriteComponent} or the {@link pc.ElementComponent} to render a * single frame or a sprite animation. * @param {pc.GraphicsDevice} device - The graphics device of the application. * @param {object} [options] - Options for creating the pc.Sprite. * @param {number} [options.pixelsPerUnit] - The number of pixels that map to one PlayCanvas unit. * Defaults to 1. * @param {number} [options.renderMode] - The rendering mode of the sprite. Can be: * * * {@link pc.SPRITE_RENDERMODE_SIMPLE} * * {@link pc.SPRITE_RENDERMODE_SLICED} * * {@link pc.SPRITE_RENDERMODE_TILED} * * Defaults to pc.SPRITE_RENDERMODE_SIMPLE. * @param {pc.TextureAtlas} [options.atlas] - The texture atlas. Defaults to null. * @param {string[]} [options.frameKeys] - The keys of the frames in the sprite atlas that this sprite is * using. Defaults to null. * @property {number} pixelsPerUnit The number of pixels that map to one PlayCanvas unit. * @property {pc.TextureAtlas} atlas The texture atlas. * @property {number} renderMode The rendering mode of the sprite. Can be: * * * {@link pc.SPRITE_RENDERMODE_SIMPLE} * * {@link pc.SPRITE_RENDERMODE_SLICED} * * {@link pc.SPRITE_RENDERMODE_TILED} * * @property {string[]} frameKeys The keys of the frames in the sprite atlas that this sprite is using. * @property {pc.Mesh[]} meshes An array that contains a mesh for each frame. */ class Sprite extends pc.EventHandler { constructor(device: pc.GraphicsDevice, options?: { pixelsPerUnit?: number; renderMode?: number; atlas?: pc.TextureAtlas; frameKeys?: string[]; }); /** * @function * @name pc.Sprite#destroy * @description Free up the meshes created by the sprite. */ destroy(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The number of pixels that map to one PlayCanvas unit. */ pixelsPerUnit: number; /** * The texture atlas. */ atlas: pc.TextureAtlas; /** * The rendering mode of the sprite. Can be: * {@link pc.SPRITE_RENDERMODE_SIMPLE} * {@link pc.SPRITE_RENDERMODE_SLICED} * {@link pc.SPRITE_RENDERMODE_TILED} */ renderMode: number; /** * The keys of the frames in the sprite atlas that this sprite is using. */ frameKeys: string[]; /** * An array that contains a mesh for each frame. */ meshes: pc.Mesh[]; } /** * @class * @name pc.StencilParameters * @classdesc Holds stencil test settings. * @description Create a new StencilParameters instance. * @param {object} options - Options object to configure the stencil parameters. * @property {number} func Sets stencil test function. See {@link pc.GraphicsDevice#setStencilFunc}. * @property {number} ref Sets stencil test reference value. See {@link pc.GraphicsDevice#setStencilFunc}. * @property {number} fail Sets operation to perform if stencil test is failed. See {@link pc.GraphicsDevice#setStencilOperation}. * @property {number} zfail Sets operation to perform if depth test is failed. See {@link pc.GraphicsDevice#setStencilOperation}. * @property {number} zpass Sets operation to perform if both stencil and depth test are passed. See {@link pc.GraphicsDevice#setStencilOperation}. * @property {number} readMask Sets stencil test reading mask. See {@link pc.GraphicsDevice#setStencilFunc}. * @property {number} writeMask Sets stencil test writing mask. See {@link pc.GraphicsDevice#setStencilOperation}. */ class StencilParameters { constructor(options: any); /** * Sets stencil test function. See {@link pc.GraphicsDevice#setStencilFunc}. */ func: number; /** * Sets stencil test reference value. See {@link pc.GraphicsDevice#setStencilFunc}. */ ref: number; /** * Sets operation to perform if stencil test is failed. See {@link pc.GraphicsDevice#setStencilOperation}. */ fail: number; /** * Sets operation to perform if depth test is failed. See {@link pc.GraphicsDevice#setStencilOperation}. */ zfail: number; /** * Sets operation to perform if both stencil and depth test are passed. See {@link pc.GraphicsDevice#setStencilOperation}. */ zpass: number; /** * Sets stencil test reading mask. See {@link pc.GraphicsDevice#setStencilFunc}. */ readMask: number; /** * Sets stencil test writing mask. See {@link pc.GraphicsDevice#setStencilOperation}. */ writeMask: number; } /** * @class * @name pc.TextureAtlas * @augments pc.EventHandler * @classdesc A pc.TextureAtlas contains a number of frames from a texture. Each frame * defines a region in a texture. The pc.TextureAtlas is referenced by {@link pc.Sprite}s. * @property {pc.Texture} texture The texture atlas. * @property {object} frames Contains frames which define portions of the texture atlas. * @example * var atlas = new pc.TextureAtlas(); * atlas.frames = { * '0': { * // rect has u, v, width and height in pixels * rect: new pc.Vec4(0, 0, 256, 256), * // pivot has x, y values between 0-1 which define the point * // within the frame around which rotation and scale is calculated * pivot: new pc.Vec2(0.5, 0.5), * // border has left, bottom, right and top in pixels defining regions for 9-slicing * border: new pc.Vec4(5, 5, 5, 5) * }, * '1': { * rect: new pc.Vec4(256, 0, 256, 256), * pivot: new pc.Vec2(0.5, 0.5), * border: new pc.Vec4(5, 5, 5, 5) * } * }; */ class TextureAtlas extends pc.EventHandler { /** * @function * @name pc.TextureAtlas#setFrame * @param {string} key - The key of the frame. * @param {object} data - The properties of the frame. * @param {pc.Vec4} data.rect - The u, v, width, height properties of the frame in pixels. * @param {pc.Vec2} data.pivot - The pivot of the frame - values are between 0-1. * @param {pc.Vec4} data.border - The border of the frame for 9-slicing. Values are ordered * as follows: left, bottom, right, top border in pixels. * @example * atlas.setFrame('1', { * rect: new pc.Vec4(0, 0, 128, 128), * pivot: new pc.Vec2(0.5, 0.5), * border: new pc.Vec4(5, 5, 5, 5) * }); */ setFrame(key: string, data: { rect: pc.Vec4; pivot: pc.Vec2; border: pc.Vec4; }): void; /** * @function * @name pc.TextureAtlas#removeFrame * @param {string} key - The key of the frame. * @example * atlas.removeFrame('1'); */ removeFrame(key: string): void; /** * @function * @name pc.TextureAtlas#destroy * @description Free up the underlying texture owned by the atlas. */ destroy(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The texture atlas. */ texture: pc.Texture; /** * Contains frames which define portions of the texture atlas. */ frames: any; } /** * @class * @name pc.ScriptAttributes * @classdesc Container of Script Attribute definitions. Implements an interface to add/remove attributes and store their definition for a {@link pc.ScriptType}. * Note: An instance of pc.ScriptAttributes is created automatically by each {@link pc.ScriptType}. * @param {Class} scriptType - Script Type that attributes relate to. */ class ScriptAttributes { constructor(scriptType: typeof pc.ScriptType); /** * @function * @name pc.ScriptAttributes#add * @description Add Attribute. * @param {string} name - Name of an attribute. * @param {object} args - Object with Arguments for an attribute. * @param {("boolean"|"number"|"string"|"json"|"asset"|"entity"|"rgb"|"rgba"|"vec2"|"vec3"|"vec4"|"curve")} args.type - Type of an attribute value. * @param {*} [args.default] - Default attribute value. * @param {string} [args.title] - Title for Editor's for field UI. * @param {string} [args.description] - Description for Editor's for field UI. * @param {string|string[]} [args.placeholder] - Placeholder for Editor's for field UI. * For multi-field types, such as vec2, vec3, and others use array of strings. * @param {boolean} [args.array] - If attribute can hold single or multiple values. * @param {number} [args.size] - If attribute is array, maximum number of values can be set. * @param {number} [args.min] - Minimum value for type 'number', if max and min defined, slider will be rendered in Editor's UI. * @param {number} [args.max] - Maximum value for type 'number', if max and min defined, slider will be rendered in Editor's UI. * @param {number} [args.precision] - Level of precision for field type 'number' with floating values. * @param {number} [args.step] - Step value for type 'number'. The amount used to increment the value when using the arrow keys in the Editor's UI. * @param {string} [args.assetType] - Name of asset type to be used in 'asset' type attribute picker in Editor's UI, defaults to '*' (all). * @param {string[]} [args.curves] - List of names for Curves for field type 'curve'. * @param {string} [args.color] - String of color channels for Curves for field type 'curve', can be any combination of `rgba` characters. * Defining this property will render Gradient in Editor's field UI. * @param {object[]} [args.enum] - List of fixed choices for field, defined as array of objects, where key in object is a title of an option. * @example * PlayerController.attributes.add('fullName', { * type: 'string' * }); * @example * PlayerController.attributes.add('speed', { * type: 'number', * title: 'Speed', * placeholder: 'km/h', * default: 22.2 * }); * @example * PlayerController.attributes.add('resolution', { * type: 'number', * default: 32, * enum: [ * { '32x32': 32 }, * { '64x64': 64 }, * { '128x128': 128 } * ] * }); */ add(name: string, args: { type: "boolean" | "number" | "string" | "json" | "asset" | "entity" | "rgb" | "rgba" | "vec2" | "vec3" | "vec4" | "curve"; default?: any; title?: string; description?: string; placeholder?: string | string[]; array?: boolean; size?: number; min?: number; max?: number; precision?: number; step?: number; assetType?: string; curves?: string[]; color?: string; enum?: object[]; }): void; /** * @function * @name pc.ScriptAttributes#remove * @description Remove Attribute. * @param {string} name - Name of an attribute. * @returns {boolean} True if removed or false if not defined. * @example * PlayerController.attributes.remove('fullName'); */ remove(name: string): boolean; /** * @function * @name pc.ScriptAttributes#has * @description Detect if Attribute is added. * @param {string} name - Name of an attribute. * @returns {boolean} True if Attribute is defined. * @example * if (PlayerController.attributes.has('fullName')) { * // attribute fullName is defined * } */ has(name: string): boolean; /** * @function * @name pc.ScriptAttributes#get * @description Get object with attribute arguments. * Note: Changing argument properties will not affect existing Script Instances. * @param {string} name - Name of an attribute. * @returns {?object} Arguments with attribute properties. * @example * // changing default value for an attribute 'fullName' * var attr = PlayerController.attributes.get('fullName'); * if (attr) attr.default = 'Unknown'; */ get(name: string): any; } /** * @class * @name pc.ScriptRegistry * @augments pc.EventHandler * @classdesc Container for all Script Types that are available to this application. * @description Create an instance of a pc.ScriptRegistry. * Note: PlayCanvas scripts can access the Script Registry from inside the application with {@link pc.Application#scripts} {@link pc.ADDRESS_REPEAT}. * @param {pc.Application} app - Application to attach registry to. */ class ScriptRegistry extends pc.EventHandler { constructor(app: pc.Application); /** * @function * @name pc.ScriptRegistry#add * @description Add {@link pc.ScriptType} to registry. * Note: when {@link pc.createScript} is called, it will add the {@link pc.ScriptType} to the registry automatically. * If a script already exists in registry, and the new script has a `swap` method defined, * it will perform code hot swapping automatically in async manner. * @param {Class} script - Script Type that is created using {@link pc.createScript}. * @returns {boolean} True if added for the first time or false if script already exists. * @example * var PlayerController = pc.createScript('playerController'); * // playerController Script Type will be added to pc.ScriptRegistry automatically * console.log(app.scripts.has('playerController')); // outputs true */ add(script: typeof pc.ScriptType): boolean; /** * @function * @name pc.ScriptRegistry#remove * @description Remove {@link pc.ScriptType}. * @param {string} name - Name of a {@link pc.ScriptType} to remove. * @returns {boolean} True if removed or False if already not in registry. * @example * app.scripts.remove('playerController'); */ remove(name: string): boolean; /** * @function * @name pc.ScriptRegistry#get * @description Get {@link pc.ScriptType} by name. * @param {string} name - Name of a {@link pc.ScriptType}. * @returns {Class} The Script Type if it exists in the registry or null otherwise. * @example * var PlayerController = app.scripts.get('playerController'); */ get(name: string): typeof pc.ScriptType; /** * @function * @name pc.ScriptRegistry#has * @description Check if a {@link pc.ScriptType} with the specified name is in the registry. * @param {string} name - Name of a {@link pc.ScriptType}. * @returns {boolean} True if {@link pc.ScriptType} is in registry. * @example * if (app.scripts.has('playerController')) { * // playerController is in pc.ScriptRegistry * } */ has(name: string): boolean; /** * @function * @name pc.ScriptRegistry#list * @description Get list of all {@link pc.ScriptType}s from registry. * @returns {Array>} list of all {@link pc.ScriptType}s in registry. * @example * // logs array of all Script Type names available in registry * console.log(app.scripts.list().map(function (o) { * return o.name; * })); */ list(): (typeof pc.ScriptType)[]; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; } /** * @class * @name pc.ScriptType * @augments pc.EventHandler * @classdesc Represents the type of a script. It is returned by {@link pc.createScript}. * Also referred to as Script Type. * * The type is to be extended using its JavaScript prototype. There is a **list of methods** * that will be executed by the engine on instances of this type, such as: * * * initialize * * postInitialize * * update * * postUpdate * * swap * * **initialize** and **postInitialize** - are called if defined when script is about to run * for the first time - postInitialize will run after all initialize methods are executed in * the same tick or enabling chain of actions. * * **update** and **postUpdate** - methods are called if defined for enabled (running state) * scripts on each tick. * * **swap** - This method will be called when a {@link pc.ScriptType} that already exists in * the registry gets redefined. If the new {@link pc.ScriptType} has a `swap` method in its * prototype, then it will be executed to perform hot-reload at runtime. * @property {pc.Application} app The {@link pc.Application} that the instance of this type * belongs to. * @property {pc.Entity} entity The {@link pc.Entity} that the instance of this type belongs to. * @property {boolean} enabled True if the instance of this type is in running state. False * when script is not running, because the Entity or any of its parents are disabled or the * Script Component is disabled or the Script Instance is disabled. When disabled no update * methods will be called on each tick. initialize and postInitialize methods will run once * when the script instance is in `enabled` state during app tick. * @param {object} args - The input arguments object * @param {pc.Application} args.app - The {@link pc.Application} that is running the script * @param {pc.Entity} args.entity - The {@link pc.Entity} that the script is attached to * */ class ScriptType extends pc.EventHandler { constructor(args: { app: pc.Application; entity: pc.Entity; }); /** * @field * @static * @readonly * @name pc.ScriptType#attributes * @type {pc.ScriptAttributes} * @description The interface to define attributes for Script Types. Refer to {@link pc.ScriptAttributes}. * @example * var PlayerController = pc.createScript('playerController'); * * PlayerController.attributes.add('speed', { * type: 'number', * title: 'Speed', * placeholder: 'km/h', * default: 22.2 * }); */ readonly attributes: pc.ScriptAttributes; /** * @readonly * @static * @function * @name pc.ScriptType.extend * @param {object} methods - Object with methods, where key - is name of method, and value - is function. * @description Shorthand function to extend Script Type prototype with list of methods. * @example * var PlayerController = pc.createScript('playerController'); * * PlayerController.extend({ * initialize: function () { * // called once on initialize * }, * update: function (dt) { * // called each tick * } * }); */ static extend(methods: any): void; /** * @function * @name pc.ScriptType#[initialize] * @description Called when script is about to run for the first time. */ initialize?(): void; /** * @function * @name pc.ScriptType#[postInitialize] * @description Called after all initialize methods are executed in the same tick or enabling chain of actions. */ postInitialize?(): void; /** * @function * @name pc.ScriptType#[update] * @description Called for enabled (running state) scripts on each tick. * @param {number} dt - The delta time in seconds since the last frame. */ update?(dt: number): void; /** * @function * @name pc.ScriptType#[postUpdate] * @description Called for enabled (running state) scripts on each tick, after update. * @param {number} dt - The delta time in seconds since the last frame. */ postUpdate?(dt: number): void; /** * @function * @name pc.ScriptType#[swap] * @description Called when a ScriptType that already exists in the registry * gets redefined. If the new ScriptType has a `swap` method in its prototype, * then it will be executed to perform hot-reload at runtime. */ swap?(): void; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The {@link pc.Application} that the instance of this type belongs to. */ app: pc.Application; /** * The {@link pc.Entity} that the instance of this type belongs to. */ entity: pc.Entity; /** * True if the instance of this type is in running state. False when script is not running, because the Entity or any of its parents are disabled or the Script Component is disabled or the Script Instance is disabled. When disabled no update methods will be called on each tick. initialize and postInitialize methods will run once when the script instance is in `enabled` state during app tick. */ enabled: boolean; } /** * @static * @function * @name pc.createScript * @description Create and register a new {@link pc.ScriptType}. * It returns new class type (constructor function), which is auto-registered to {@link pc.ScriptRegistry} using it's name. * This is the main interface to create Script Types, to define custom logic using JavaScript, that is used to create interaction for entities. * @param {string} name - Unique Name of a Script Type. * If a Script Type with the same name has already been registered and the new one has a `swap` method defined in its prototype, * then it will perform hot swapping of existing Script Instances on entities using this new Script Type. * Note: There is a reserved list of names that cannot be used, such as list below as well as some starting from `_` (underscore): * system, entity, create, destroy, swap, move, scripts, onEnable, onDisable, onPostStateChange, has, on, off, fire, once, hasEvent. * @param {pc.Application} [app] - Optional application handler, to choose which {@link pc.ScriptRegistry} to add a script to. * By default it will use `pc.Application.getApplication()` to get current {@link pc.Application}. * @returns {Class} A class type (constructor function) that inherits {@link pc.ScriptType}, * which the developer is meant to further extend by adding attributes and prototype methods. * @example * var Turning = pc.createScript('turn'); * * // define `speed` attribute that is available in Editor UI * Turning.attributes.add('speed', { * type: 'number', * default: 180, * placeholder: 'deg/s' * }); * * // runs every tick * Turning.prototype.update = function (dt) { * this.entity.rotate(0, this.speed * dt, 0); * }; */ function createScript(name: string, app?: pc.Application): typeof pc.ScriptType; /** * @static * @function * @name pc.registerScript * @description Register a existing class type as a Script Type to {@link pc.ScriptRegistry}. * Useful when defining a ES6 script class that extends {@link pc.ScriptType} (see example). * @param {Class} script - The existing class type (constructor function) to be registered as a Script Type. * Class must extend {@link pc.ScriptType} (see example). Please note: A class created using {@link pc.createScript} is auto-registered, * and should therefore not be pass into {@link pc.registerScript} (which would result in swapping out all related script instances). * @param {string} [name] - Optional unique name of the Script Type. By default it will use the same name as the existing class. * If a Script Type with the same name has already been registered and the new one has a `swap` method defined in its prototype, * then it will perform hot swapping of existing Script Instances on entities using this new Script Type. * Note: There is a reserved list of names that cannot be used, such as list below as well as some starting from `_` (underscore): * system, entity, create, destroy, swap, move, scripts, onEnable, onDisable, onPostStateChange, has, on, off, fire, once, hasEvent. * @param {pc.Application} [app] - Optional application handler, to choose which {@link pc.ScriptRegistry} to register the script type to. * By default it will use `pc.Application.getApplication()` to get current {@link pc.Application}. * @example * // define a ES6 script class * class PlayerController extends pc.ScriptType { * * initialize() { * // called once on initialize * } * * update(dt) { * // called each tick * } * } * * // register the class as a script * pc.registerScript(PlayerController); */ function registerScript(script: typeof pc.ScriptType, name?: string, app?: pc.Application): void; /** * @class * @name pc.BoundingBox * @description Create a new axis-aligned bounding box. * @classdesc Axis-Aligned Bounding Box. * @param {pc.Vec3} [center] - Center of box. The constructor takes a reference of this parameter. * @param {pc.Vec3} [halfExtents] - Half the distance across the box in each axis. The constructor takes a reference of this parameter. * @property {pc.Vec3} center Center of box. * @property {pc.Vec3} halfExtents Half the distance across the box in each axis. */ class BoundingBox { constructor(center?: pc.Vec3, halfExtents?: pc.Vec3); /** * @function * @name pc.BoundingBox#add * @description Combines two bounding boxes into one, enclosing both. * @param {pc.BoundingBox} other - Bounding box to add. */ add(other: pc.BoundingBox): void; /** * @function * @name pc.BoundingBox#intersects * @description Test whether two axis-aligned bounding boxes intersect. * @param {pc.BoundingBox} other - Bounding box to test against. * @returns {boolean} True if there is an intersection. */ intersects(other: pc.BoundingBox): boolean; /** * @function * @name pc.BoundingBox#intersectsRay * @description Test if a ray intersects with the AABB. * @param {pc.Ray} ray - Ray to test against (direction must be normalized). * @param {pc.Vec3} [point] - If there is an intersection, the intersection point will be copied into here. * @returns {boolean} True if there is an intersection. */ intersectsRay(ray: pc.Ray, point?: pc.Vec3): boolean; /** * @function * @name pc.BoundingBox#getMin * @description Return the minimum corner of the AABB. * @returns {pc.Vec3} Minimum corner. */ getMin(): pc.Vec3; /** * @function * @name pc.BoundingBox#getMax * @description Return the maximum corner of the AABB. * @returns {pc.Vec3} Maximum corner. */ getMax(): pc.Vec3; /** * @function * @name pc.BoundingBox#containsPoint * @description Test if a point is inside a AABB. * @param {pc.Vec3} point - Point to test. * @returns {boolean} True if the point is inside the AABB and false otherwise. */ containsPoint(point: pc.Vec3): boolean; /** * @function * @name pc.BoundingBox#setFromTransformedAabb * @description Set an AABB to enclose the specified AABB if it were to be * transformed by the specified 4x4 matrix. * @param {pc.BoundingBox} aabb - Box to transform and enclose. * @param {pc.Mat4} m - Transformation matrix to apply to source AABB. */ setFromTransformedAabb(aabb: pc.BoundingBox, m: pc.Mat4): void; /** * @function * @name pc.BoundingBox#intersectsBoundingSphere * @description Test if a Bounding Sphere is overlapping, enveloping, or inside this AABB. * @param {pc.BoundingSphere} sphere - Bounding Sphere to test. * @returns {boolean} True if the Bounding Sphere is overlapping, enveloping, or inside the AABB and false otherwise. */ intersectsBoundingSphere(sphere: pc.BoundingSphere): boolean; /** * Center of box. */ center: pc.Vec3; /** * Half the distance across the box in each axis. */ halfExtents: pc.Vec3; } /** * @class * @name pc.BoundingSphere * @classdesc A bounding sphere is a volume for facilitating fast intersection testing. * @description Creates a new bounding sphere. * @example * // Create a new bounding sphere centered on the origin with a radius of 0.5 * var sphere = new pc.BoundingSphere(); * @param {pc.Vec3} [center] - The world space coordinate marking the center of the sphere. The constructor takes a reference of this parameter. * @param {number} [radius] - The radius of the bounding sphere. Defaults to 0.5. */ class BoundingSphere { constructor(center?: pc.Vec3, radius?: number); /** * @function * @name pc.BoundingSphere#intersectsRay * @description Test if a ray intersects with the sphere. * @param {pc.Ray} ray - Ray to test against (direction must be normalized). * @param {pc.Vec3} [point] - If there is an intersection, the intersection point will be copied into here. * @returns {boolean} True if there is an intersection. */ intersectsRay(ray: pc.Ray, point?: pc.Vec3): boolean; /** * @function * @name pc.BoundingSphere#intersectsBoundingSphere * @description Test if a Bounding Sphere is overlapping, enveloping, or inside this Bounding Sphere. * @param {pc.BoundingSphere} sphere - Bounding Sphere to test. * @returns {boolean} True if the Bounding Sphere is overlapping, enveloping, or inside this Bounding Sphere and false otherwise. */ intersectsBoundingSphere(sphere: pc.BoundingSphere): boolean; } /** * @class * @name pc.Frustum * @classdesc A frustum is a shape that defines the viewing space of a camera. * @description Creates a new frustum shape. * @example * // Create a new frustum equivalent to one held by a camera component * var projectionMatrix = entity.camera.projectionMatrix; * var viewMatrix = entity.camera.viewMatrix; * var frustum = new pc.Frustum(projectionMatrix, viewMatrix); * @param {pc.Mat4} projectionMatrix - The projection matrix describing the shape of the frustum. * @param {pc.Mat4} viewMatrix - The inverse of the world transformation matrix for the frustum. */ class Frustum { constructor(projectionMatrix: pc.Mat4, viewMatrix: pc.Mat4); /** * @function * @name pc.Frustum#update * @description Updates the frustum shape based on a view matrix and a projection matrix. * @param {pc.Mat4} projectionMatrix - The projection matrix describing the shape of the frustum. * @param {pc.Mat4} viewMatrix - The inverse of the world transformation matrix for the frustum. */ update(projectionMatrix: pc.Mat4, viewMatrix: pc.Mat4): void; /** * @function * @name pc.Frustum#containsPoint * @description Tests whether a point is inside the frustum. Note that points lying in a frustum plane are * considered to be outside the frustum. * @param {pc.Vec3} point - The point to test. * @returns {boolean} True if the point is inside the frustum, false otherwise. */ containsPoint(point: pc.Vec3): boolean; /** * @function * @name pc.Frustum#containsSphere * @description Tests whether a bounding sphere intersects the frustum. If the sphere is outside the frustum, * zero is returned. If the sphere intersects the frustum, 1 is returned. If the sphere is completely inside * the frustum, 2 is returned. Note that a sphere touching a frustum plane from the outside is considered to * be outside the frustum. * @param {pc.BoundingSphere} sphere - The sphere to test. * @returns {number} 0 if the bounding sphere is outside the frustum, 1 if it intersects the frustum and 2 if * it is contained by the frustum. */ containsSphere(sphere: pc.BoundingSphere): number; } /** * @class * @name pc.OrientedBox * @description Create a new oriented box. * @classdesc Oriented Box. * @property {pc.Mat4} [worldTransform] The world transform of the OBB. * @param {pc.Mat4} [worldTransform] - Transform that has the orientation and position of the box. Scale is assumed to be one. * @param {pc.Vec3} [halfExtents] - Half the distance across the box in each local axis. The constructor takes a reference of this parameter. */ class OrientedBox { constructor(worldTransform?: pc.Mat4, halfExtents?: pc.Vec3); /** * @function * @name pc.OrientedBox#intersectsRay * @description Test if a ray intersects with the OBB. * @param {pc.Ray} ray - Ray to test against (direction must be normalized). * @param {pc.Vec3} [point] - If there is an intersection, the intersection point will be copied into here. * @returns {boolean} True if there is an intersection. */ intersectsRay(ray: pc.Ray, point?: pc.Vec3): boolean; /** * @function * @name pc.OrientedBox#containsPoint * @description Test if a point is inside a OBB. * @param {pc.Vec3} point - Point to test. * @returns {boolean} True if the point is inside the OBB and false otherwise. */ containsPoint(point: pc.Vec3): boolean; /** * @function * @name pc.OrientedBox#intersectsBoundingSphere * @description Test if a Bounding Sphere is overlapping, enveloping, or inside this OBB. * @param {pc.BoundingSphere} sphere - Bounding Sphere to test. * @returns {boolean} True if the Bounding Sphere is overlapping, enveloping or inside this OBB and false otherwise. */ intersectsBoundingSphere(sphere: pc.BoundingSphere): boolean; /** * The world transform of the OBB. */ worldTransform?: pc.Mat4; } /** * @class * @name pc.Ray * @classdesc An infinite ray. * @description Creates a new infinite ray starting at a given origin and pointing in a given direction. * @example * // Create a new ray starting at the position of this entity and pointing down * // the entity's negative Z axis * var ray = new pc.Ray(this.entity.getPosition(), this.entity.forward); * @param {pc.Vec3} [origin] - The starting point of the ray. The constructor takes a reference of this parameter. * Defaults to the origin (0, 0, 0). * @param {pc.Vec3} [direction] - The direction of the ray. The constructor takes a reference of this parameter. * Defaults to a direction down the world negative Z axis (0, 0, -1). * @property {pc.Vec3} origin The starting point of the ray. * @property {pc.Vec3} direction The direction of the ray. */ class Ray { constructor(origin?: pc.Vec3, direction?: pc.Vec3); /** * The starting point of the ray. */ origin: pc.Vec3; /** * The direction of the ray. */ direction: pc.Vec3; } /** * @class * @name pc.SoundInstance * @augments pc.EventHandler * @classdesc A pc.SoundInstance plays a {@link pc.Sound}. * @param {pc.SoundManager} manager - The sound manager. * @param {pc.Sound} sound - The sound to play. * @param {object} options - Options for the instance. * @param {number} [options.volume=1] - The playback volume, between 0 and 1. * @param {number} [options.pitch=1] - The relative pitch, default of 1, plays at normal pitch. * @param {boolean} [options.loop=false] - Whether the sound should loop when it reaches the end or not. * @param {number} [options.startTime=0] - The time from which the playback will start in seconds. Default is 0 to start at the beginning. * @param {number} [options.duration=null] - The total time after the startTime in seconds when playback will stop or restart if loop is true. * @param {Function} [options.onPlay=null] - Function called when the instance starts playing. * @param {Function} [options.onPause=null] - Function called when the instance is paused. * @param {Function} [options.onResume=null] - Function called when the instance is resumed. * @param {Function} [options.onStop=null] - Function called when the instance is stopped. * @param {Function} [options.onEnd=null] - Function called when the instance ends. * @property {number} volume The volume modifier to play the sound with. In range 0-1. * @property {number} pitch The pitch modifier to play the sound with. Must be larger than 0.01. * @property {number} startTime The start time from which the sound will start playing. * @property {number} currentTime Gets or sets the current time of the sound that is playing. If the value provided is bigger than the duration of the instance it will wrap from the beginning. * @property {number} duration The duration of the sound that the instance will play starting from startTime. * @property {boolean} loop If true the instance will restart when it finishes playing. * @property {boolean} isPlaying Returns true if the instance is currently playing. * @property {boolean} isPaused Returns true if the instance is currently paused. * @property {boolean} isStopped Returns true if the instance is currently stopped. * @property {boolean} isSuspended Returns true if the instance is currently suspended because the window is not focused. * @property {AudioBufferSourceNode} source Gets the source that plays the sound resource. If the Web Audio API is not supported the type of source is Audio. Source is only available after calling play. * @property {pc.Sound} sound The sound resource that the instance will play. */ class SoundInstance extends pc.EventHandler { constructor(manager: pc.SoundManager, sound: pc.Sound, options: { volume?: number; pitch?: number; loop?: boolean; startTime?: number; duration?: number; onPlay?: (...params: any[]) => any; onPause?: (...params: any[]) => any; onResume?: (...params: any[]) => any; onStop?: (...params: any[]) => any; onEnd?: (...params: any[]) => any; }); /** * @function * @name pc.SoundInstance#play * @description Begins playback of sound. If the sound is not loaded this will return false. * If the sound is already playing this will restart the sound. * @returns {boolean} True if the sound was started. */ play(): boolean; /** * @function * @name pc.SoundInstance#pause * @description Pauses playback of sound. Call resume() to resume playback from the same position. * @returns {boolean} Returns true if the sound was paused. */ pause(): boolean; /** * @function * @name pc.SoundInstance#resume * @description Resumes playback of the sound. Playback resumes at the point that the audio was paused. * @returns {boolean} Returns true if the sound was resumed. */ resume(): boolean; /** * @function * @name pc.SoundInstance#stop * @description Stops playback of sound. Calling play() again will restart playback from the beginning of the sound. * @returns {boolean} Returns true if the sound was stopped. */ stop(): boolean; /** * @function * @name pc.SoundInstance#setExternalNodes * @description Connects external Web Audio API nodes. You need to pass * the first node of the node graph that you created externally and the last node of that graph. The first * node will be connected to the audio source and the last node will be connected to the destination of the * AudioContext (e.g. speakers). Requires Web Audio API support. * @param {AudioNode} firstNode - The first node that will be connected to the audio source of sound instances. * @param {AudioNode} [lastNode] - The last node that will be connected to the destination of the AudioContext. * If unspecified then the firstNode will be connected to the destination instead. * @example * var context = app.systems.sound.context; * var analyzer = context.createAnalyzer(); * var distortion = context.createWaveShaper(); * var filter = context.createBiquadFilter(); * analyzer.connect(distortion); * distortion.connect(filter); * instance.setExternalNodes(analyzer, filter); */ setExternalNodes(firstNode: AudioNode, lastNode?: AudioNode): void; /** * @function * @name pc.SoundInstance#clearExternalNodes * @description Clears any external nodes set by {@link pc.SoundInstance#setExternalNodes}. */ clearExternalNodes(): void; /** * @function * @name pc.SoundInstance#getExternalNodes * @description Gets any external nodes set by {@link pc.SoundInstance#setExternalNodes}. * @returns {AudioNode[]} Returns an array that contains the two nodes set by {@link pc.SoundInstance#setExternalNodes}. */ getExternalNodes(): AudioNode[]; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The volume modifier to play the sound with. In range 0-1. */ volume: number; /** * The pitch modifier to play the sound with. Must be larger than 0.01. */ pitch: number; /** * The start time from which the sound will start playing. */ startTime: number; /** * Gets or sets the current time of the sound that is playing. If the value provided is bigger than the duration of the instance it will wrap from the beginning. */ currentTime: number; /** * The duration of the sound that the instance will play starting from startTime. */ duration: number; /** * If true the instance will restart when it finishes playing. */ loop: boolean; /** * Returns true if the instance is currently playing. */ isPlaying: boolean; /** * Returns true if the instance is currently paused. */ isPaused: boolean; /** * Returns true if the instance is currently stopped. */ isStopped: boolean; /** * Returns true if the instance is currently suspended because the window is not focused. */ isSuspended: boolean; /** * Gets the source that plays the sound resource. If the Web Audio API is not supported the type of source is Audio. Source is only available after calling play. */ source: AudioBufferSourceNode; /** * The sound resource that the instance will play. */ sound: pc.Sound; } /** * @class * @name pc.SoundInstance3d * @augments pc.SoundInstance * @classdesc A pc.SoundInstance3d plays a {@link pc.Sound} in 3D. * @param {pc.SoundManager} manager - The sound manager. * @param {pc.Sound} sound - The sound to play. * @param {object} options - Options for the instance. * @param {number} [options.volume=1] - The playback volume, between 0 and 1. * @param {number} [options.pitch=1] - The relative pitch, default of 1, plays at normal pitch. * @param {boolean} [options.loop=false] - Whether the sound should loop when it reaches the end or not. * @param {number} [options.startTime=0] - The time from which the playback will start. Default is 0 to start at the beginning. * @param {number} [options.duration=null] - The total time after the startTime when playback will stop or restart if loop is true. * @param {pc.Vec3} [options.position=null] - The position of the sound in 3D space. * @param {pc.Vec3} [options.velocity=null] - The velocity of the sound. * @param {string} [options.distanceModel=pc.DISTANCE_LINEAR] - Determines which algorithm to use to reduce the volume of the audio as it moves away from the listener. Can be: * * * {@link pc.DISTANCE_LINEAR} * * {@link pc.DISTANCE_INVERSE} * * {@link pc.DISTANCE_EXPONENTIAL} * * Default is {@link pc.DISTANCE_LINEAR}. * @param {number} [options.refDistance=1] - The reference distance for reducing volume as the sound source moves further from the listener. * @param {number} [options.maxDistance=10000] - The maximum distance from the listener at which audio falloff stops. Note the volume of the audio is not 0 after this distance, but just doesn't fall off anymore. * @param {number} [options.rollOffFactor=1] - The factor used in the falloff equation. * @property {pc.Vec3} position The position of the sound in 3D space. * @property {pc.Vec3} velocity The velocity of the sound. * @property {string} distanceModel Determines which algorithm to use to reduce the volume of the audio as it moves away from the listener. Can be: * * * {@link pc.DISTANCE_LINEAR} * * {@link pc.DISTANCE_INVERSE} * * {@link pc.DISTANCE_EXPONENTIAL} * * Default is {@link pc.DISTANCE_LINEAR}. * @property {number} refDistance The reference distance for reducing volume as the sound source moves further from the listener. * @property {number} maxDistance The maximum distance from the listener at which audio falloff stops. Note the volume of the audio is not 0 after this distance, but just doesn't fall off anymore. * @property {number} rollOffFactor The factor used in the falloff equation. */ class SoundInstance3d extends pc.SoundInstance { constructor(manager: pc.SoundManager, sound: pc.Sound, options: { volume?: number; pitch?: number; loop?: boolean; startTime?: number; duration?: number; position?: pc.Vec3; velocity?: pc.Vec3; distanceModel?: string; refDistance?: number; maxDistance?: number; rollOffFactor?: number; }); /** * @function * @name pc.SoundInstance#play * @description Begins playback of sound. If the sound is not loaded this will return false. * If the sound is already playing this will restart the sound. * @returns {boolean} True if the sound was started. */ play(): boolean; /** * @function * @name pc.SoundInstance#pause * @description Pauses playback of sound. Call resume() to resume playback from the same position. * @returns {boolean} Returns true if the sound was paused. */ pause(): boolean; /** * @function * @name pc.SoundInstance#resume * @description Resumes playback of the sound. Playback resumes at the point that the audio was paused. * @returns {boolean} Returns true if the sound was resumed. */ resume(): boolean; /** * @function * @name pc.SoundInstance#stop * @description Stops playback of sound. Calling play() again will restart playback from the beginning of the sound. * @returns {boolean} Returns true if the sound was stopped. */ stop(): boolean; /** * @function * @name pc.SoundInstance#setExternalNodes * @description Connects external Web Audio API nodes. You need to pass * the first node of the node graph that you created externally and the last node of that graph. The first * node will be connected to the audio source and the last node will be connected to the destination of the * AudioContext (e.g. speakers). Requires Web Audio API support. * @param {AudioNode} firstNode - The first node that will be connected to the audio source of sound instances. * @param {AudioNode} [lastNode] - The last node that will be connected to the destination of the AudioContext. * If unspecified then the firstNode will be connected to the destination instead. * @example * var context = app.systems.sound.context; * var analyzer = context.createAnalyzer(); * var distortion = context.createWaveShaper(); * var filter = context.createBiquadFilter(); * analyzer.connect(distortion); * distortion.connect(filter); * instance.setExternalNodes(analyzer, filter); */ setExternalNodes(firstNode: AudioNode, lastNode?: AudioNode): void; /** * @function * @name pc.SoundInstance#clearExternalNodes * @description Clears any external nodes set by {@link pc.SoundInstance#setExternalNodes}. */ clearExternalNodes(): void; /** * @function * @name pc.SoundInstance#getExternalNodes * @description Gets any external nodes set by {@link pc.SoundInstance#setExternalNodes}. * @returns {AudioNode[]} Returns an array that contains the two nodes set by {@link pc.SoundInstance#setExternalNodes}. */ getExternalNodes(): AudioNode[]; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * The position of the sound in 3D space. */ position: pc.Vec3; /** * The velocity of the sound. */ velocity: pc.Vec3; /** * Determines which algorithm to use to reduce the volume of the audio as it moves away from the listener. Can be: * {@link pc.DISTANCE_LINEAR} * {@link pc.DISTANCE_INVERSE} * {@link pc.DISTANCE_EXPONENTIAL} Default is {@link pc.DISTANCE_LINEAR}. */ distanceModel: string; /** * The reference distance for reducing volume as the sound source moves further from the listener. */ refDistance: number; /** * The maximum distance from the listener at which audio falloff stops. Note the volume of the audio is not 0 after this distance, but just doesn't fall off anymore. */ maxDistance: number; /** * The factor used in the falloff equation. */ rollOffFactor: number; } /** * @class * @name pc.SoundManager * @augments pc.EventHandler * @classdesc The SoundManager is used to load and play audio. As well as apply system-wide settings * like global volume, suspend and resume. * @description Creates a new sound manager. * @param {object} [options] - Options options object. * @param {boolean} [options.forceWebAudioApi] - Always use the Web Audio API even check indicates that it if not available. * @property {number} volume Global volume for the manager. All {@link pc.SoundInstance}s will scale their volume with this volume. Valid between [0, 1]. */ class SoundManager extends pc.EventHandler { constructor(options?: { forceWebAudioApi?: boolean; }); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * Global volume for the manager. All {@link pc.SoundInstance}s will scale their volume with this volume. Valid between [0, 1]. */ volume: number; } /** * @class * @name pc.Sound * @classdesc Represents the resource of an audio asset. * @param {HTMLAudioElement|AudioBuffer} resource - If the Web Audio API is supported, pass an AudioBuffer object, otherwise * an Audio object. * @property {AudioBuffer} buffer If the Web Audio API is supported this contains the audio data. * @property {HTMLAudioElement} audio If the Web Audio API is not supported this contains the audio data. * @property {number} duration Returns the duration of the sound. If the sound is not loaded it returns 0. */ class Sound { constructor(resource: HTMLAudioElement | AudioBuffer); /** * If the Web Audio API is supported this contains the audio data. */ buffer: AudioBuffer; /** * If the Web Audio API is not supported this contains the audio data. */ audio: HTMLAudioElement; /** * Returns the duration of the sound. If the sound is not loaded it returns 0. */ duration: number; } /** * @constant * @type string * @name pc.XRTARGETRAY_GAZE * @description Gaze - indicates the target ray will originate at the viewer and follow the direction it is facing. (This is commonly referred to as a "gaze input" device in the context of head-mounted displays.) */ const XRTARGETRAY_GAZE: string; /** * @constant * @type string * @name pc.XRTARGETRAY_SCREEN * @description Screen - indicates that the input source was an interaction with the canvas element associated with an inline session’s output context, such as a mouse click or touch event. */ const XRTARGETRAY_SCREEN: string; /** * @constant * @type string * @name pc.XRTARGETRAY_POINTER * @description Tracked Pointer - indicates that the target ray originates from either a handheld device or other hand-tracking mechanism and represents that the user is using their hands or the held device for pointing. */ const XRTARGETRAY_POINTER: string; /** * @constant * @type string * @name pc.XRHAND_NONE * @description None - input source is not meant to be held in hands. */ const XRHAND_NONE: string; /** * @constant * @type string * @name pc.XRHAND_LEFT * @description Left - indicates that input source is meant to be held in left hand. */ const XRHAND_LEFT: string; /** * @constant * @type string * @name pc.XRHAND_RIGHT * @description Right - indicates that input source is meant to be held in right hand. */ const XRHAND_RIGHT: string; /** * @class * @name pc.XrInputSource * @augments pc.EventHandler * @classdesc Represents an XR input source, which is any input mechanism which allows the user to perform targeted actions in the same virtual space as the viewer. Example XR input sources include, but are not limited to, handheld controllers, optically tracked hands, and gaze-based input methods that operate on the viewer's pose. * @description Represents an XR input source, which is any input mechanism which allows the user to perform targeted actions in the same virtual space as the viewer. Example XR input sources include, but are not limited to, handheld controllers, optically tracked hands, and gaze-based input methods that operate on the viewer's pose. * @param {pc.XrManager} manager - WebXR Manager. * @param {object} xrInputSource - XRInputSource object that is created by WebXR API. * @property {object} inputSource XRInputSource object that is associated with this input source. * @property {string} targetRayMode Type of ray Input Device is based on. Can be one of the following: * * * {@link pc.XRTARGETRAY_GAZE}: Gaze - indicates the target ray will originate at the viewer and follow the direction it is facing. (This is commonly referred to as a "gaze input" device in the context of head-mounted displays.) * * {@link pc.XRTARGETRAY_SCREEN}: Screen - indicates that the input source was an interaction with the canvas element associated with an inline session’s output context, such as a mouse click or touch event. * * {@link pc.XRTARGETRAY_POINTER}: Tracked Pointer - indicates that the target ray originates from either a handheld device or other hand-tracking mechanism and represents that the user is using their hands or the held device for pointing. * * @property {string} handedness Describes which hand input source is associated with. Can be one of the following: * * * {@link pc.XRHAND_NONE}: None - input source is not meant to be held in hands. * * {@link pc.XRHAND_LEFT}: Left - indicates that input source is meant to be held in left hand. * * {@link pc.XRHAND_RIGHT}: Right - indicates that input source is meant to be held in right hand. * * @property {string[]} profiles List of input profile names indicating both the prefered visual representation and behavior of the input source. * @property {pc.Ray} ray Ray that is calculated based on {pc.XrInputSource#targetRayMode} that can be used for interacting with virtual objects. Its origin and direction are in local space of XR session. * @property {boolean} grip If input source can be held, then it will have node with its world transformation, that can be used to position and rotate virtual joystics based on it. * @property {pc.Vec3|null} position If {pc.XrInputSource#grip} is true, then position will represent position of handheld input source in local space of XR session. * @property {pc.Quat|null} rotation If {pc.XrInputSource#grip} is true, then rotation will represent rotation of handheld input source in local space of XR session. * @property {Gamepad|null} gamepad If input source has buttons, triggers, thumbstick or touchpad, then this object provides access to its states. * @property {boolean} selecting True if input source is in active primary action between selectstart and selectend events. */ class XrInputSource extends pc.EventHandler { constructor(manager: pc.XrManager, xrInputSource: any); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * XRInputSource object that is associated with this input source. */ inputSource: any; /** * Type of ray Input Device is based on. Can be one of the following: * {@link pc.XRTARGETRAY_GAZE}: Gaze - indicates the target ray will originate at the viewer and follow the direction it is facing. (This is commonly referred to as a "gaze input" device in the context of head-mounted displays.) * {@link pc.XRTARGETRAY_SCREEN}: Screen - indicates that the input source was an interaction with the canvas element associated with an inline session’s output context, such as a mouse click or touch event. * {@link pc.XRTARGETRAY_POINTER}: Tracked Pointer - indicates that the target ray originates from either a handheld device or other hand-tracking mechanism and represents that the user is using their hands or the held device for pointing. */ targetRayMode: string; /** * Describes which hand input source is associated with. Can be one of the following: * {@link pc.XRHAND_NONE}: None - input source is not meant to be held in hands. * {@link pc.XRHAND_LEFT}: Left - indicates that input source is meant to be held in left hand. * {@link pc.XRHAND_RIGHT}: Right - indicates that input source is meant to be held in right hand. */ handedness: string; /** * List of input profile names indicating both the prefered visual representation and behavior of the input source. */ profiles: string[]; /** * Ray that is calculated based on {pc.XrInputSource#targetRayMode} that can be used for interacting with virtual objects. Its origin and direction are in local space of XR session. */ ray: pc.Ray; /** * If input source can be held, then it will have node with its world transformation, that can be used to position and rotate virtual joystics based on it. */ grip: boolean; /** * If {pc.XrInputSource#grip} is true, then position will represent position of handheld input source in local space of XR session. */ position: pc.Vec3 | null; /** * If {pc.XrInputSource#grip} is true, then rotation will represent rotation of handheld input source in local space of XR session. */ rotation: pc.Quat | null; /** * If input source has buttons, triggers, thumbstick or touchpad, then this object provides access to its states. */ gamepad: Gamepad | null; /** * True if input source is in active primary action between selectstart and selectend events. */ selecting: boolean; } /** * @class * @name pc.XrInput * @augments pc.EventHandler * @classdesc Provides access to input sources for WebXR. * @description Provides access to input sources for WebXR. * @param {pc.XrManager} manager - WebXR Manager. * @property {pc.XrInputSource[]} inputSources List of active {pc.XrInputSource} */ class XrInput extends pc.EventHandler { constructor(manager: pc.XrManager); /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * List of active {pc.XrInputSource} */ inputSources: pc.XrInputSource[]; } /** * @constant * @type string * @name pc.XRTYPE_INLINE * @description Inline - always available type of session. It has limited features availability and is rendered * into HTML element. */ const XRTYPE_INLINE: string; /** * @constant * @type string * @name pc.XRTYPE_VR * @description Immersive VR - session that provides exclusive access to VR device with best available tracking * features. */ const XRTYPE_VR: string; /** * @constant * @type string * @name pc.XRTYPE_AR * @description Immersive AR - session that provides exclusive access to VR/AR device that is intended to be blended * with real-world environment. */ const XRTYPE_AR: string; /** * @constant * @type string * @name pc.XRSPACE_VIEWER * @description Viewer - always supported space with some basic tracking capabilities. */ const XRSPACE_VIEWER: string; /** * @constant * @type string * @name pc.XRSPACE_LOCAL * @description Local - represents a tracking space with a native origin near the viewer at the time of creation. * The exact position and orientation will be initialized based on the conventions of the underlying platform. * When using this reference space the user is not expected to move beyond their initial position much, if at all, * and tracking is optimized for that purpose. For devices with 6DoF tracking, local reference spaces should * emphasize keeping the origin stable relative to the user’s environment. */ const XRSPACE_LOCAL: string; /** * @constant * @type string * @name pc.XRSPACE_LOCALFLOOR * @description Local Floor - represents a tracking space with a native origin at the floor in a safe position for * the user to stand. The y axis equals 0 at floor level, with the x and z position and orientation initialized * based on the conventions of the underlying platform. Floor level value might be estimated by the underlying * platform. When using this reference space, the user is not expected to move beyond their initial position much, * if at all, and tracking is optimized for that purpose. For devices with 6DoF tracking, local-floor reference * spaces should emphasize keeping the origin stable relative to the user’s environment. */ const XRSPACE_LOCALFLOOR: string; /** * @constant * @type string * @name pc.XRSPACE_BOUNDEDFLOOR * @description Bounded Floor - represents a tracking space with its native origin at the floor, where the user * is expected to move within a pre-established boundary. Tracking in a bounded-floor reference space is optimized * for keeping the native origin and bounds geometry stable relative to the user’s environment. */ const XRSPACE_BOUNDEDFLOOR: string; /** * @constant * @type string * @name pc.XRSPACE_UNBOUNDED * @description Unbounded - represents a tracking space where the user is expected to move freely around their * environment, potentially even long distances from their starting point. Tracking in an unbounded reference space * is optimized for stability around the user’s current position, and as such the native origin may drift over time. */ const XRSPACE_UNBOUNDED: string; /** * @class * @name pc.XrManager * @augments pc.EventHandler * @classdesc Manage and update XR session and its states. * @description Manage and update XR session and its states. * @param {pc.Application} app - The main application. * @property {boolean} supported True if XR is supported. * @property {boolean} active True if XR session is running. * @property {string|null} type Returns type of currently running XR session or null if no session is running. Can be * any of pc.XRTYPE_*. * @property {string|null} spaceType Returns reference space type of currently running XR session or null if no session * is running. Can be any of pc.XRSPACE_*. * @property {pc.Entity|null} camera Active camera for which XR session is running or null. */ class XrManager extends pc.EventHandler { constructor(app: pc.Application); /** * @function * @name pc.XrManager#start * @description Attempts to start XR session for provided {@link pc.CameraComponent} and optionally fires callback when session is created or failed to create. * @param {pc.CameraComponent} camera - it will be used to render XR session and manipulated based on pose tracking * @param {string} type - session type. Can be one of the following: * * * {@link pc.XRTYPE_INLINE}: Inline - always available type of session. It has limited features availability and is rendered into HTML element. * * {@link pc.XRTYPE_VR}: Immersive VR - session that provides exclusive access to VR device with best available tracking features. * * {@link pc.XRTYPE_AR}: Immersive AR - session that provides exclusive access to VR/AR device that is intended to be blended with real-world environment. * * @param {string} spaceType - reference space type. Can be one of the following: * * * {@link pc.XRSPACE_VIEWER}: Viewer - always supported space with some basic tracking capabilities. * * {@link pc.XRSPACE_LOCAL}: Local - represents a tracking space with a native origin near the viewer at the time of creation. It is meant for seated or basic local XR sessions. * * {@link pc.XRSPACE_LOCALFLOOR}: Local Floor - represents a tracking space with a native origin at the floor in a safe position for the user to stand. The y axis equals 0 at floor level. Floor level value might be estimated by the underlying platform. It is meant for seated or basic local XR sessions. * * {@link pc.XRSPACE_BOUNDEDFLOOR}: Bounded Floor - represents a tracking space with its native origin at the floor, where the user is expected to move within a pre-established boundary. * * {@link pc.XRSPACE_UNBOUNDED}: Unbounded - represents a tracking space where the user is expected to move freely around their environment, potentially long distances from their starting point. * * @example * button.on('click', function () { * app.xr.start(camera, pc.XRTYPE_VR, pc.XRSPACE_LOCAL); * }); * @param {pc.callbacks.XrError} [callback] - Optional callback function called once session is started. The callback has one argument Error - it is null if successfully started XR session. */ start(camera: pc.CameraComponent, type: string, spaceType: string, callback?: pc.callbacks.XrError): void; /** * @function * @name pc.XrManager#end * @description Attempts to end XR session and optionally fires callback when session is ended or failed to end. * @example * app.keyboard.on('keydown', function (evt) { * if (evt.key === pc.KEY_ESCAPE && app.xr.active) { * app.xr.end(); * } * }); * @param {pc.callbacks.XrError} [callback] - Optional callback function called once session is started. The callback has one argument Error - it is null if successfully started XR session. */ end(callback?: pc.callbacks.XrError): void; /** * @function * @name pc.XrManager#isAvailable * @description Check if specific type of session is available * @param {string} type - session type. Can be one of the following: * * * {@link pc.XRTYPE_INLINE}: Inline - always available type of session. It has limited features availability and is rendered into HTML element. * * {@link pc.XRTYPE_VR}: Immersive VR - session that provides exclusive access to VR device with best available tracking features. * * {@link pc.XRTYPE_AR}: Immersive AR - session that provides exclusive access to VR/AR device that is intended to be blended with real-world environment. * * @example * if (app.xr.isAvailable(pc.XRTYPE_VR)) { * // VR is available * } * @returns {boolean} True if specified session type is available. */ isAvailable(type: string): boolean; /** * @function * @name pc.EventHandler#on * @description Attach an event handler to an event. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.on('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console */ on(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#off * @description Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, * if scope is not provided then all events with the callback will be unbound. * @param {string} [name] - Name of the event to unbind. * @param {pc.callbacks.HandleEvent} [callback] - Function to be unbound. * @param {object} [scope] - Scope that was used as the this when the event is fired. * @returns {pc.EventHandler} Self for chaining. * @example * var handler = function () { * }; * obj.on('test', handler); * * obj.off(); // Removes all events * obj.off('test'); // Removes all events called 'test' * obj.off('test', handler); // Removes all handler functions, called 'test' * obj.off('test', handler, this); // Removes all hander functions, called 'test' with scope this */ off(name?: string, callback?: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#fire * @description Fire an event, all additional arguments are passed on to the event listener. * @param {object} name - Name of event to fire. * @param {*} [arg1] - First argument that is passed to the event handler. * @param {*} [arg2] - Second argument that is passed to the event handler. * @param {*} [arg3] - Third argument that is passed to the event handler. * @param {*} [arg4] - Fourth argument that is passed to the event handler. * @param {*} [arg5] - Fifth argument that is passed to the event handler. * @param {*} [arg6] - Sixth argument that is passed to the event handler. * @param {*} [arg7] - Seventh argument that is passed to the event handler. * @param {*} [arg8] - Eighth argument that is passed to the event handler. * @returns {pc.EventHandler} Self for chaining. * @example * obj.fire('test', 'This is the message'); */ fire(name: any, arg1?: any, arg2?: any, arg3?: any, arg4?: any, arg5?: any, arg6?: any, arg7?: any, arg8?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#once * @description Attach an event handler to an event. This handler will be removed after being fired once. * @param {string} name - Name of the event to bind the callback to. * @param {pc.callbacks.HandleEvent} callback - Function that is called when event is fired. Note the callback is limited to 8 arguments. * @param {object} [scope] - Object to use as 'this' when the event is fired, defaults to current this. * @returns {pc.EventHandler} Self for chaining. * @example * obj.once('test', function (a, b) { * console.log(a + b); * }); * obj.fire('test', 1, 2); // prints 3 to the console * obj.fire('test', 1, 2); // not going to get handled */ once(name: string, callback: pc.callbacks.HandleEvent, scope?: any): pc.EventHandler; /** * @function * @name pc.EventHandler#hasEvent * @description Test if there are any handlers bound to an event name. * @param {string} name - The name of the event to test. * @returns {boolean} True if the object has handlers bound to the specified event name. * @example * obj.on('test', function () { }); // bind an event to 'test' * obj.hasEvent('test'); // returns true * obj.hasEvent('hello'); // returns false */ hasEvent(name: string): boolean; /** * True if XR is supported. */ supported: boolean; /** * True if XR session is running. */ active: boolean; /** * Returns type of currently running XR session or null if no session is running. Can be any of pc.XRTYPE_*. */ type: string | null; /** * Returns reference space type of currently running XR session or null if no session is running. Can be any of pc.XRSPACE_*. */ spaceType: string | null; /** * Active camera for which XR session is running or null. */ camera: pc.Entity | null; } }