Use arrow functions in all example code

src/framework/asset/asset-registry.js

@@ -373,8 +373,8 @@ class AssetRegistry extends EventHandler {
      *     app.assets.find("Another Asset")
      * ];
      * let count = 0;
-     * assetsToLoad.forEach(function (assetToLoad) {
-     *     assetToLoad.ready(function (asset) {
+     * assetsToLoad.forEach((assetToLoad) => {
+     *     assetToLoad.ready((asset) => {
      *         count++;
      *         if (count === assetsToLoad.length) {
      *             // done

src/framework/asset/asset.js

@@ -564,8 +564,8 @@ class Asset extends EventHandler {
      * @param {object} [scope] - Scope object to use when calling the callback.
      * @example
      * const asset = app.assets.find("My Asset");
-     * asset.ready(function (asset) {
-     *   // asset loaded
+     * asset.ready((asset) => {
+     *     // asset loaded
      * });
      * app.assets.load(asset);
      */

src/framework/bundle/bundle.js

@@ -25,7 +25,7 @@ class Bundle extends EventHandler {
      *
      * @event
      * @example
-     * bundle.on("add", function (url, data) {
+     * bundle.on("add", (url, data) => {
      *     console.log("file added: " + url);
      * });
      */
@@ -36,7 +36,7 @@ class Bundle extends EventHandler {
      *
      * @event
      * @example
-     * bundle.on("load", function () {
+     * bundle.on("load", () => {
      *     console.log("All Bundle files has been loaded");
      * });
      */

src/framework/components/camera/component.js

@@ -1259,7 +1259,7 @@ class CameraComponent extends Component {
      * @example
      * // On an entity with a camera component
      * this.entity.camera.startXr(pc.XRTYPE_VR, pc.XRSPACE_LOCAL, {
-     *     callback: function (err) {
+     *     callback: (err) => {
      *         if (err) {
      *             // failed to start XR session
      *         } else {
@@ -1279,7 +1279,7 @@ class CameraComponent extends Component {
      * 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) {
+     * this.entity.camera.endXr((err) => {
      *     // not anymore in XR
      * });
      */

src/framework/handlers/container.js

@@ -30,7 +30,7 @@ class ContainerResource {
      * contains a hierarchy based on {@link GraphNode}.
      * @example
      * // load a glb file and instantiate an entity with a model component based on it
-     * app.assets.loadFromUrl("statue.glb", "container", function (err, asset) {
+     * app.assets.loadFromUrl("statue.glb", "container", (err, asset) => {
      *     const entity = asset.resource.instantiateModelEntity({
      *         castShadows: true
      *     });
@@ -50,16 +50,16 @@ class ContainerResource {
      * renderable geometry.
      * @example
      * // load a glb file and instantiate an entity with a render component based on it
-     * app.assets.loadFromUrl("statue.glb", "container", function (err, asset) {
+     * app.assets.loadFromUrl("statue.glb", "container", (err, asset) => {
      *     const entity = asset.resource.instantiateRenderEntity({
      *         castShadows: true
      *     });
      *     app.root.addChild(entity);
      *
      *     // find all render components containing mesh instances, and change blend mode on their materials
      *     const renders = entity.findComponents("render");
-     *     renders.forEach(function (render) {
-     *         render.meshInstances.forEach(function (meshInstance) {
+     *     renders.forEach((render) => {
+     *         render.meshInstances.forEach((meshInstance) => {
      *             meshInstance.material.blendType = pc.BLEND_MULTIPLICATIVE;
      *             meshInstance.material.update();
      *         });
@@ -87,13 +87,14 @@ class ContainerResource {
      * null the variant will be reset to the default.
      * @example
      * // load a glb file and instantiate an entity with a render component based on it
-     * app.assets.loadFromUrl("statue.glb", "container", function (err, asset) {
+     * app.assets.loadFromUrl("statue.glb", "container", (err, asset) => {
      *     const entity = asset.resource.instantiateRenderEntity({
      *         castShadows: true
      *     });
      *     app.root.addChild(entity);
      *     const materialVariants = asset.resource.getMaterialVariants();
      *     asset.resource.applyMaterialVariant(entity, materialVariants[0]);
+     * });
      */
     applyMaterialVariant(entity, name) {}
 
@@ -107,7 +108,7 @@ class ContainerResource {
      * the variant will be reset to the default.
      * @example
      * // load a glb file and instantiate an entity with a render component based on it
-     * app.assets.loadFromUrl("statue.glb", "container", function (err, asset) {
+     * app.assets.loadFromUrl("statue.glb", "container", (err, asset) => {
      *     const entity = asset.resource.instantiateRenderEntity({
      *         castShadows: true
      *     });
@@ -118,6 +119,7 @@ class ContainerResource {
      *         const renderComponent = renders[i];
      *         asset.resource.applyMaterialVariantInstances(renderComponent.meshInstances, materialVariants[0]);
      *     }
+     * });
      */
     applyMaterialVariantInstances(instances, name) {}
 }

src/framework/scene-registry.js

@@ -255,7 +255,7 @@ class SceneRegistry {
      * passed (err, sceneItem) where err is null if no errors occurred.
      * @example
      * const sceneItem = app.scenes.find("Scene Name");
-     * app.scenes.loadSceneData(sceneItem, function (err, sceneItem) {
+     * app.scenes.loadSceneData(sceneItem, (err, sceneItem) => {
      *     if (err) {
      *         // error
      *     }
@@ -339,7 +339,7 @@ class SceneRegistry {
      * passed (err, entity) where err is null if no errors occurred.
      * @example
      * const sceneItem = app.scenes.find("Scene Name");
-     * app.scenes.loadSceneHierarchy(sceneItem, function (err, entity) {
+     * app.scenes.loadSceneHierarchy(sceneItem, (err, entity) => {
      *     if (!err) {
      *         const e = app.root.find("My New Entity");
      *     } else {
@@ -360,7 +360,7 @@ class SceneRegistry {
      * are applied. Passed (err) where err is null if no error occurred.
      * @example
      * const sceneItem = app.scenes.find("Scene Name");
-     * app.scenes.loadSceneSettings(sceneItem, function (err) {
+     * app.scenes.loadSceneSettings(sceneItem, (err) => {
      *     if (!err) {
      *         // success
      *     } else {
@@ -392,7 +392,7 @@ class SceneRegistry {
      * @param {ChangeSceneCallback} [callback] - The function to call after loading,
      * passed (err, entity) where err is null if no errors occurred.
      * @example
-     * app.scenes.changeScene("Scene Name", function (err, entity) {
+     * app.scenes.changeScene("Scene Name", (err, entity) => {
      *     if (!err) {
      *         // success
      *     } else {

src/framework/script.js

@@ -35,10 +35,10 @@ const script = {
      * @param {CreateScreenCallback} callback - A function which can set up and tear down a
      * customized loading screen.
      * @example
-     * pc.script.createLoadingScreen(function (app) {
-     *     var showSplashScreen = function () {};
-     *     var hideSplashScreen = function () {};
-     *     var showProgress = function (progress) {};
+     * pc.script.createLoadingScreen((app) => {
+     *     const showSplashScreen = () => {};
+     *     const hideSplashScreen = () => {};
+     *     const showProgress = (progress) => {};
      *     app.on("preload:start", showSplashScreen);
      *     app.on("preload:progress", showProgress);
      *     app.on("start", hideSplashScreen);

src/framework/xr/xr-anchors.js

@@ -258,7 +258,7 @@ class XrAnchors extends EventHandler {
      * @example
      * // create an anchor from a hit test result
      * hitTestSource.on('result', (position, rotation, inputSource, hitTestResult) => {
-     *     app.xr.anchors.create(hitTestResult, function (err, anchor) {
+     *     app.xr.anchors.create(hitTestResult, (err, anchor) => {
      *         if (!err) {
      *             // new anchor has been created
      *         }
@@ -311,7 +311,7 @@ class XrAnchors extends EventHandler {
      * failed to be created.
      * @example
      * // restore an anchor using uuid string
-     * app.xr.anchors.restore(uuid, function (err, anchor) {
+     * app.xr.anchors.restore(uuid, (err, anchor) => {
      *     if (!err) {
      *         // new anchor has been created
      *     }

src/framework/xr/xr-hit-test-source.js

@@ -25,10 +25,10 @@ const poolQuat = [];
  * // start a hit test from a viewer origin forward
  * app.xr.hitTest.start({
  *     spaceType: pc.XRSPACE_VIEWER,
- *     callback: function (err, hitTestSource) {
+ *     callback: (err, hitTestSource) => {
  *         if (err) return;
  *         // subscribe to hit test results
- *         hitTestSource.on('result', function (position, rotation, inputSource, hitTestResult) {
+ *         hitTestSource.on('result', (position, rotation, inputSource, hitTestResult) => {
  *             // position and rotation of hit test result
  *         });
  *     }

src/framework/xr/xr-hit-test.js

@@ -226,9 +226,9 @@ class XrHitTest extends EventHandler {
      * // start hit testing from viewer position facing forwards
      * app.xr.hitTest.start({
      *     spaceType: pc.XRSPACE_VIEWER,
-     *     callback: function (err, hitTestSource) {
+     *     callback: (err, hitTestSource) => {
      *         if (err) return;
-     *         hitTestSource.on('result', function (position, rotation) {
+     *         hitTestSource.on('result', (position, rotation) => {
      *             // position and rotation of hit test result
      *         });
      *     }
@@ -239,7 +239,7 @@ class XrHitTest extends EventHandler {
      * app.xr.hitTest.start({
      *     spaceType: pc.XRSPACE_LOCAL,
      *     offsetRay: ray,
-     *     callback: function (err, hitTestSource) {
+     *     callback: (err, hitTestSource) => {
      *         // hit test source that will sample real world geometry straight down
      *         // from the position where AR session started
      *     }
@@ -248,9 +248,9 @@ class XrHitTest extends EventHandler {
      * // start hit testing for touch screen taps
      * app.xr.hitTest.start({
      *     profile: 'generic-touchscreen',
-     *     callback: function (err, hitTestSource) {
+     *     callback: (err, hitTestSource) => {
      *         if (err) return;
-     *         hitTestSource.on('result', function (position, rotation, inputSource) {
+     *         hitTestSource.on('result', (position, rotation, inputSource) => {
      *             // position and rotation of hit test result
      *             // that will be created from touch on mobile devices
      *         });

src/framework/xr/xr-input-source.js

@@ -668,7 +668,7 @@ class XrInputSource extends EventHandler {
      *
      * @param {object} [options] - Object for passing optional arguments.
      * @param {string[]} [options.entityTypes] - Optional list of underlying entity types against
-     * which hit tests will be performed. Defaults to [ {@link XRTRACKABLE_PLANE} ]. Can be any
+     * which hit tests will be performed. Defaults to [{@link XRTRACKABLE_PLANE}]. Can be any
      * combination of the following:
      *
      * - {@link XRTRACKABLE_POINT}: Point - indicates that the hit test results will be computed
@@ -682,11 +682,11 @@ class XrInputSource extends EventHandler {
      * @param {XrHitTestStartCallback} [options.callback] - Optional callback function called once
      * hit test source is created or failed.
      * @example
-     * app.xr.input.on('add', function (inputSource) {
+     * app.xr.input.on('add', (inputSource) => {
      *     inputSource.hitTestStart({
-     *         callback: function (err, hitTestSource) {
+     *         callback: (err, hitTestSource) => {
      *             if (err) return;
-     *             hitTestSource.on('result', function (position, rotation, inputSource, hitTestResult) {
+     *             hitTestSource.on('result', (position, rotation, inputSource, hitTestResult) => {
      *                 // position and rotation of hit test result
      *                 // that will be created from touch on mobile devices
      *             });

src/scene/graph-node.js

@@ -596,7 +596,7 @@ class GraphNode extends EventHandler {
      * @returns {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
-     * const doors = house.find(function (node) {
+     * const doors = house.find((node) => {
      *     return node.model && node.name.toLowerCase().indexOf('door') !== -1;
      * });
      * @example
@@ -633,7 +633,7 @@ class GraphNode extends EventHandler {
      * node is found.
      * @example
      * // Find the first node that is called 'head' and has a model component
-     * const head = player.findOne(function (node) {
+     * const head = player.findOne((node) => {
      *     return node.model && node.name === 'head';
      * });
      * @example
@@ -733,7 +733,7 @@ class GraphNode extends EventHandler {
      * @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) {
+     * parent.forEach((node) => {
      *     console.log(node.path + "/" + node.name);
      * });
      */