From 8e662d03ea588e4754e8c13f39dd3f5d6d950b43 Mon Sep 17 00:00:00 2001 From: Noeri Huisman Date: Mon, 12 Feb 2024 14:29:57 +0100 Subject: [PATCH] Use import/export instead of require()/module.exports --- .eslintrc.json | 13 +- src/components/anchored.js | 6 +- src/components/animation.js | 11 +- src/components/camera.js | 6 +- src/components/cursor.js | 6 +- .../generic-tracked-controller-controls.js | 10 +- src/components/geometry.js | 9 +- src/components/gltf-model.js | 8 +- src/components/grabbable.js | 2 +- src/components/hand-controls.js | 6 +- src/components/hand-tracking-controls.js | 13 +- src/components/hand-tracking-grab-controls.js | 4 +- src/components/hide-on-enter-ar.js | 4 +- src/components/hide-on-enter-vr.js | 4 +- src/components/hp-mixed-reality-controls.js | 14 +-- src/components/index.js | 112 +++++++++--------- src/components/laser-controls.js | 4 +- src/components/layer.js | 6 +- src/components/light.js | 14 +-- src/components/line.js | 4 +- src/components/link.js | 8 +- src/components/logitech-mx-ink-controls.js | 14 +-- src/components/look-controls.js | 8 +- src/components/magicleap-controls.js | 12 +- src/components/material.js | 13 +- src/components/meta-touch-controls.js | 19 +-- src/components/obb-collider.js | 4 +- src/components/obj-model.js | 8 +- src/components/oculus-go-controls.js | 12 +- src/components/pico-controls.js | 14 +-- src/components/position.js | 4 +- src/components/raycaster.js | 8 +- src/components/rotation.js | 7 +- src/components/scale.js | 4 +- src/components/scene/ar-hit-test.js | 6 +- src/components/scene/background.js | 4 +- src/components/scene/debug.js | 4 +- .../scene/device-orientation-permission-ui.js | 17 ++- src/components/scene/embedded.js | 4 +- src/components/scene/fog.js | 8 +- src/components/scene/inspector.js | 10 +- src/components/scene/keyboard-shortcuts.js | 6 +- src/components/scene/pool.js | 6 +- src/components/scene/real-world-meshing.js | 6 +- src/components/scene/reflection.js | 4 +- src/components/scene/screenshot.js | 6 +- src/components/scene/stats.js | 12 +- src/components/scene/xr-mode-ui.js | 8 +- src/components/shadow.js | 7 +- src/components/sound.js | 8 +- src/components/text.js | 20 ++-- src/components/tracked-controls.js | 6 +- src/components/valve-index-controls.js | 14 +-- src/components/visible.js | 4 +- src/components/vive-controls.js | 12 +- src/components/vive-focus-controls.js | 12 +- src/components/wasd-controls.js | 10 +- src/components/windows-motion-controls.js | 17 +-- src/constants/index.js | 14 +-- src/constants/keyboardevent.js | 22 ++-- src/core/a-assets.js | 12 +- src/core/a-cubemap.js | 2 +- src/core/a-entity.js | 12 +- src/core/a-mixin.js | 8 +- src/core/a-node.js | 13 +- src/core/component.js | 20 ++-- src/core/geometry.js | 14 +-- src/core/propertyTypes.js | 15 +-- src/core/readyState.js | 17 +-- src/core/scene/a-scene.js | 41 +++---- src/core/scene/loadingScreen.js | 12 +- src/core/scene/metaTags.js | 10 +- src/core/scene/postMessage.js | 6 +- src/core/scene/scenes.js | 2 +- src/core/scene/wakelock.js | 6 +- src/core/schema.js | 26 ++-- src/core/shader.js | 17 ++- src/core/system.js | 24 ++-- src/extras/components/index.js | 2 +- src/extras/components/pivot.js | 4 +- src/extras/primitives/getMeshMixin.js | 10 +- src/extras/primitives/index.js | 28 ++--- src/extras/primitives/primitives.js | 20 ++-- src/extras/primitives/primitives/a-camera.js | 2 +- src/extras/primitives/primitives/a-cursor.js | 6 +- .../primitives/primitives/a-curvedimage.js | 6 +- .../primitives/primitives/a-gltf-model.js | 2 +- src/extras/primitives/primitives/a-image.js | 6 +- src/extras/primitives/primitives/a-light.js | 2 +- src/extras/primitives/primitives/a-link.js | 2 +- .../primitives/primitives/a-obj-model.js | 8 +- src/extras/primitives/primitives/a-sky.js | 8 +- src/extras/primitives/primitives/a-sound.js | 2 +- src/extras/primitives/primitives/a-text.js | 2 +- src/extras/primitives/primitives/a-video.js | 6 +- .../primitives/primitives/a-videosphere.js | 6 +- .../primitives/primitives/meshPrimitives.js | 12 +- src/geometries/box.js | 4 +- src/geometries/circle.js | 4 +- src/geometries/cone.js | 4 +- src/geometries/cylinder.js | 4 +- src/geometries/dodecahedron.js | 4 +- src/geometries/icosahedron.js | 4 +- src/geometries/index.js | 28 ++--- src/geometries/octahedron.js | 4 +- src/geometries/plane.js | 4 +- src/geometries/ring.js | 4 +- src/geometries/sphere.js | 4 +- src/geometries/tetrahedron.js | 4 +- src/geometries/torus.js | 4 +- src/geometries/torusKnot.js | 4 +- src/geometries/triangle.js | 4 +- src/index.js | 83 ++++++------- src/lib/three.js | 32 +++-- src/lib/three.mjs | 21 ---- src/shaders/flat.js | 8 +- src/shaders/index.js | 12 +- src/shaders/msdf.js | 6 +- src/shaders/phong.js | 8 +- src/shaders/sdf.js | 6 +- src/shaders/shadow.js | 6 +- src/shaders/standard.js | 8 +- src/systems/camera.js | 6 +- src/systems/geometry.js | 6 +- src/systems/gltf-model.js | 6 +- src/systems/index.js | 20 ++-- src/systems/light.js | 6 +- src/systems/material.js | 11 +- src/systems/obb-collider.js | 2 +- src/systems/renderer.js | 19 ++- src/systems/shadow.js | 6 +- src/systems/tracked-controls.js | 5 +- src/systems/webxr.js | 6 +- src/utils/coordinates.js | 25 ++-- src/utils/debug.js | 7 +- src/utils/device.js | 58 ++++----- src/utils/entity.js | 13 +- src/utils/forceCanvasResizeSafariMobile.js | 4 +- src/utils/index.js | 110 ++++++++--------- src/utils/ios-orientationchange-blank-bug.js | 22 ++-- src/utils/material.js | 38 +++--- src/utils/math.js | 7 +- src/utils/object-pool.js | 10 +- src/utils/split.js | 2 +- src/utils/src-loader.js | 4 +- src/utils/styleParser.js | 11 +- src/utils/tracked-controls.js | 20 ++-- tests/__init.test.js | 93 ++++++++------- tests/components/animation.test.js | 5 +- tests/components/camera.test.js | 2 +- tests/components/cursor.test.js | 3 +- tests/components/geometry.test.js | 5 +- tests/components/gltf-model.test.js | 4 +- tests/components/hand-controls.test.js | 2 +- .../components/hand-tracking-controls.test.js | 2 +- tests/components/laser-controls.test.js | 2 +- tests/components/light.test.js | 4 +- tests/components/line.test.js | 2 +- tests/components/link.test.js | 2 +- tests/components/look-controls.test.js | 2 +- tests/components/material.test.js | 6 +- tests/components/meta-touch-controls.test.js | 2 +- tests/components/obj-model.test.js | 2 +- tests/components/oculus-go-controls.test.js | 2 +- tests/components/position.test.js | 2 +- tests/components/raycaster.test.js | 2 +- tests/components/rotation.test.js | 5 +- tests/components/scale.test.js | 2 +- .../scene/device-motion-permission-ui.test.js | 2 +- tests/components/scene/embedded.test.js | 2 +- tests/components/scene/fog.test.js | 2 +- tests/components/scene/pool.test.js | 2 +- tests/components/scene/stats.test.js | 8 +- tests/components/scene/xr-mode-ui.test.js | 29 +++-- tests/components/shadow.test.js | 4 +- tests/components/sound.test.js | 4 +- tests/components/text.test.js | 4 +- tests/components/tracked-controls.test.js | 2 +- tests/components/visible.test.js | 2 +- tests/components/vive-controls.test.js | 2 +- tests/components/vive-focus-controls.test.js | 2 +- .../windows-motion-controls.test.js | 2 +- tests/core/a-assets.test.js | 6 +- tests/core/a-entity.test.js | 13 +- tests/core/a-mixin.test.js | 5 +- tests/core/component.test.js | 31 +++-- tests/core/controls.test.js | 6 +- tests/core/geometry.test.js | 4 +- tests/core/loadingScreen.test.js | 2 +- tests/core/propertyTypes.test.js | 2 +- tests/core/readyState.test.js | 4 +- tests/core/scene/a-scene.test.js | 19 ++- tests/core/scene/meta-tags.test.js | 8 +- tests/core/schema.test.js | 11 +- tests/core/shader.test.js | 4 +- tests/core/system.test.js | 5 +- tests/extras/components/pivot.test.js | 4 +- tests/extras/primitives/primitives.test.js | 7 +- .../primitives/primitives/a-cursor.test.js | 2 +- .../primitives/primitives/a-obj-model.test.js | 2 +- .../primitives/primitives/a-sky.test.js | 2 +- .../primitives/primitives/a-torus.test.js | 4 +- .../primitives/meshPrimitives.test.js | 8 +- tests/helpers.js | 23 ++-- tests/shaders/flat.test.js | 2 +- tests/shaders/phong.test.js | 4 +- tests/shaders/standard.test.js | 4 +- tests/systems/camera.test.js | 4 +- tests/systems/geometry.test.js | 2 +- tests/systems/light.test.js | 4 +- tests/systems/material.test.js | 2 +- tests/systems/renderer.test.js | 9 +- tests/systems/shadow.test.js | 2 +- tests/utils/bind.test.js | 2 +- tests/utils/coordinates.test.js | 2 +- tests/utils/device.test.js | 2 +- tests/utils/entity.test.js | 4 +- tests/utils/isIOSOlderThan10.test.js | 2 +- tests/utils/objects.test.js | 2 +- tests/utils/src-loader.test.js | 4 +- tests/utils/throttle.test.js | 2 +- tests/utils/throttleTick.test.js | 2 +- tests/utils/tracked-controls.test.js | 2 +- vendor/DeviceOrientationControls.js | 2 +- webpack.config.js | 6 +- webpack.prod.config.js | 6 +- 226 files changed, 1030 insertions(+), 1158 deletions(-) delete mode 100644 src/lib/three.mjs diff --git a/.eslintrc.json b/.eslintrc.json index 4bbff20a404..781006f6d6d 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -4,6 +4,9 @@ "ecmaVersion": 12 }, "rules": { + /* To work towards no-build. */ + "import/extensions": ["warn", "always", { "js": "always" }], + /* These rules are incompatible with ES5. */ "no-var": "off", "object-shorthand": "off", @@ -36,8 +39,14 @@ The exception is that ES6 classes are used sparingly - see exceptions below. */ "files": ["./src/**/*.js"], "parserOptions": { - "sourceType": "script", - "ecmaVersion": 5 + "sourceType": "module", + "ecmaVersion": 6 + } + }, + { + "files": ["./src/utils/index.js"], + "parserOptions": { + "ecmaVersion": 11 } }, { diff --git a/src/components/anchored.js b/src/components/anchored.js index dbec5606075..3dc1771b380 100644 --- a/src/components/anchored.js +++ b/src/components/anchored.js @@ -1,6 +1,6 @@ /* global THREE, XRRigidTransform, localStorage */ -var registerComponent = require('../core/component').registerComponent; -var utils = require('../utils/'); +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; var warn = utils.debug('components:anchored:warn'); /** @@ -9,7 +9,7 @@ var warn = utils.debug('components:anchored:warn'); * Once anchored the entity remains to a fixed position in real-world space. * If the anchor is persistent, the anchor positioned remains across sessions or until the browser data is cleared. */ -module.exports.Component = registerComponent('anchored', { +export var Component = registerComponent('anchored', { schema: { persistent: {default: false} }, diff --git a/src/components/animation.js b/src/components/animation.js index b6c290e250b..29aa2aec58e 100644 --- a/src/components/animation.js +++ b/src/components/animation.js @@ -1,8 +1,7 @@ -var anime = require('super-animejs').default; -var components = require('../core/component').components; -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); -var utils = require('../utils'); +import THREE from '../lib/three.js'; +import anime from 'super-animejs'; +import { registerComponent, components } from '../core/component.js'; +import * as utils from '../utils/index.js'; var colorHelperFrom = new THREE.Color(); var colorHelperTo = new THREE.Color(); @@ -39,7 +38,7 @@ var STRING_OBJECT3D = 'object3D'; * @member {object} animation - anime.js instance. * @member {boolean} animationIsPlaying - Control if animation is playing. */ -module.exports.Component = registerComponent('animation', { +export var Component = registerComponent('animation', { schema: { autoplay: {default: true}, delay: {default: 0}, diff --git a/src/components/camera.js b/src/components/camera.js index a32599ecb46..1d92a07b082 100644 --- a/src/components/camera.js +++ b/src/components/camera.js @@ -1,11 +1,11 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; /** * Camera component. * Pairs along with camera system to handle tracking the active camera. */ -module.exports.Component = registerComponent('camera', { +export var Component = registerComponent('camera', { schema: { active: {default: true}, far: {default: 10000}, diff --git a/src/components/cursor.js b/src/components/cursor.js index 11863d385d8..349e121c7e4 100644 --- a/src/components/cursor.js +++ b/src/components/cursor.js @@ -1,6 +1,6 @@ /* global THREE, MouseEvent, TouchEvent */ -var registerComponent = require('../core/component').registerComponent; -var utils = require('../utils/'); +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; var EVENTS = { CLICK: 'click', @@ -41,7 +41,7 @@ var CANVAS_HOVER_CLASS = 'a-mouse-cursor-hover'; * @member {Element} intersectedEl - Currently-intersected entity. Used to keep track to * emit events when unintersecting. */ -module.exports.Component = registerComponent('cursor', { +export var Component = registerComponent('cursor', { dependencies: ['raycaster'], schema: { diff --git a/src/components/generic-tracked-controller-controls.js b/src/components/generic-tracked-controller-controls.js index cf700f41a9c..1a3f21fdc49 100644 --- a/src/components/generic-tracked-controller-controls.js +++ b/src/components/generic-tracked-controller-controls.js @@ -1,9 +1,5 @@ -var registerComponent = require('../core/component').registerComponent; - -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; +import { registerComponent } from '../core/component.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; var GAMEPAD_ID_PREFIX = 'generic'; @@ -33,7 +29,7 @@ var INPUT_MAPPING = { * controller buttons: trackpad, trigger * Load a controller model and highlight the pressed buttons. */ -module.exports.Component = registerComponent('generic-tracked-controller-controls', { +export var Component = registerComponent('generic-tracked-controller-controls', { schema: { hand: {default: ''}, // This informs the degenerate arm model. defaultModel: {default: true}, diff --git a/src/components/geometry.js b/src/components/geometry.js index 45e12c25bd2..cf0d953726a 100644 --- a/src/components/geometry.js +++ b/src/components/geometry.js @@ -1,7 +1,6 @@ -var geometries = require('../core/geometry').geometries; -var geometryNames = require('../core/geometry').geometryNames; -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { geometries, geometryNames } from '../core/geometry.js'; +import { registerComponent } from '../core/component.js'; var dummyGeometry = new THREE.BufferGeometry(); @@ -9,7 +8,7 @@ var dummyGeometry = new THREE.BufferGeometry(); * Geometry component. Combined with material component to make a mesh in 3D object. * Extended with registered geometries. */ -module.exports.Component = registerComponent('geometry', { +export var Component = registerComponent('geometry', { schema: { buffer: {default: true}, primitive: {default: 'box', oneOf: geometryNames, schemaChange: true}, diff --git a/src/components/gltf-model.js b/src/components/gltf-model.js index 75b97416dc6..a2bdbf916ca 100644 --- a/src/components/gltf-model.js +++ b/src/components/gltf-model.js @@ -1,12 +1,12 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; var warn = utils.debug('components:gltf-model:warn'); /** * glTF model loader. */ -module.exports.Component = registerComponent('gltf-model', { +export var Component = registerComponent('gltf-model', { schema: {type: 'model'}, init: function () { diff --git a/src/components/grabbable.js b/src/components/grabbable.js index bfb5a7cb3e6..eac764dbabf 100644 --- a/src/components/grabbable.js +++ b/src/components/grabbable.js @@ -1,4 +1,4 @@ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; registerComponent('grabbable', { init: function () { diff --git a/src/components/hand-controls.js b/src/components/hand-controls.js index 61b19054767..f06ce37e40c 100644 --- a/src/components/hand-controls.js +++ b/src/components/hand-controls.js @@ -1,7 +1,7 @@ /* global THREE */ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; // Found at https://github.com/aframevr/assets. var MODEL_URLS = { toonLeft: AFRAME_CDN_ROOT + 'controllers/hands/leftHand.glb', @@ -48,7 +48,7 @@ EVENTS[ANIMATIONS.point] = 'pointing'; * * @property {string} Hand mapping (`left`, `right`). */ -module.exports.Component = registerComponent('hand-controls', { +export var Component = registerComponent('hand-controls', { schema: { color: {default: 'white', type: 'color'}, hand: { default: 'left' }, diff --git a/src/components/hand-tracking-controls.js b/src/components/hand-tracking-controls.js index 1755b68899f..0f24cba9200 100644 --- a/src/components/hand-tracking-controls.js +++ b/src/components/hand-tracking-controls.js @@ -1,12 +1,9 @@ /* global THREE, XRHand */ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; +import { AEntity } from '../core/a-entity.js'; +import { checkControllerPresentAndSetup } from '../utils/tracked-controls.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; -var AEntity = require('../core/a-entity').AEntity; - -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; - -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var LEFT_HAND_MODEL_URL = AFRAME_CDN_ROOT + 'controllers/oculus-hands/v4/left.glb'; var RIGHT_HAND_MODEL_URL = AFRAME_CDN_ROOT + 'controllers/oculus-hands/v4/right.glb'; @@ -48,7 +45,7 @@ var PINCH_END_DISTANCE = 0.02; /** * Controls for hand tracking */ -module.exports.Component = registerComponent('hand-tracking-controls', { +export var Component = registerComponent('hand-tracking-controls', { schema: { hand: {default: 'right', oneOf: ['left', 'right']}, modelStyle: {default: 'mesh', oneOf: ['dots', 'mesh']}, diff --git a/src/components/hand-tracking-grab-controls.js b/src/components/hand-tracking-grab-controls.js index 6725cbd782f..dce335d6a00 100644 --- a/src/components/hand-tracking-grab-controls.js +++ b/src/components/hand-tracking-grab-controls.js @@ -1,5 +1,5 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); +import { registerComponent } from '../core/component.js'; +import THREE from '../lib/three.js'; registerComponent('hand-tracking-grab-controls', { schema: { diff --git a/src/components/hide-on-enter-ar.js b/src/components/hide-on-enter-ar.js index d6dfbb7565a..c928d69a96e 100644 --- a/src/components/hide-on-enter-ar.js +++ b/src/components/hide-on-enter-ar.js @@ -1,6 +1,6 @@ -var register = require('../core/component').registerComponent; +import { registerComponent as register } from '../core/component.js'; -module.exports.Component = register('hide-on-enter-ar', { +export var Component = register('hide-on-enter-ar', { init: function () { var self = this; this.el.sceneEl.addEventListener('enter-vr', function () { diff --git a/src/components/hide-on-enter-vr.js b/src/components/hide-on-enter-vr.js index 8618e121102..b42c0cec28a 100644 --- a/src/components/hide-on-enter-vr.js +++ b/src/components/hide-on-enter-vr.js @@ -1,6 +1,6 @@ -var register = require('../core/component').registerComponent; +import { registerComponent as register } from '../core/component.js'; -module.exports.Component = register('hide-on-enter-vr', { +export var Component = register('hide-on-enter-vr', { init: function () { var self = this; this.el.sceneEl.addEventListener('enter-vr', function () { diff --git a/src/components/hp-mixed-reality-controls.js b/src/components/hp-mixed-reality-controls.js index e935a0a95a5..3aedfcc34b6 100644 --- a/src/components/hp-mixed-reality-controls.js +++ b/src/components/hp-mixed-reality-controls.js @@ -1,16 +1,12 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); - -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; +import { registerComponent } from '../core/component.js'; +import THREE from '../lib/three.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; // See Profiles Registry: // https://github.com/immersive-web/webxr-input-profiles/tree/master/packages/registry // TODO: Add a more robust system for deriving gamepad name. var GAMEPAD_ID = 'hp-mixed-reality'; -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var HP_MIXED_REALITY_MODEL_GLB_BASE_URL = AFRAME_CDN_ROOT + 'controllers/hp/mixed-reality/'; var HP_MIXED_REALITY_POSITION_OFFSET = {x: 0, y: 0, z: 0.06}; @@ -41,7 +37,7 @@ var INPUT_MAPPING_WEBXR = { /** * HP Mixed Reality Controls */ -module.exports.Component = registerComponent('hp-mixed-reality-controls', { +export var Component = registerComponent('hp-mixed-reality-controls', { schema: { hand: {default: 'none'}, model: {default: true} diff --git a/src/components/index.js b/src/components/index.js index ac0cca2ac17..0754d87768d 100644 --- a/src/components/index.js +++ b/src/components/index.js @@ -1,57 +1,57 @@ -require('./animation'); -require('./anchored'); -require('./camera'); -require('./cursor'); -require('./geometry'); -require('./generic-tracked-controller-controls'); -require('./gltf-model'); -require('./grabbable'); -require('./hand-tracking-controls'); -require('./hand-tracking-grab-controls'); -require('./hand-controls'); -require('./hide-on-enter-ar'); -require('./hide-on-enter-vr'); -require('./hp-mixed-reality-controls'); -require('./layer'); -require('./laser-controls'); -require('./light'); -require('./line'); -require('./link'); -require('./logitech-mx-ink-controls'); -require('./look-controls'); -require('./magicleap-controls'); -require('./material'); -require('./obb-collider'); -require('./obj-model'); -require('./oculus-go-controls'); -require('./meta-touch-controls'); -require('./pico-controls'); -require('./position'); -require('./raycaster'); -require('./rotation'); -require('./scale'); -require('./shadow'); -require('./sound'); -require('./text'); -require('./tracked-controls'); -require('./visible'); -require('./valve-index-controls'); -require('./vive-controls'); -require('./vive-focus-controls'); -require('./wasd-controls'); -require('./windows-motion-controls'); +import './animation.js'; +import './anchored.js'; +import './camera.js'; +import './cursor.js'; +import './geometry.js'; +import './generic-tracked-controller-controls.js'; +import './gltf-model.js'; +import './grabbable.js'; +import './hand-tracking-controls.js'; +import './hand-tracking-grab-controls.js'; +import './hand-controls.js'; +import './hide-on-enter-ar.js'; +import './hide-on-enter-vr.js'; +import './hp-mixed-reality-controls.js'; +import './layer.js'; +import './laser-controls.js'; +import './light.js'; +import './line.js'; +import './link.js'; +import './logitech-mx-ink-controls.js'; +import './look-controls.js'; +import './magicleap-controls.js'; +import './material.js'; +import './meta-touch-controls.js'; +import './obb-collider.js'; +import './obj-model.js'; +import './oculus-go-controls.js'; +import './pico-controls.js'; +import './position.js'; +import './raycaster.js'; +import './rotation.js'; +import './scale.js'; +import './shadow.js'; +import './sound.js'; +import './text.js'; +import './tracked-controls.js'; +import './visible.js'; +import './valve-index-controls.js'; +import './vive-controls.js'; +import './vive-focus-controls.js'; +import './wasd-controls.js'; +import './windows-motion-controls.js'; -require('./scene/ar-hit-test'); -require('./scene/background'); -require('./scene/debug'); -require('./scene/device-orientation-permission-ui'); -require('./scene/embedded'); -require('./scene/inspector'); -require('./scene/fog'); -require('./scene/keyboard-shortcuts'); -require('./scene/pool'); -require('./scene/real-world-meshing'); -require('./scene/reflection'); -require('./scene/screenshot'); -require('./scene/stats'); -require('./scene/xr-mode-ui'); +import './scene/ar-hit-test.js'; +import './scene/background.js'; +import './scene/debug.js'; +import './scene/device-orientation-permission-ui.js'; +import './scene/embedded.js'; +import './scene/inspector.js'; +import './scene/fog.js'; +import './scene/keyboard-shortcuts.js'; +import './scene/pool.js'; +import './scene/real-world-meshing.js'; +import './scene/reflection.js'; +import './scene/screenshot.js'; +import './scene/stats.js'; +import './scene/xr-mode-ui.js'; diff --git a/src/components/laser-controls.js b/src/components/laser-controls.js index 9198aa78660..ea0f404b58e 100644 --- a/src/components/laser-controls.js +++ b/src/components/laser-controls.js @@ -1,5 +1,5 @@ -var registerComponent = require('../core/component').registerComponent; -var utils = require('../utils/'); +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; registerComponent('laser-controls', { schema: { diff --git a/src/components/layer.js b/src/components/layer.js index 6f9d147dc30..cfd6ad78506 100644 --- a/src/components/layer.js +++ b/src/components/layer.js @@ -1,9 +1,9 @@ /* global THREE, XRRigidTransform, XRWebGLBinding */ -var registerComponent = require('../core/component').registerComponent; -var utils = require('../utils/'); +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; var warn = utils.debug('components:layer:warn'); -module.exports.Component = registerComponent('layer', { +export var Component = registerComponent('layer', { schema: { type: {default: 'quad', oneOf: ['quad', 'monocubemap', 'stereocubemap']}, src: {type: 'map'}, diff --git a/src/components/light.js b/src/components/light.js index 93a690967a3..fa0e8d93afe 100644 --- a/src/components/light.js +++ b/src/components/light.js @@ -1,9 +1,7 @@ -var utils = require('../utils'); -var diff = utils.diff; -var debug = require('../utils/debug'); -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); -var mathUtils = require('../utils/math'); +import THREE from '../lib/three.js'; +import { diff, debug, srcLoader } from '../utils/index.js'; +import { registerComponent } from '../core/component.js'; +import * as mathUtils from '../utils/math.js'; var degToRad = THREE.MathUtils.degToRad; var warn = debug('components:light:warn'); @@ -14,7 +12,7 @@ var probeCache = {}; /** * Light component. */ -module.exports.Component = registerComponent('light', { +export var Component = registerComponent('light', { schema: { angle: {default: 60, if: {type: ['spot']}}, color: {type: 'color', if: {type: ['ambient', 'directional', 'hemisphere', 'point', 'spot']}}, @@ -352,7 +350,7 @@ module.exports.Component = registerComponent('light', { // Populate the cache if not done for this envMap yet if (probeCache[data.envMap] === undefined) { probeCache[data.envMap] = new window.Promise(function (resolve) { - utils.srcLoader.validateCubemapSrc(data.envMap, function loadEnvMap (urls) { + srcLoader.validateCubemapSrc(data.envMap, function loadEnvMap (urls) { CubeLoader.load(urls, function (cube) { var tempLightProbe = THREE.LightProbeGenerator.fromCubeTexture(cube); probeCache[data.envMap] = tempLightProbe; diff --git a/src/components/line.js b/src/components/line.js index 3696e7e54d1..ba23441dbc4 100644 --- a/src/components/line.js +++ b/src/components/line.js @@ -1,7 +1,7 @@ /* global THREE */ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; -module.exports.Component = registerComponent('line', { +export var Component = registerComponent('line', { schema: { start: {type: 'vec3', default: {x: 0, y: 0, z: 0}}, end: {type: 'vec3', default: {x: 0, y: 0, z: 0}}, diff --git a/src/components/link.js b/src/components/link.js index 69d0cb259ed..6c929ea68b6 100644 --- a/src/components/link.js +++ b/src/components/link.js @@ -1,6 +1,6 @@ -var registerComponent = require('../core/component').registerComponent; -var registerShader = require('../core/shader').registerShader; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; +import { registerShader } from '../core/shader.js'; var DEFAULT_PREVIEW_DISTANCE = 15.0; /** @@ -8,7 +8,7 @@ var DEFAULT_PREVIEW_DISTANCE = 15.0; * * @member {object} hiddenEls - Store the hidden elements during peek mode. */ -module.exports.Component = registerComponent('link', { +export var Component = registerComponent('link', { schema: { backgroundColor: {default: 'red', type: 'color'}, borderColor: {default: 'white', type: 'color'}, diff --git a/src/components/logitech-mx-ink-controls.js b/src/components/logitech-mx-ink-controls.js index 1c45eb7e422..2947bcd3978 100644 --- a/src/components/logitech-mx-ink-controls.js +++ b/src/components/logitech-mx-ink-controls.js @@ -1,16 +1,12 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); - -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; // See Profiles Registry: // https://github.com/immersive-web/webxr-input-profiles/tree/master/packages/registry // TODO: Add a more robust system for deriving gamepad name. var GAMEPAD_ID = 'logitech-mx-ink'; -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var LOGITECH_MX_INK_MODEL_GLB_BASE_URL = AFRAME_CDN_ROOT + 'controllers/logitech/'; /** @@ -34,7 +30,7 @@ var INPUT_MAPPING_WEBXR = { /** * Logitech MX Ink Controls */ -module.exports.Component = registerComponent('logitech-mx-ink-controls', { +export var Component = registerComponent('logitech-mx-ink-controls', { schema: { hand: {default: 'left'}, model: {default: true}, diff --git a/src/components/look-controls.js b/src/components/look-controls.js index 1f092dbf63c..bc5e6695544 100644 --- a/src/components/look-controls.js +++ b/src/components/look-controls.js @@ -1,7 +1,7 @@ /* global DeviceOrientationEvent */ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; // To avoid recalculation at every mouse movement tick var PI_2 = Math.PI / 2; @@ -9,7 +9,7 @@ var PI_2 = Math.PI / 2; /** * look-controls. Update entity pose, factoring mouse, touch. */ -module.exports.Component = registerComponent('look-controls', { +export var Component = registerComponent('look-controls', { dependencies: ['position', 'rotation'], schema: { diff --git a/src/components/magicleap-controls.js b/src/components/magicleap-controls.js index d4c6b464c5c..8b6c0519e17 100644 --- a/src/components/magicleap-controls.js +++ b/src/components/magicleap-controls.js @@ -1,9 +1,6 @@ -var registerComponent = require('../core/component').registerComponent; - -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; +import { registerComponent } from '../core/component.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; // See Profiles Registry: // https://github.com/immersive-web/webxr-input-profiles/tree/master/packages/registry @@ -11,7 +8,6 @@ var onButtonEvent = trackedControlsUtils.onButtonEvent; var GAMEPAD_ID_PREFIX = 'magicleap'; var GAMEPAD_ID_SUFFIX = '-one'; var GAMEPAD_ID_COMPOSITE = GAMEPAD_ID_PREFIX + GAMEPAD_ID_SUFFIX; -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var MAGICLEAP_CONTROLLER_MODEL_GLB_URL = AFRAME_CDN_ROOT + 'controllers/magicleap/magicleap-one-controller.glb'; /** @@ -36,7 +32,7 @@ var INPUT_MAPPING_WEBXR = { * buttons: trigger, grip, touchpad, and menu. * Load a controller model. */ -module.exports.Component = registerComponent('magicleap-controls', { +export var Component = registerComponent('magicleap-controls', { schema: { hand: {default: 'none'}, model: {default: true} diff --git a/src/components/material.js b/src/components/material.js index 118905aecd7..f91f158a7cf 100644 --- a/src/components/material.js +++ b/src/components/material.js @@ -1,13 +1,10 @@ /* global Promise */ -var utils = require('../utils/'); -var component = require('../core/component'); -var THREE = require('../lib/three'); -var shader = require('../core/shader'); +import THREE from '../lib/three.js'; +import * as utils from '../utils/index.js'; +import { registerComponent } from '../core/component.js'; +import { shaders, shaderNames } from '../core/shader.js'; var error = utils.debug('components:material:error'); -var registerComponent = component.registerComponent; -var shaders = shader.shaders; -var shaderNames = shader.shaderNames; /** * Material component. @@ -16,7 +13,7 @@ var shaderNames = shader.shaderNames; * three.js's implementation of PBR. Another standard shading model is `flat` which * uses MeshBasicMaterial. */ -module.exports.Component = registerComponent('material', { +export var Component = registerComponent('material', { schema: { alphaTest: {default: 0.0, min: 0.0, max: 1.0}, depthTest: {default: true}, diff --git a/src/components/meta-touch-controls.js b/src/components/meta-touch-controls.js index 61359cf00d2..b70c20ef5f5 100644 --- a/src/components/meta-touch-controls.js +++ b/src/components/meta-touch-controls.js @@ -1,16 +1,12 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); - -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; // Prefix for Gen1 and Gen2 Oculus Touch Controllers. var GAMEPAD_ID_PREFIX = 'oculus-touch'; // First generation model URL. -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var TOUCH_CONTROLLER_MODEL_BASE_URL = AFRAME_CDN_ROOT + 'controllers/oculus/oculus-touch-controller-'; var META_CONTROLLER_MODEL_BASE_URL = AFRAME_CDN_ROOT + 'controllers/meta/'; @@ -125,7 +121,7 @@ var INPUT_MAPPING = { * controller buttons: thumbstick, trigger, grip, xbutton, ybutton, surface * Load a controller model and highlight the pressed buttons. */ -var componentConfig = { +export var Component = registerComponent('meta-touch-controls', { schema: { hand: {default: 'left'}, buttonColor: {type: 'color', default: '#999'}, // Off-white. @@ -474,10 +470,7 @@ var componentConfig = { button.material.color.set(color); } } -}; - -registerComponent('oculus-touch-controls', componentConfig); -module.exports.Component = registerComponent('meta-touch-controls', componentConfig); +}); /** * Some of the controller models share the same material for different parts (buttons, triggers...). diff --git a/src/components/obb-collider.js b/src/components/obb-collider.js index 329964819ee..ec8a97f9426 100644 --- a/src/components/obb-collider.js +++ b/src/components/obb-collider.js @@ -1,5 +1,5 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; registerComponent('obb-collider', { schema: { diff --git a/src/components/obj-model.js b/src/components/obj-model.js index a7683ff0d82..721f1e7fd2e 100644 --- a/src/components/obj-model.js +++ b/src/components/obj-model.js @@ -1,10 +1,10 @@ -var debug = require('../utils/debug'); -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); +import { debug } from '../utils/index.js'; +import { registerComponent } from '../core/component.js'; +import THREE from '../lib/three.js'; var warn = debug('components:obj-model:warn'); -module.exports.Component = registerComponent('obj-model', { +export var Component = registerComponent('obj-model', { schema: { mtl: {type: 'model'}, obj: {type: 'model'} diff --git a/src/components/oculus-go-controls.js b/src/components/oculus-go-controls.js index 5b4d850f222..5b5c4fb054d 100644 --- a/src/components/oculus-go-controls.js +++ b/src/components/oculus-go-controls.js @@ -1,11 +1,7 @@ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; - -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var OCULUS_GO_CONTROLLER_MODEL_URL = AFRAME_CDN_ROOT + 'controllers/oculus/go/oculus-go-controller.gltf'; // Prefix for Gen1 and Gen2 Oculus Touch Controllers. @@ -33,7 +29,7 @@ var INPUT_MAPPING = { * controller buttons: trigger, touchpad * Load a controller model and highlight the pressed buttons. */ -module.exports.Component = registerComponent('oculus-go-controls', { +export var Component = registerComponent('oculus-go-controls', { schema: { hand: {default: ''}, // This informs the degenerate arm model. buttonColor: {type: 'color', default: '#FFFFFF'}, diff --git a/src/components/pico-controls.js b/src/components/pico-controls.js index 17fd3234282..b7ef4d87ccf 100644 --- a/src/components/pico-controls.js +++ b/src/components/pico-controls.js @@ -1,16 +1,12 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); - -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; +import { registerComponent } from '../core/component.js'; +import THREE from '../lib/three.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; // See Profiles Registry: // https://github.com/immersive-web/webxr-input-profiles/tree/master/packages/registry // TODO: Add a more robust system for deriving gamepad name. var GAMEPAD_ID = 'pico-4'; -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var PICO_MODEL_GLB_BASE_URL = AFRAME_CDN_ROOT + 'controllers/pico/pico4/'; /** @@ -38,7 +34,7 @@ var INPUT_MAPPING_WEBXR = { /** * Pico Controls */ -module.exports.Component = registerComponent('pico-controls', { +export var Component = registerComponent('pico-controls', { schema: { hand: {default: 'none'}, model: {default: true} diff --git a/src/components/position.js b/src/components/position.js index 8073930d2dd..b07e89d6cc6 100644 --- a/src/components/position.js +++ b/src/components/position.js @@ -1,6 +1,6 @@ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; -module.exports.Component = registerComponent('position', { +export var Component = registerComponent('position', { schema: {type: 'vec3'}, update: function () { diff --git a/src/components/raycaster.js b/src/components/raycaster.js index 0f82970b07c..f40bddcfb60 100644 --- a/src/components/raycaster.js +++ b/src/components/raycaster.js @@ -1,8 +1,8 @@ /* global MutationObserver */ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; var warn = utils.debug('components:raycaster:warn'); @@ -40,7 +40,7 @@ var EVENTS = { * @member {number} prevCheckTime - Previous time intersection was checked. To help interval. * @member {object} raycaster - three.js Raycaster. */ -module.exports.Component = registerComponent('raycaster', { +export var Component = registerComponent('raycaster', { schema: { autoRefresh: {default: true}, direction: {type: 'vec3', default: {x: 0, y: 0, z: -1}}, diff --git a/src/components/rotation.js b/src/components/rotation.js index 93a363083ba..5697a88c5de 100644 --- a/src/components/rotation.js +++ b/src/components/rotation.js @@ -1,7 +1,8 @@ -var degToRad = require('../lib/three').MathUtils.degToRad; -var registerComponent = require('../core/component').registerComponent; +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; +var degToRad = THREE.MathUtils.degToRad; -module.exports.Component = registerComponent('rotation', { +export var Component = registerComponent('rotation', { schema: {type: 'vec3'}, /** diff --git a/src/components/scale.js b/src/components/scale.js index 59bc364eb1f..ce8a94ec7b9 100644 --- a/src/components/scale.js +++ b/src/components/scale.js @@ -1,6 +1,6 @@ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; -module.exports.Component = registerComponent('scale', { +export var Component = registerComponent('scale', { schema: { type: 'vec3', default: {x: 1, y: 1, z: 1} diff --git a/src/components/scene/ar-hit-test.js b/src/components/scene/ar-hit-test.js index 21dacfb0026..b660692c0ce 100644 --- a/src/components/scene/ar-hit-test.js +++ b/src/components/scene/ar-hit-test.js @@ -1,7 +1,7 @@ /* global ImageData, Map, Set */ +import THREE from '../../lib/three.js'; +import { registerComponent as register } from '../../core/component.js'; var arrowURL = 'data:image/webp;base64,UklGRkQHAABXRUJQVlA4WAoAAAAQAAAA/wEA/wEAQUxQSL0DAAARDzD/ERGCjrY9sYYFfgo6aa1kJ7K0w9Lo3AadLSVeFxevQwj5kuM8RfR/Atw/C0+ozB/oUBrloFZs6ElSW88j1KA4yExNWQaqRZquIDF0JYmlq0hAuUDTFu66tng3teW7pa3cQf1V1edvur54M/Slm6Wv3Gx9zw0MXlQLntcsBN6wkHjTQuYtC4W3LTw8mGRVG57TbAROtxHfZNhInGkjc5aNwtk2Hg6Mvki14k+NkZzCwQgCxalcAv3kddRTPI1DcUrXId1FLf1uHpzaQz4tquhZVLlKesbVpqKeTj0n0F5PpXDlFN9UqmhalL/ImuZFo6KmToWLoKlddMprqlS8cKovBvHo2kTiFV2LN4msaxKZl3QNiair8xYRdDWivIvXVXmbcMqJ51UebZuFXxZt6xd4laxtciqRtA3Cv0nU1t+kEUFbI8JvCa+tvkm3FDlO/W+OR99+kWEp/YYo+tYfTVnf/K8cE/F///3vv//993eeL+a+uvjawLcX3xjYvJotBFY3kVjTRGFtE+BU2AiMbiQyhpHMWEYeBozAH5qNBYRDB5KBCaTDBKKBAZTDBoKBDjwHAN5ABeCJBsAZcAAC0YHHxAYSMYBiYgGZWEA2MYFCbCCZGAAIANFEB+AnYgMQTDQAYSJ2AN5EBZAm4gDgTDgAeSIu4DGygTIRN1CMLOCZiACykQlg4jsAycgA8AO+BxCNdJyDkcbwRirDGXGnx8w+FDPrkM3MQ9JQZMYhiiwV/RDMtIM3U1/DmXHUo+IR2kSR2ToWkQ1NIn2qf2J8LCqJKiDUiSADHY3whirhdHgZ94HKaR97PhE+twEUJUFoAcgyTct8hfSxSkShASDKdMJ/ritKHwgyQ0sD4D/miCxU5SbhOOUDTnZpccCjYP/i0bZ/8bAgtVGEoGapWIQXyzKVKLwgNJFk2rtMIgoNRJlOZF7SNSSyUEeQmbxBFKEmtYjEe8S8zOZ1AkJVCmS88FJOtF40Ksg4oUaFiygk3C8qlTVNyl8UTevCUdAE2t14PfVqU1FPp57TopKeQZWromddTQp6QOfTOEQt/ZDuipZ11w/wOiqO8dRORcc6BQEkDQMClaHcn5wV9yLbxsNZNgpn2sicYSNxuo34Js1G4FQbnuNsOPa28PCWhcKbFjJvWEi8ZiHwqgXPcxbc5db33Cx95WboSzddX7yp+vyN0+eul7ZyN7Xlu64t3jVt4c5pc4JLV5EYupJE0xUknC4nOjVlmaYpyLit53HCQ0+ScnqceNcS5dzUkd0/CwMAVlA4IGADAAAQXwCdASoAAgACP8ne6Wy/tjCpqJ/IA/A5CWlu4XYBG/Pz8AfwD8APz//f3v8E1fuHZnxKYACtfuHZnxKYACrYTb5mOslhxu843ecbvON3nG7zjd3a0VCn7G1MABVxwH/Xd25gAK1+4dmfEpe2+PHhQaj75++riG6FuYACtfuHZnxKYACRrK3q9xO8Ss3uWKnMhs/rDF1hi6wxdYYusMXWGI5QRcCFDZog5OgqNlse1NDuz/UoFa/cOzPiUwAEsAOK4/nu5eZHK2tlXxJfNYlMABWv3Dsz4bvNJ5YA/LtxJ38SmAArX7h2Z8Sk5vdZUYv7mZPiUwAFa/cOzPh21s5OgZxf1mfEpemRyFr/rM+JS9noA/LtxJ38SmAAlUJIotzAASn6TjdhK+D3Dsz4dyvB7h2Z8O2tnJ0DOL+sz4lL2nKLT4lL/+iSLOocxq639w7M34MNZdm55uJ8v8ra2cpVZnxKTq2F3PN/cNksAfl24k7+JTAASqrD37h2Z7b1W+VtbOUqsz4lJ1bC7nm/uGyWAPy7cSd/EpgAJVVh79w7M9t6rfK2tnKVWZ8Sk6thdzzf3DZLAH5duJO/iUwAEqqw9+4dme29VvlbWzlKrM+JSdWwu55v7hslgD8u3EnfxKYACVVYe/cOzPbeq3ytrZylVme0kYJ8557FLerqFrzIbPrrf3DZLAH5duJO/iUvaVMS9BoaF4p7pSDFTP1XMyfElelrM0DOL+sz4eBJ13nV1OppBGPuKb4YzXQgq9uH19uS/0+JS9t9fr6ZUlQBelDG6GMgq97otb5QMPJwtKyBTbFp8Sl7b6/X0ykkawEOsgdiE6Fi0vb/Eve6xkwsmug0Z4nGNHQO8839bpTsjpz7SWIJxKagvd1QWMa6FYT1KEw3j4XDT6vJ9Xk+nyfT5Pq8n1eEmk5dinMM/9Fcfz4Z3Dsz3KD2dw7LxBRxKrqUUGQPH/7zxr1KIfNpLEJ0MZB2ITM/0Z2EFoh12NlXnEcpYcbvON3nG7zjd5xu84vfcNIAAP7+y8ceyzbVxkakPYY4lcr72fqOnDwipv+yxC71wAADBrjKnAAAAAAAAAAAAAAw7oNGHttqWONcoFN/2WIDc2pa6WVFtFYROlsaMaTXdcOjXHz93+YxAglKa4AAAAA='; -var register = require('../../core/component').registerComponent; -var THREE = require('../../lib/three'); var CAM_LAYER = 21; var applyPose = (function () { @@ -205,7 +205,7 @@ HitTest.updateAnchorPoses = function (frame, refSpace) { }; var hitTestCache; -module.exports.Component = register('ar-hit-test', { +export var Component = register('ar-hit-test', { schema: { target: { type: 'selector' }, enabled: { default: true }, diff --git a/src/components/scene/background.js b/src/components/scene/background.js index f15714c5b21..10bb3683127 100644 --- a/src/components/scene/background.js +++ b/src/components/scene/background.js @@ -1,7 +1,7 @@ /* global THREE */ -var register = require('../../core/component').registerComponent; +import { registerComponent as register } from '../../core/component.js'; -module.exports.Component = register('background', { +export var Component = register('background', { schema: { color: { type: 'color', default: 'black' }, transparent: { default: false } diff --git a/src/components/scene/debug.js b/src/components/scene/debug.js index 8bd6f8b9961..7d04ffd673f 100644 --- a/src/components/scene/debug.js +++ b/src/components/scene/debug.js @@ -1,6 +1,6 @@ -var register = require('../../core/component').registerComponent; +import { registerComponent as register } from '../../core/component.js'; -module.exports.Component = register('debug', { +export var Component = register('debug', { schema: {default: true}, sceneOnly: true }); diff --git a/src/components/scene/device-orientation-permission-ui.js b/src/components/scene/device-orientation-permission-ui.js index 40e68d47b3c..5a42fb50a5a 100644 --- a/src/components/scene/device-orientation-permission-ui.js +++ b/src/components/scene/device-orientation-permission-ui.js @@ -1,7 +1,6 @@ /* global DeviceOrientationEvent, location */ -var registerComponent = require('../../core/component').registerComponent; - -var constants = require('../../constants/'); +import { registerComponent } from '../../core/component.js'; +import { AFRAME_INJECTED } from '../../constants/index.js'; var MODAL_CLASS = 'a-modal'; var DIALOG_CLASS = 'a-dialog'; @@ -16,7 +15,7 @@ var DIALOG_OK_BUTTON_CLASS = 'a-dialog-ok-button'; /** * UI for enabling device motion permission */ -module.exports.Component = registerComponent('device-orientation-permission-ui', { +export var Component = registerComponent('device-orientation-permission-ui', { schema: { enabled: {default: true}, deviceMotionMessage: { @@ -120,13 +119,13 @@ function createPermissionDialog ( // Buttons denyButton = document.createElement('button'); denyButton.classList.add(DIALOG_BUTTON_CLASS, DIALOG_DENY_BUTTON_CLASS); - denyButton.setAttribute(constants.AFRAME_INJECTED, ''); + denyButton.setAttribute(AFRAME_INJECTED, ''); denyButton.innerHTML = denyText; buttonsContainer.appendChild(denyButton); acceptButton = document.createElement('button'); acceptButton.classList.add(DIALOG_BUTTON_CLASS, DIALOG_ALLOW_BUTTON_CLASS); - acceptButton.setAttribute(constants.AFRAME_INJECTED, ''); + acceptButton.setAttribute(AFRAME_INJECTED, ''); acceptButton.innerHTML = allowText; buttonsContainer.appendChild(acceptButton); @@ -154,7 +153,7 @@ function createAlertDialog (closeText, dialogText, onOkClicked) { // Buttons okButton = document.createElement('button'); okButton.classList.add(DIALOG_BUTTON_CLASS, DIALOG_OK_BUTTON_CLASS); - okButton.setAttribute(constants.AFRAME_INJECTED, ''); + okButton.setAttribute(AFRAME_INJECTED, ''); okButton.innerHTML = closeText; buttonsContainer.appendChild(okButton); @@ -175,11 +174,11 @@ function createDialog (text, buttonsContainerEl) { modalContainer = document.createElement('div'); modalContainer.classList.add(MODAL_CLASS); - modalContainer.setAttribute(constants.AFRAME_INJECTED, ''); + modalContainer.setAttribute(AFRAME_INJECTED, ''); dialog = document.createElement('div'); dialog.className = DIALOG_CLASS; - dialog.setAttribute(constants.AFRAME_INJECTED, ''); + dialog.setAttribute(AFRAME_INJECTED, ''); modalContainer.appendChild(dialog); dialogTextContainer = document.createElement('div'); diff --git a/src/components/scene/embedded.js b/src/components/scene/embedded.js index 58a0d8d6fd5..ef65e8af3b3 100644 --- a/src/components/scene/embedded.js +++ b/src/components/scene/embedded.js @@ -1,9 +1,9 @@ -var registerComponent = require('../../core/component').registerComponent; +import { registerComponent } from '../../core/component.js'; /** * Component to embed an a-frame scene within the layout of a 2D page. */ -module.exports.Component = registerComponent('embedded', { +export var Component = registerComponent('embedded', { dependencies: ['xr-mode-ui'], schema: {default: true}, diff --git a/src/components/scene/fog.js b/src/components/scene/fog.js index c7a4e905ac1..955b2e5dfb3 100644 --- a/src/components/scene/fog.js +++ b/src/components/scene/fog.js @@ -1,6 +1,6 @@ -var register = require('../../core/component').registerComponent; -var THREE = require('../../lib/three'); -var debug = require('../../utils/debug'); +import { registerComponent as register } from '../../core/component.js'; +import THREE from '../../lib/three.js'; +import { debug } from '../../utils/index.js'; var warn = debug('components:fog:warn'); @@ -8,7 +8,7 @@ var warn = debug('components:fog:warn'); * Fog component. * Applies only to the scene entity. */ -module.exports.Component = register('fog', { +export var Component = register('fog', { schema: { color: {type: 'color', default: '#000'}, density: {default: 0.00025}, diff --git a/src/components/scene/inspector.js b/src/components/scene/inspector.js index 66bce97e9d3..61b7a5accad 100644 --- a/src/components/scene/inspector.js +++ b/src/components/scene/inspector.js @@ -1,8 +1,8 @@ /* global AFRAME, INSPECTOR_VERSION */ -var AFRAME_INJECTED = require('../../constants').AFRAME_INJECTED; -var pkg = require('../../../package'); -var registerComponent = require('../../core/component').registerComponent; -var utils = require('../../utils/'); +import { AFRAME_INJECTED } from '../../constants/index.js'; +import { registerComponent } from '../../core/component.js'; +import pkg from '../../../package.json'; +import * as utils from '../../utils/index.js'; /** * 0.4.2 to 0.4.x @@ -20,7 +20,7 @@ var INSPECTOR_URL = typeof INSPECTOR_VERSION !== 'undefined' && INSPECTOR_VERSIO var LOADING_MESSAGE = 'Loading Inspector'; var LOADING_ERROR_MESSAGE = 'Error loading Inspector'; -module.exports.Component = registerComponent('inspector', { +export var Component = registerComponent('inspector', { schema: { url: {default: INSPECTOR_URL} }, diff --git a/src/components/scene/keyboard-shortcuts.js b/src/components/scene/keyboard-shortcuts.js index dc4f9dda50b..a52bd85ce69 100644 --- a/src/components/scene/keyboard-shortcuts.js +++ b/src/components/scene/keyboard-shortcuts.js @@ -1,7 +1,7 @@ -var registerComponent = require('../../core/component').registerComponent; -var shouldCaptureKeyEvent = require('../../utils/').shouldCaptureKeyEvent; +import { registerComponent } from '../../core/component.js'; +import { shouldCaptureKeyEvent } from '../../utils/index.js'; -module.exports.Component = registerComponent('keyboard-shortcuts', { +export var Component = registerComponent('keyboard-shortcuts', { schema: { enterVR: {default: true}, exitVR: {default: true} diff --git a/src/components/scene/pool.js b/src/components/scene/pool.js index 173d477ebcb..a313b808a84 100644 --- a/src/components/scene/pool.js +++ b/src/components/scene/pool.js @@ -1,5 +1,5 @@ -var debug = require('../../utils/debug'); -var registerComponent = require('../../core/component').registerComponent; +import { debug } from '../../utils/index.js'; +import { registerComponent } from '../../core/component.js'; var warn = debug('components:pool:warn'); @@ -11,7 +11,7 @@ var warn = debug('components:pool:warn'); * @member {array} availableEls - Available entities in the pool. * @member {array} usedEls - Entities of the pool in use. */ -module.exports.Component = registerComponent('pool', { +export var Component = registerComponent('pool', { schema: { container: {default: ''}, mixin: {default: ''}, diff --git a/src/components/scene/real-world-meshing.js b/src/components/scene/real-world-meshing.js index a2569da61c1..9fb09835e8b 100644 --- a/src/components/scene/real-world-meshing.js +++ b/src/components/scene/real-world-meshing.js @@ -1,6 +1,6 @@ /* global XRPlane, XRMesh */ -var register = require('../../core/component').registerComponent; -var THREE = require('../../lib/three'); +import THREE from '../../lib/three.js'; +import { registerComponent as register } from '../../core/component.js'; /** * Real World Meshing. @@ -9,7 +9,7 @@ var THREE = require('../../lib/three'); * It requires a browser with support for the WebXR Mesh and Plane detection modules. * */ -module.exports.Component = register('real-world-meshing', { +export var Component = register('real-world-meshing', { schema: { filterLabels: {type: 'array'}, meshesEnabled: {default: true}, diff --git a/src/components/scene/reflection.js b/src/components/scene/reflection.js index 8ad39ddd6ea..8e08858ebca 100644 --- a/src/components/scene/reflection.js +++ b/src/components/scene/reflection.js @@ -1,5 +1,5 @@ /* global THREE, XRWebGLBinding */ -var register = require('../../core/component').registerComponent; +import { registerComponent as register } from '../../core/component.js'; // source: view-source:https://storage.googleapis.com/chromium-webxr-test/r886480/proposals/lighting-estimation.html function updateLights (estimate, probeLight, directionalLight, directionalLightPosition) { @@ -22,7 +22,7 @@ function updateLights (estimate, probeLight, directionalLight, directionalLightP } } -module.exports.Component = register('reflection', { +export var Component = register('reflection', { schema: { directionalLight: { type: 'selector' } }, diff --git a/src/components/scene/screenshot.js b/src/components/scene/screenshot.js index 43e1eb47817..78442f1c401 100644 --- a/src/components/scene/screenshot.js +++ b/src/components/scene/screenshot.js @@ -1,6 +1,6 @@ /* global ImageData, URL */ -var registerComponent = require('../../core/component').registerComponent; -var THREE = require('../../lib/three'); +import { registerComponent } from '../../core/component.js'; +import THREE from '../../lib/three.js'; var VERTEX_SHADER = [ 'attribute vec3 position;', @@ -43,7 +43,7 @@ var FRAGMENT_SHADER = [ * The cube map produced by the CubeCamera is projected on a quad and then rendered to * WebGLRenderTarget with an orthographic camera. */ -module.exports.Component = registerComponent('screenshot', { +export var Component = registerComponent('screenshot', { schema: { width: {default: 4096}, height: {default: 2048}, diff --git a/src/components/scene/stats.js b/src/components/scene/stats.js index f2296ed707f..a0e5a9f6911 100644 --- a/src/components/scene/stats.js +++ b/src/components/scene/stats.js @@ -1,8 +1,8 @@ -var registerComponent = require('../../core/component').registerComponent; -var RStats = require('../../../vendor/rStats'); -var utils = require('../../utils'); -require('../../../vendor/rStats.extras'); -require('../../lib/rStatsAframe'); +import { registerComponent } from '../../core/component.js'; +import RStats from '../../../vendor/rStats.js'; +import * as utils from '../../utils/index.js'; +import '../../../vendor/rStats.extras.js'; +import '../../lib/rStatsAframe.js'; var AFrameStats = window.aframeStats; var HIDDEN_CLASS = 'a-hidden'; @@ -11,7 +11,7 @@ var ThreeStats = window.threeStats; /** * Stats appended to document.body by RStats. */ -module.exports.Component = registerComponent('stats', { +export var Component = registerComponent('stats', { schema: {default: true}, sceneOnly: true, diff --git a/src/components/scene/xr-mode-ui.js b/src/components/scene/xr-mode-ui.js index 0e420bca750..f9f3b006d30 100644 --- a/src/components/scene/xr-mode-ui.js +++ b/src/components/scene/xr-mode-ui.js @@ -1,6 +1,6 @@ -var registerComponent = require('../../core/component').registerComponent; -var constants = require('../../constants/'); -var utils = require('../../utils/'); +import { registerComponent } from '../../core/component.js'; +import * as constants from '../../constants/index.js'; +import * as utils from '../../utils/index.js'; var ENTER_VR_CLASS = 'a-enter-vr'; var ENTER_AR_CLASS = 'a-enter-ar'; @@ -13,7 +13,7 @@ var ORIENTATION_MODAL_CLASS = 'a-orientation-modal'; /** * UI for entering VR mode. */ -module.exports.Component = registerComponent('xr-mode-ui', { +export var Component = registerComponent('xr-mode-ui', { dependencies: ['canvas'], schema: { diff --git a/src/components/shadow.js b/src/components/shadow.js index fa19a6a33be..bfca35f48c1 100644 --- a/src/components/shadow.js +++ b/src/components/shadow.js @@ -1,6 +1,5 @@ -var component = require('../core/component'); -var THREE = require('../lib/three'); -var registerComponent = component.registerComponent; +import THREE from '../lib/three.js'; +import { registerComponent } from '../core/component.js'; /** * Shadow component. @@ -8,7 +7,7 @@ var registerComponent = component.registerComponent; * When applied to an entity, that entity's geometry and any descendants will cast or receive * shadows as specified by the `cast` and `receive` properties. */ -module.exports.Component = registerComponent('shadow', { +export var Component = registerComponent('shadow', { schema: { cast: {default: true}, receive: {default: true} diff --git a/src/components/sound.js b/src/components/sound.js index fb3040729ee..d5a19b46dc7 100644 --- a/src/components/sound.js +++ b/src/components/sound.js @@ -1,13 +1,13 @@ -var registerComponent = require('../core/component').registerComponent; -var debug = require('../utils/debug'); -var THREE = require('../lib/three'); +import { registerComponent } from '../core/component.js'; +import { debug } from '../utils/index.js'; +import THREE from '../lib/three.js'; var warn = debug('components:sound:warn'); /** * Sound component. */ -module.exports.Component = registerComponent('sound', { +export var Component = registerComponent('sound', { schema: { autoplay: {default: false}, distanceModel: {default: 'inverse', oneOf: ['linear', 'inverse', 'exponential']}, diff --git a/src/components/text.js b/src/components/text.js index fbce4bc388f..d216bcf971b 100644 --- a/src/components/text.js +++ b/src/components/text.js @@ -1,13 +1,13 @@ -var createTextGeometry = require('three-bmfont-text'); -var loadBMFont = require('load-bmfont'); +import createTextGeometry from 'three-bmfont-text'; +import loadBMFont from 'load-bmfont'; -var registerComponent = require('../core/component').registerComponent; -var coreShader = require('../core/shader'); -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import { registerComponent } from '../core/component.js'; +import { shaders } from '../core/shader.js'; +import THREE from '../lib/three.js'; +import * as utils from '../utils/index.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; var error = utils.debug('components:text:error'); -var shaders = coreShader.shaders; var warn = utils.debug('components:text:warn'); // 1 to match other A-Frame default widths. @@ -16,9 +16,8 @@ var DEFAULT_WIDTH = 1; // @bryik set anisotropy to 16. Improves look of large amounts of text when viewed from angle. var MAX_ANISOTROPY = 16; -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var FONT_BASE_URL = AFRAME_CDN_ROOT + 'fonts/'; -var FONTS = { +export var FONTS = { aileronsemibold: FONT_BASE_URL + 'Aileron-Semibold.fnt', dejavu: FONT_BASE_URL + 'DejaVu-sdf.fnt', exo2bold: FONT_BASE_URL + 'Exo2Bold.fnt', @@ -31,7 +30,6 @@ var FONTS = { }; var MSDF_FONTS = ['roboto']; var DEFAULT_FONT = 'roboto'; -module.exports.FONTS = FONTS; var cache = new PromiseCache(); var fontWidthFactors = {}; @@ -47,7 +45,7 @@ var protocolRe = /^\w+:/; * All the stock fonts are for the `sdf` registered shader, an improved version of jam3's * original `sdf` shader. */ -module.exports.Component = registerComponent('text', { +export var Component = registerComponent('text', { multiple: true, schema: { diff --git a/src/components/tracked-controls.js b/src/components/tracked-controls.js index b139bcc0c3a..0f5761ee91f 100644 --- a/src/components/tracked-controls.js +++ b/src/components/tracked-controls.js @@ -1,5 +1,5 @@ -var controllerUtils = require('../utils/tracked-controls'); -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; +import * as controllerUtils from '../utils/tracked-controls.js'; var EVENTS = { AXISMOVE: 'axismove', @@ -24,7 +24,7 @@ var EVENTS = { * @property {boolean} handTrackingEnabled - Assumes a controller exposed via the WebXR Hand Input Module. * @property {boolean} iterateControllerProfiles - Iterates over all of the WebXR controller input profiles. */ -module.exports.Component = registerComponent('tracked-controls', { +export var Component = registerComponent('tracked-controls', { schema: { id: {type: 'string', default: ''}, controller: {default: -1}, diff --git a/src/components/valve-index-controls.js b/src/components/valve-index-controls.js index 9388d18bd68..e6fd514ea92 100644 --- a/src/components/valve-index-controls.js +++ b/src/components/valve-index-controls.js @@ -1,12 +1,8 @@ -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); +import { registerComponent } from '../core/component.js'; +import THREE from '../lib/three.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; - -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var INDEX_CONTROLLER_MODEL_BASE_URL = AFRAME_CDN_ROOT + 'controllers/valve/index/valve-index-'; var INDEX_CONTROLLER_MODEL_URL = { left: INDEX_CONTROLLER_MODEL_BASE_URL + 'left.glb', @@ -31,7 +27,7 @@ var INDEX_CONTROLLER_POSITION_OFFSET = { * trackpad, trigger, grip, menu, system * Load a controller model and highlight the pressed buttons. */ -module.exports.Component = registerComponent('valve-index-controls', { +export var Component = registerComponent('valve-index-controls', { schema: { hand: {default: 'left'}, buttonColor: {type: 'color', default: '#FAFAFA'}, // Off-white. diff --git a/src/components/visible.js b/src/components/visible.js index 37494952a68..2e9ceada3af 100644 --- a/src/components/visible.js +++ b/src/components/visible.js @@ -1,9 +1,9 @@ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; /** * Visibility component. */ -module.exports.Component = registerComponent('visible', { +export var Component = registerComponent('visible', { schema: {default: true}, update: function () { diff --git a/src/components/vive-controls.js b/src/components/vive-controls.js index 4f598ca9969..9a2cf1c82d1 100644 --- a/src/components/vive-controls.js +++ b/src/components/vive-controls.js @@ -1,11 +1,7 @@ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; - -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var VIVE_CONTROLLER_MODEL_OBJ_URL = AFRAME_CDN_ROOT + 'controllers/vive/vr_controller_vive.obj'; var VIVE_CONTROLLER_MODEL_OBJ_MTL = AFRAME_CDN_ROOT + 'controllers/vive/vr_controller_vive.mtl'; @@ -36,7 +32,7 @@ var INPUT_MAPPING = { * touchpad, trigger, grip, menu, system * Load a controller model and highlight the pressed buttons. */ -module.exports.Component = registerComponent('vive-controls', { +export var Component = registerComponent('vive-controls', { schema: { hand: {default: 'left'}, buttonColor: {type: 'color', default: '#FAFAFA'}, // Off-white. diff --git a/src/components/vive-focus-controls.js b/src/components/vive-focus-controls.js index 3731a617be9..27a47a795c1 100644 --- a/src/components/vive-focus-controls.js +++ b/src/components/vive-focus-controls.js @@ -1,11 +1,7 @@ -var registerComponent = require('../core/component').registerComponent; +import { registerComponent } from '../core/component.js'; +import { AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; - -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var VIVE_FOCUS_CONTROLLER_MODEL_URL = AFRAME_CDN_ROOT + 'controllers/vive/focus-controller/focus-controller.gltf'; // Prefix for HTC Vive Focus Controllers. @@ -28,7 +24,7 @@ var INPUT_MAPPING = { * controller buttons: trackpad, trigger * Load a controller model and highlight the pressed buttons. */ -module.exports.Component = registerComponent('vive-focus-controls', { +export var Component = registerComponent('vive-focus-controls', { schema: { hand: {default: ''}, // This informs the degenerate arm model. buttonTouchedColor: {type: 'color', default: '#BBBBBB'}, diff --git a/src/components/wasd-controls.js b/src/components/wasd-controls.js index 94fdc5482e1..c7a6ba5829e 100644 --- a/src/components/wasd-controls.js +++ b/src/components/wasd-controls.js @@ -1,7 +1,7 @@ -var KEYCODE_TO_CODE = require('../constants').keyboardevent.KEYCODE_TO_CODE; -var registerComponent = require('../core/component').registerComponent; -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import THREE from '../lib/three.js'; +import { KEYCODE_TO_CODE } from '../constants/keyboardevent.js'; +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; var shouldCaptureKeyEvent = utils.shouldCaptureKeyEvent; @@ -15,7 +15,7 @@ var KEYS = [ /** * WASD component to control entities using WASD keys. */ -module.exports.Component = registerComponent('wasd-controls', { +export var Component = registerComponent('wasd-controls', { schema: { acceleration: {default: 65}, adAxis: {default: 'x', oneOf: ['x', 'y', 'z']}, diff --git a/src/components/windows-motion-controls.js b/src/components/windows-motion-controls.js index 2b722e55b71..200a6c6f571 100644 --- a/src/components/windows-motion-controls.js +++ b/src/components/windows-motion-controls.js @@ -1,19 +1,12 @@ /* global THREE */ -var registerComponent = require('../core/component').registerComponent; - -var trackedControlsUtils = require('../utils/tracked-controls'); -var checkControllerPresentAndSetup = trackedControlsUtils.checkControllerPresentAndSetup; -var emitIfAxesChanged = trackedControlsUtils.emitIfAxesChanged; -var onButtonEvent = trackedControlsUtils.onButtonEvent; - -var utils = require('../utils/'); +import { registerComponent } from '../core/component.js'; +import * as utils from '../utils/index.js'; +import { DEFAULT_HANDEDNESS, AFRAME_CDN_ROOT } from '../constants/index.js'; +import { checkControllerPresentAndSetup, emitIfAxesChanged, onButtonEvent } from '../utils/tracked-controls.js'; var debug = utils.debug('components:windows-motion-controls:debug'); var warn = utils.debug('components:windows-motion-controls:warn'); -var DEFAULT_HANDEDNESS = require('../constants').DEFAULT_HANDEDNESS; - -var AFRAME_CDN_ROOT = require('../constants').AFRAME_CDN_ROOT; var MODEL_BASE_URL = AFRAME_CDN_ROOT + 'controllers/microsoft/'; var MODEL_FILENAMES = { left: 'left.glb', right: 'right.glb', default: 'universal.glb' }; @@ -52,7 +45,7 @@ var INPUT_MAPPING = { * controller buttons: trackpad, trigger, grip, menu, thumbstick * Load a controller model and transform the pressed buttons. */ -module.exports.Component = registerComponent('windows-motion-controls', { +export var Component = registerComponent('windows-motion-controls', { schema: { hand: {default: DEFAULT_HANDEDNESS}, // It is possible to have multiple pairs of controllers attached (a pair has both left and right). diff --git a/src/constants/index.js b/src/constants/index.js index d22bd401485..3c57d02e763 100644 --- a/src/constants/index.js +++ b/src/constants/index.js @@ -1,7 +1,7 @@ -module.exports = { - AFRAME_CDN_ROOT: window.AFRAME_CDN_ROOT || 'https://cdn.aframe.io/', - AFRAME_INJECTED: 'aframe-injected', - DEFAULT_CAMERA_HEIGHT: 1.6, - DEFAULT_HANDEDNESS: 'right', - keyboardevent: require('./keyboardevent') -}; +import { KEYCODE_TO_CODE } from './keyboardevent.js'; + +export var AFRAME_CDN_ROOT = window.AFRAME_CDN_ROOT || 'https://cdn.aframe.io/'; +export var AFRAME_INJECTED = 'aframe-injected'; +export var DEFAULT_CAMERA_HEIGHT = 1.6; +export var DEFAULT_HANDEDNESS = 'right'; +export var keyboardevent = KEYCODE_TO_CODE; diff --git a/src/constants/keyboardevent.js b/src/constants/keyboardevent.js index 7e70bc5afaa..83cbfe0c304 100644 --- a/src/constants/keyboardevent.js +++ b/src/constants/keyboardevent.js @@ -1,13 +1,11 @@ -module.exports = { - // Tiny KeyboardEvent.code polyfill. - KEYCODE_TO_CODE: { - '38': 'ArrowUp', - '37': 'ArrowLeft', - '40': 'ArrowDown', - '39': 'ArrowRight', - '87': 'KeyW', - '65': 'KeyA', - '83': 'KeyS', - '68': 'KeyD' - } +// Tiny KeyboardEvent.code polyfill. +export var KEYCODE_TO_CODE = { + '38': 'ArrowUp', + '37': 'ArrowLeft', + '40': 'ArrowDown', + '39': 'ArrowRight', + '87': 'KeyW', + '65': 'KeyA', + '83': 'KeyS', + '68': 'KeyD' }; diff --git a/src/core/a-assets.js b/src/core/a-assets.js index a296a0dbc46..11fca4faf08 100644 --- a/src/core/a-assets.js +++ b/src/core/a-assets.js @@ -1,7 +1,7 @@ /* global customElements */ -var ANode = require('./a-node').ANode; -var debug = require('../utils/debug'); -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { ANode } from './a-node.js'; +import { debug } from '../utils/index.js'; var fileLoader = new THREE.FileLoader(); var warn = debug('core:a-assets:warn'); @@ -255,7 +255,7 @@ function extractDomain (url) { * @param {string} src * @returns {string} */ -function inferResponseType (src) { +export function inferResponseType (src) { var fileName = getFileNameFromURL(src); var dotLastIndex = fileName.lastIndexOf('.'); if (dotLastIndex >= 0) { @@ -266,7 +266,6 @@ function inferResponseType (src) { } return 'text'; } -module.exports.inferResponseType = inferResponseType; /** * Extract filename from URL @@ -274,11 +273,10 @@ module.exports.inferResponseType = inferResponseType; * @param {string} url * @returns {string} */ -function getFileNameFromURL (url) { +export function getFileNameFromURL (url) { var parser = document.createElement('a'); parser.href = url; var query = parser.search.replace(/^\?/, ''); var filePath = url.replace(query, '').replace('?', ''); return filePath.substring(filePath.lastIndexOf('/') + 1); } -module.exports.getFileNameFromURL = getFileNameFromURL; diff --git a/src/core/a-cubemap.js b/src/core/a-cubemap.js index db9e250f894..5d8354ece7d 100644 --- a/src/core/a-cubemap.js +++ b/src/core/a-cubemap.js @@ -1,5 +1,5 @@ /* global customElements, HTMLElement */ -var debug = require('../utils/debug'); +import { debug } from '../utils/index.js'; var warn = debug('core:cubemap:warn'); diff --git a/src/core/a-entity.js b/src/core/a-entity.js index c5cc5522c2a..1f85c5b48f5 100644 --- a/src/core/a-entity.js +++ b/src/core/a-entity.js @@ -1,8 +1,8 @@ /* global customElements */ -var ANode = require('./a-node').ANode; -var COMPONENTS = require('./component').components; -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import THREE from '../lib/three.js'; +import { ANode } from './a-node.js'; +import { components as COMPONENTS } from './component.js'; +import * as utils from '../utils/index.js'; var debug = utils.debug('core:a-entity:debug'); var warn = utils.debug('core:a-entity:warn'); @@ -22,7 +22,7 @@ var ONCE = {once: true}; * @member {array} states. * @member {boolean} isPlaying - false if dynamic behavior of the entity is paused. */ -class AEntity extends ANode { +export class AEntity extends ANode { constructor () { super(); this.components = {}; @@ -858,5 +858,3 @@ AEntity.componentsUpdated = []; AEntity.singlePropUpdate = {}; customElements.define('a-entity', AEntity); - -module.exports.AEntity = AEntity; diff --git a/src/core/a-mixin.js b/src/core/a-mixin.js index 90bb9653606..8d2af831971 100644 --- a/src/core/a-mixin.js +++ b/src/core/a-mixin.js @@ -1,8 +1,8 @@ /* global customElements */ -var ANode = require('./a-node').ANode; -var components = require('./component').components; -var utils = require('../utils'); -var styleParser = utils.styleParser; +import { ANode } from './a-node.js'; +import { components } from './component.js'; +import * as utils from '../utils/index.js'; +import * as styleParser from '../utils/styleParser.js'; var MULTIPLE_COMPONENT_DELIMITER = '__'; diff --git a/src/core/a-node.js b/src/core/a-node.js index dcdcec82e15..fd23571b191 100644 --- a/src/core/a-node.js +++ b/src/core/a-node.js @@ -1,10 +1,10 @@ -/* global customElements, CustomEvent, HTMLElement, MutationObserver */ -var utils = require('../utils/'); -var readyState = require('./readyState'); +/* global customElements, CustomEvent, HTMLElement, MutationObserver */ +import * as utils from '../utils/index.js'; +import * as readyState from './readyState.js'; var warn = utils.debug('core:a-node:warn'); -var knownTags = { +export var knownTags = { 'a-scene': true, 'a-assets': true, 'a-assets-items': true, @@ -24,7 +24,7 @@ function isNode (node) { * Nodes can be modified using mixins. * Nodes emit a `loaded` event when they and their children have initialized. */ -class ANode extends HTMLElement { +export class ANode extends HTMLElement { constructor () { super(); this.computedMixinStr = ''; @@ -313,6 +313,3 @@ ANode.oldMixinIdArray = []; ANode.mixinIds = {}; customElements.define('a-node', ANode); - -module.exports.ANode = ANode; -module.exports.knownTags = knownTags; diff --git a/src/core/component.js b/src/core/component.js index 12ea2df576f..4622801154a 100644 --- a/src/core/component.js +++ b/src/core/component.js @@ -1,10 +1,10 @@ /* global Node */ -var schema = require('./schema'); -var scenes = require('./scene/scenes'); -var systems = require('./system'); -var utils = require('../utils/'); +import * as schema from './schema.js'; +import scenes from './scene/scenes.js'; +import * as systems from './system.js'; +import * as utils from '../utils/index.js'; -var components = module.exports.components = {}; // Keep track of registered components. +export var components = {}; // Keep track of registered components. var parseProperty = schema.parseProperty; var processSchema = schema.process; var isSingleProp = schema.isSingleProperty; @@ -48,7 +48,7 @@ var attrValueProxyHandler = { * @member {string} attrValue - Value of the corresponding HTML attribute. * @member {string} id - Optional id for differentiating multiple instances on the same entity. */ -var Component = module.exports.Component = function (el, attrValue, id) { +export var Component = function (el, attrValue, id) { var self = this; // If component is sceneOnly check the entity is the scene element @@ -598,9 +598,7 @@ function eventsBind (component, events) { } // For testing. -if (window.debug) { - var registrationOrderWarnings = module.exports.registrationOrderWarnings = {}; -} +export var registrationOrderWarnings = {}; /** * Register a component to A-Frame. @@ -609,7 +607,7 @@ if (window.debug) { * @param {object} definition - Component schema and lifecycle method handlers. * @returns {object} Component. */ -module.exports.registerComponent = function (name, definition) { +export function registerComponent (name, definition) { var NewComponent; var proto = {}; var schema; @@ -702,7 +700,7 @@ module.exports.registerComponent = function (name, definition) { } return NewComponent; -}; +} /** * Checks if a component has defined a method that needs to run every frame. diff --git a/src/core/geometry.js b/src/core/geometry.js index 9561f6324ec..c4be1895d21 100755 --- a/src/core/geometry.js +++ b/src/core/geometry.js @@ -1,16 +1,16 @@ -var schema = require('./schema'); +import * as schema from './schema.js'; +import THREE from '../lib/three.js'; var processSchema = schema.process; -var geometries = module.exports.geometries = {}; // Registered geometries. -var geometryNames = module.exports.geometryNames = []; // Names of registered geometries. -var THREE = require('../lib/three'); +export var geometries = {}; // Registered geometries. +export var geometryNames = []; // Names of registered geometries. /** * Geometry class definition. * * Geometries extend the geometry component API to create and register geometry types. */ -var Geometry = module.exports.Geometry = function () {}; +export var Geometry = function () {}; Geometry.prototype = { /** @@ -44,7 +44,7 @@ Geometry.prototype = { * @param {object} definition - Geometry property and methods. * @returns {object} Geometry. */ -module.exports.registerGeometry = function (name, definition) { +export function registerGeometry (name, definition) { var NewGeometry; var proto = {}; @@ -69,4 +69,4 @@ module.exports.registerGeometry = function (name, definition) { }; geometryNames.push(name); return NewGeometry; -}; +} diff --git a/src/core/propertyTypes.js b/src/core/propertyTypes.js index 0dbd29dd3f7..6bb9a125636 100644 --- a/src/core/propertyTypes.js +++ b/src/core/propertyTypes.js @@ -1,9 +1,9 @@ -var coordinates = require('../utils/coordinates'); -var debug = require('debug'); +import * as coordinates from '../utils/coordinates.js'; +import debug from 'debug'; var warn = debug('core:propertyTypes:warn'); -var propertyTypes = module.exports.propertyTypes = {}; +export var propertyTypes = {}; var nonCharRegex = /[,> .[\]:]/; var urlRegex = /url\((.+)\)/; @@ -38,7 +38,7 @@ registerPropertyType('vec4', {x: 0, y: 0, z: 0, w: 1}, vecParse, coordinates.str * @param {function} [equals=defaultEquals] - Equality comparator. * @param {boolean} [cachable=false] - Whether or not the parsed value of a property can be cached. */ -function registerPropertyType (type, defaultValue, parse, stringify, equals, cacheable) { +export function registerPropertyType (type, defaultValue, parse, stringify, equals, cacheable) { if (type in propertyTypes) { throw new Error('Property type ' + type + ' is already registered.'); } @@ -51,7 +51,6 @@ function registerPropertyType (type, defaultValue, parse, stringify, equals, cac isCacheable: cacheable !== false }; } -module.exports.registerPropertyType = registerPropertyType; function arrayParse (value) { if (Array.isArray(value)) { return value; } @@ -208,7 +207,7 @@ function vecParse (value, defaultValue, target) { * @param defaultVal - Property type default value. * @returns {boolean} Whether default value is accurate given the type. */ -function isValidDefaultValue (type, defaultVal) { +export function isValidDefaultValue (type, defaultVal) { if (type === 'audio' && typeof defaultVal !== 'string') { return false; } if (type === 'array' && !Array.isArray(defaultVal)) { return false; } if (type === 'asset' && typeof defaultVal !== 'string') { return false; } @@ -230,7 +229,6 @@ function isValidDefaultValue (type, defaultVal) { if (type === 'vec4') { return isValidDefaultCoordinate(defaultVal, 4); } return true; } -module.exports.isValidDefaultValue = isValidDefaultValue; /** * Checks if default coordinates are valid. @@ -239,7 +237,7 @@ module.exports.isValidDefaultValue = isValidDefaultValue; * @param {number} dimensions - 2 for 2D Vector, 3 for 3D vector. * @returns {boolean} Whether coordinates are parsed correctly. */ -function isValidDefaultCoordinate (possibleCoordinates, dimensions) { +export function isValidDefaultCoordinate (possibleCoordinates, dimensions) { if (possibleCoordinates === null) { return true; } if (typeof possibleCoordinates !== 'object') { return false; } @@ -258,4 +256,3 @@ function isValidDefaultCoordinate (possibleCoordinates, dimensions) { return true; } -module.exports.isValidDefaultCoordinate = isValidDefaultCoordinate; diff --git a/src/core/readyState.js b/src/core/readyState.js index d435bcb4a46..5af54a72387 100644 --- a/src/core/readyState.js +++ b/src/core/readyState.js @@ -3,12 +3,12 @@ /** * Flag indicating if A-Frame can initialize the scene or should wait. */ -module.exports.canInitializeElements = false; +export var canInitializeElements = false; /** * Waits for the document to be ready. */ -function waitForDocumentReadyState () { +export function waitForDocumentReadyState () { if (document.readyState === 'complete') { emitReady(); return; @@ -20,16 +20,19 @@ function waitForDocumentReadyState () { emitReady(); }); } -module.exports.waitForDocumentReadyState = waitForDocumentReadyState; /** * Signals A-Frame that everything is ready to initialize. */ -function emitReady () { - if (module.exports.canInitializeElements) { return; } - module.exports.canInitializeElements = true; +export function emitReady () { + if (canInitializeElements) { return; } + canInitializeElements = true; setTimeout(function () { document.dispatchEvent(new CustomEvent('aframeready')); }); } -module.exports.emitReady = emitReady; + +/** Resets the canInitializeElements flag, used for testing */ +export function reset () { + canInitializeElements = false; +} diff --git a/src/core/scene/a-scene.js b/src/core/scene/a-scene.js index 4966b54c46e..4fa1b9a6096 100644 --- a/src/core/scene/a-scene.js +++ b/src/core/scene/a-scene.js @@ -1,24 +1,26 @@ /* global Promise, customElements, screen, CustomEvent */ -var initMetaTags = require('./metaTags').inject; -var initWakelock = require('./wakelock'); -var loadingScreen = require('./loadingScreen'); -var scenes = require('./scenes'); -var systems = require('../system').systems; -var components = require('../component').components; -var THREE = require('../../lib/three'); -var utils = require('../../utils/'); -var warn = utils.debug('core:a-scene:warn'); +import THREE from '../../lib/three.js'; +import { inject as initMetaTags } from './metaTags.js'; +import { initWakelock } from './wakelock.js'; +import * as loadingScreen from './loadingScreen.js'; +import scenes from './scenes.js'; +import { systems } from '../system.js'; +import { components } from '../component.js'; +import * as utils from '../../utils/index.js'; + // Require after. -var AEntity = require('../a-entity').AEntity; -var ANode = require('../a-node').ANode; -var initPostMessageAPI = require('./postMessage'); +import { AEntity } from '../a-entity.js'; +import { ANode } from '../a-node.js'; +import { initPostMessageAPI } from './postMessage.js'; + +import '../../utils/ios-orientationchange-blank-bug.js'; + +var warn = utils.debug('core:a-scene:warn'); var isIOS = utils.device.isIOS(); var isMobile = utils.device.isMobile(); var isWebXRAvailable = utils.device.isWebXRAvailable; -if (isIOS) { require('../../utils/ios-orientationchange-blank-bug'); } - /** * Scene element, holds all entities. * @@ -35,7 +37,7 @@ if (isIOS) { require('../../utils/ios-orientationchange-blank-bug'); } * @member {number} time */ -class AScene extends AEntity { +export class AScene extends AEntity { constructor () { var self; super(); @@ -696,7 +698,7 @@ class AScene extends AEntity { * @param {object} components - The components to order * @param {array} array - Optional array to use as output */ -function determineComponentBehaviorOrder (components, array) { +export function determineComponentBehaviorOrder (components, array) { var graph = {}; var i; var key; @@ -762,8 +764,6 @@ function determineComponentBehaviorOrder (components, array) { return result; } -module.exports.determineComponentBehaviorOrder = determineComponentBehaviorOrder; - /** * Return size constrained to maxSize - maintaining aspect ratio. * @@ -869,7 +869,7 @@ function exitFullscreen () { } } -function setupCanvas (sceneEl) { +export function setupCanvas (sceneEl) { var canvasEl; canvasEl = document.createElement('canvas'); @@ -904,6 +904,3 @@ function setupCanvas (sceneEl) { document.body.focus(); } } - -module.exports.setupCanvas = setupCanvas; -module.exports.AScene = AScene; diff --git a/src/core/scene/loadingScreen.js b/src/core/scene/loadingScreen.js index 2f9958081e2..ad7109c2ef2 100644 --- a/src/core/scene/loadingScreen.js +++ b/src/core/scene/loadingScreen.js @@ -1,6 +1,6 @@ /* global THREE */ -var AFRAME_INJECTED = require('../../constants').AFRAME_INJECTED; -var utils = require('../../utils/'); +import { AFRAME_INJECTED } from '../../constants/index.js'; +import * as utils from '../../utils/index.js'; var styleParser = utils.styleParser; var sceneEl; @@ -10,7 +10,7 @@ var getSceneCanvasSize; var ATTR_NAME = 'loading-screen'; var LOADER_TITLE_CLASS = 'a-loader-title'; -module.exports.setup = function setup (el, getCanvasSize) { +export function setup (el, getCanvasSize) { sceneEl = el; getSceneCanvasSize = getCanvasSize; var loaderAttribute = sceneEl.hasAttribute(ATTR_NAME) ? styleParser.parse(sceneEl.getAttribute(ATTR_NAME)) : undefined; @@ -66,14 +66,14 @@ module.exports.setup = function setup (el, getCanvasSize) { window.addEventListener('resize', function () { resize(camera); }); sceneEl.renderer.setAnimationLoop(render); }, 200); -}; +} -module.exports.remove = function remove () { +export function remove () { window.removeEventListener('resize', resize); if (!titleEl) { return; } // Hide title. titleEl.style.display = 'none'; -}; +} function resize (camera) { var embedded = sceneEl.hasAttribute('embedded'); diff --git a/src/core/scene/metaTags.js b/src/core/scene/metaTags.js index b93d18aaf19..bee770f53a3 100644 --- a/src/core/scene/metaTags.js +++ b/src/core/scene/metaTags.js @@ -1,7 +1,7 @@ -var constants = require('../../constants/'); -var extend = require('../../utils').extend; +import * as constants from '../../constants/index.js'; +import { extend } from '../../utils/index.js'; -var MOBILE_HEAD_TAGS = module.exports.MOBILE_HEAD_TAGS = [ +export var MOBILE_HEAD_TAGS = [ Meta({name: 'viewport', content: 'width=device-width,initial-scale=1,maximum-scale=1,shrink-to-fit=no,user-scalable=no,minimal-ui,viewport-fit=cover'}), // W3C-standardised meta tags. @@ -9,7 +9,7 @@ var MOBILE_HEAD_TAGS = module.exports.MOBILE_HEAD_TAGS = [ Meta({name: 'theme-color', content: 'black'}) ]; -var MOBILE_IOS_HEAD_TAGS = [ +export var MOBILE_IOS_HEAD_TAGS = [ // iOS-specific meta tags for fullscreen when pinning to homescreen. Meta({name: 'apple-mobile-web-app-capable', content: 'yes'}), Meta({name: 'apple-mobile-web-app-status-bar-style', content: 'black'}), @@ -44,7 +44,7 @@ function Link (attrs) { * @param {object} scene - Scene element * @returns {Array} */ -module.exports.inject = function injectHeadTags (scene) { +export var inject = function injectHeadTags (scene) { var headEl = document.head; var headScriptEl = headEl.querySelector('script'); var tag; diff --git a/src/core/scene/postMessage.js b/src/core/scene/postMessage.js index bf414a60980..d147124360e 100644 --- a/src/core/scene/postMessage.js +++ b/src/core/scene/postMessage.js @@ -1,15 +1,15 @@ -var isIframed = require('../../utils/').isIframed; +import { isIframed } from '../../utils/index.js'; /** * Provides a post message API for scenes contained * in an iframe. */ -module.exports = function initPostMessageAPI (scene) { +export function initPostMessageAPI (scene) { // Handles fullscreen behavior when inside an iframe. if (!isIframed()) { return; } // postMessage API handler window.addEventListener('message', postMessageAPIHandler.bind(scene)); -}; +} function postMessageAPIHandler (event) { var scene = this; diff --git a/src/core/scene/scenes.js b/src/core/scene/scenes.js index b6a9e3e1c6e..106fe2b3225 100644 --- a/src/core/scene/scenes.js +++ b/src/core/scene/scenes.js @@ -1,4 +1,4 @@ /* Scene index for keeping track of created scenes. */ -module.exports = []; +export default []; diff --git a/src/core/scene/wakelock.js b/src/core/scene/wakelock.js index 00da545581f..4454d49f080 100644 --- a/src/core/scene/wakelock.js +++ b/src/core/scene/wakelock.js @@ -1,9 +1,9 @@ -var Wakelock = require('../../../vendor/wakelock/wakelock'); +import Wakelock from '../../../vendor/wakelock/wakelock.js'; -module.exports = function initWakelock (scene) { +export function initWakelock (scene) { if (!scene.isMobile) { return; } var wakelock = scene.wakelock = new Wakelock(); scene.addEventListener('enter-vr', function () { wakelock.request(); }); scene.addEventListener('exit-vr', function () { wakelock.release(); }); -}; +} diff --git a/src/core/schema.js b/src/core/schema.js index 103e211993a..032e27a98a3 100644 --- a/src/core/schema.js +++ b/src/core/schema.js @@ -1,5 +1,5 @@ -var utils = require('../utils/'); -var PropertyTypes = require('./propertyTypes'); +import * as utils from '../utils/index.js'; +import * as PropertyTypes from './propertyTypes.js'; var debug = utils.debug; var isValidDefaultValue = PropertyTypes.isValidDefaultValue; @@ -13,13 +13,12 @@ var warn = debug('core:schema:warn'); * - OR `default` is defined on the schema, as a reserved keyword. * - OR schema is empty. */ -function isSingleProperty (schema) { +export function isSingleProperty (schema) { if ('type' in schema) { return typeof schema.type === 'string'; } return 'default' in schema; } -module.exports.isSingleProperty = isSingleProperty; /** * Build step to schema to use `type` to inject default value, parser, and stringifier. @@ -28,7 +27,7 @@ module.exports.isSingleProperty = isSingleProperty; * @param {string} componentName * @returns {object} Schema. */ -module.exports.process = function (schema, componentName) { +export function process (schema, componentName) { var propName; // For single property schema, run processPropDefinition over the whole schema. @@ -41,7 +40,7 @@ module.exports.process = function (schema, componentName) { schema[propName] = processPropertyDefinition(schema[propName], componentName); } return schema; -}; +} /** * Inject default value, parser, stringifier for single property. @@ -49,7 +48,7 @@ module.exports.process = function (schema, componentName) { * @param {object} propDefinition * @param {string} componentName */ -function processPropertyDefinition (propDefinition, componentName) { +export function processPropertyDefinition (propDefinition, componentName) { var defaultVal = propDefinition.default; var isCustomType; var propType; @@ -102,7 +101,6 @@ function processPropertyDefinition (propDefinition, componentName) { return propDefinition; } -module.exports.processPropertyDefinition = processPropertyDefinition; /** * Parse propData using schema. Use default values if not existing in propData. @@ -114,7 +112,7 @@ module.exports.processPropertyDefinition = processPropertyDefinition; * @param {string } componentName - Name of the component, used for the property warning. * @param {boolean} silent - Suppress warning messages. */ -module.exports.parseProperties = (function () { +export var parseProperties = (function () { var propNames = []; return function (propData, schema, getPartialData, componentName, silent) { @@ -158,7 +156,7 @@ module.exports.parseProperties = (function () { * @param {object} propDefinition - The single property schema for the property. * @param {any} target - Optional target value to parse into (reuse). */ -function parseProperty (value, propDefinition, target) { +export function parseProperty (value, propDefinition, target) { // Use default value if value is falsy. if (value === undefined || value === null || value === '') { value = propDefinition.default; @@ -167,12 +165,11 @@ function parseProperty (value, propDefinition, target) { // Invoke property type parser. return propDefinition.parse(value, propDefinition.default, target); } -module.exports.parseProperty = parseProperty; /** * Serialize a group of properties. */ -module.exports.stringifyProperties = function (propData, schema) { +export function stringifyProperties (propData, schema) { var propName; var propDefinition; var propValue; @@ -192,12 +189,12 @@ module.exports.stringifyProperties = function (propData, schema) { } } return stringifiedData; -}; +} /** * Serialize a single property. */ -function stringifyProperty (value, propDefinition) { +export function stringifyProperty (value, propDefinition) { // This function stringifies but it's used in a context where // there's always second stringification pass. By returning the original // value when it's not an object we save one unnecessary call @@ -207,4 +204,3 @@ function stringifyProperty (value, propDefinition) { if (!propDefinition || value === null) { return JSON.stringify(value); } return propDefinition.stringify(value); } -module.exports.stringifyProperty = stringifyProperty; diff --git a/src/core/shader.js b/src/core/shader.js index c97854bc557..42a4671d181 100755 --- a/src/core/shader.js +++ b/src/core/shader.js @@ -1,10 +1,9 @@ -var schema = require('./schema'); +import THREE from '../lib/three.js'; +import { process as processSchema } from './schema.js'; +import * as utils from '../utils/index.js'; -var processSchema = schema.process; -var shaders = module.exports.shaders = {}; // Keep track of registered shaders. -var shaderNames = module.exports.shaderNames = []; // Keep track of the names of registered shaders. -var THREE = require('../lib/three'); -var utils = require('../utils'); +export var shaders = {}; // Keep track of registered shaders. +export var shaderNames = []; // Keep track of the names of registered shaders. // A-Frame properties to three.js uniform types. var propertyToThreeMapping = { @@ -26,7 +25,7 @@ var propertyToThreeMapping = { * of customized materials. * */ -var Shader = module.exports.Shader = function () {}; +export var Shader = function () {}; Shader.prototype = { /** @@ -149,7 +148,7 @@ Shader.prototype = { * @param {object} definition - shader property and methods. * @returns {object} Shader. */ -module.exports.registerShader = function (name, definition) { +export function registerShader (name, definition) { var NewShader; var proto = {}; @@ -174,4 +173,4 @@ module.exports.registerShader = function (name, definition) { }; shaderNames.push(name); return NewShader; -}; +} diff --git a/src/core/system.js b/src/core/system.js index 4942cb88a95..dfccf7dfd09 100755 --- a/src/core/system.js +++ b/src/core/system.js @@ -1,15 +1,11 @@ -var components = require('./component'); -var schema = require('./schema'); -var utils = require('../utils/'); -var ready = require('./readyState'); - -var parseProperties = schema.parseProperties; -var parseProperty = schema.parseProperty; -var processSchema = schema.process; -var isSingleProp = schema.isSingleProperty; +import { parseProperties, parseProperty, process as processSchema, isSingleProperty as isSingleProp } from './schema.js'; +import * as components from './component.js'; +import * as utils from '../utils/index.js'; +import * as ready from './readyState.js'; + var styleParser = utils.styleParser; -var systems = module.exports.systems = {}; // Keep track of registered systems. +export var systems = {}; // Keep track of registered systems. /** * System class definition. @@ -28,7 +24,7 @@ var systems = module.exports.systems = {}; // Keep track of registered systems. * @member {string} name - Name that system is registered under. * @member {Element} sceneEl - Handle to the scene element where system applies to. */ -var System = module.exports.System = function (sceneEl) { +export var System = function (sceneEl) { var component = components && components.components[this.name]; // Set reference to scene. @@ -69,7 +65,7 @@ System.prototype = { */ updateProperties: function (rawData) { var oldData = this.data; - if (!Object.keys(schema).length) { return; } + if (!Object.keys(this.schema).length) { return; } this.buildData(rawData); this.update(oldData); }, @@ -126,7 +122,7 @@ System.prototype = { * @param {object} definition - Component property and methods. * @returns {object} Component. */ -module.exports.registerSystem = function (name, definition) { +export function registerSystem (name, definition) { var i; var NewSystem; var proto = {}; @@ -156,4 +152,4 @@ module.exports.registerSystem = function (name, definition) { if (ready.canInitializeElements) { for (i = 0; i < scenes.length; i++) { scenes[i].initSystem(name); } } -}; +} diff --git a/src/extras/components/index.js b/src/extras/components/index.js index 340e09f207f..ff58f877761 100644 --- a/src/extras/components/index.js +++ b/src/extras/components/index.js @@ -1 +1 @@ -require('./pivot'); +import './pivot.js'; diff --git a/src/extras/components/pivot.js b/src/extras/components/pivot.js index caf7d8e8aa8..4b002146eb0 100644 --- a/src/extras/components/pivot.js +++ b/src/extras/components/pivot.js @@ -1,5 +1,5 @@ -var registerComponent = require('../../core/component').registerComponent; -var THREE = require('../../lib/three'); +import THREE from '../../lib/three.js'; +import { registerComponent } from '../../core/component.js'; var originalPosition = new THREE.Vector3(); var originalRotation = new THREE.Vector3(); diff --git a/src/extras/primitives/getMeshMixin.js b/src/extras/primitives/getMeshMixin.js index c2fa51900e0..fe4e30fa8e7 100644 --- a/src/extras/primitives/getMeshMixin.js +++ b/src/extras/primitives/getMeshMixin.js @@ -1,9 +1,9 @@ /** * Common mesh defaults, mappings, and transforms. */ -var components = require('../../core/component').components; -var shaders = require('../../core/shader').shaders; -var utils = require('../../utils/'); +import { components } from '../../core/component.js'; +import { shaders } from '../../core/shader.js'; +import * as utils from '../../utils/index.js'; var materialMappings = {}; Object.keys(components.material.schema).forEach(addMapping); @@ -17,9 +17,9 @@ function addMapping (prop) { materialMappings[htmlAttrName] = 'material.' + prop; } -module.exports = function getMeshMixin () { +export default function getMeshMixin () { return { defaultComponents: {material: {}}, mappings: utils.extend({}, materialMappings) }; -}; +} diff --git a/src/extras/primitives/index.js b/src/extras/primitives/index.js index 45817919eb9..a59bfeac64e 100644 --- a/src/extras/primitives/index.js +++ b/src/extras/primitives/index.js @@ -1,14 +1,14 @@ -require('./primitives/a-camera'); -require('./primitives/a-cursor'); -require('./primitives/a-curvedimage'); -require('./primitives/a-gltf-model'); -require('./primitives/a-image'); -require('./primitives/a-light'); -require('./primitives/a-link'); -require('./primitives/a-obj-model'); -require('./primitives/a-sky'); -require('./primitives/a-sound'); -require('./primitives/a-text'); -require('./primitives/a-video'); -require('./primitives/a-videosphere'); -require('./primitives/meshPrimitives'); +import './primitives/a-camera.js'; +import './primitives/a-cursor.js'; +import './primitives/a-curvedimage.js'; +import './primitives/a-gltf-model.js'; +import './primitives/a-image.js'; +import './primitives/a-light.js'; +import './primitives/a-link.js'; +import './primitives/a-obj-model.js'; +import './primitives/a-sky.js'; +import './primitives/a-sound.js'; +import './primitives/a-text.js'; +import './primitives/a-video.js'; +import './primitives/a-videosphere.js'; +import './primitives/meshPrimitives.js'; diff --git a/src/extras/primitives/primitives.js b/src/extras/primitives/primitives.js index 7fa7e43e05f..46829dc0cd0 100644 --- a/src/extras/primitives/primitives.js +++ b/src/extras/primitives/primitives.js @@ -1,9 +1,8 @@ /* global customElements */ -var knownTags = require('../../core/a-node').knownTags; -var AEntity = require('../../core/a-entity').AEntity; - -var components = require('../../core/component').components; -var utils = require('../../utils/'); +import { knownTags } from '../../core/a-node.js'; +import { AEntity } from '../../core/a-entity.js'; +import { components } from '../../core/component.js'; +import * as utils from '../../utils/index.js'; var debug = utils.debug; var setComponentProperty = utils.entity.setComponentProperty; @@ -11,9 +10,9 @@ var log = debug('extras:primitives:debug'); var warn = debug('extras:primitives:warn'); var error = debug('extras:primitives:error'); -var primitives = module.exports.primitives = {}; +export var primitives = {}; -module.exports.registerPrimitive = function registerPrimitive (name, definition) { +export function registerPrimitive (name, definition) { name = name.toLowerCase(); if (knownTags[name]) { @@ -172,7 +171,7 @@ module.exports.registerPrimitive = function registerPrimitive (name, definition) // Store. primitives[name] = primitiveClass; return primitiveClass; -}; +} /** * Sets the relevant property based on the mapping property path. @@ -208,7 +207,7 @@ function addComponentMapping (componentName, mappings) { /** * Helper to define a primitive, building mappings using a component schema. */ -function definePrimitive (tagName, defaultComponents, mappings) { +export function definePrimitive (tagName, defaultComponents, mappings) { // If no initial mappings provided, start from empty map. mappings = mappings || {}; @@ -218,9 +217,8 @@ function definePrimitive (tagName, defaultComponents, mappings) { }); // Register the primitive. - module.exports.registerPrimitive(tagName, utils.extendDeep({}, null, { + registerPrimitive(tagName, utils.extendDeep({}, null, { defaultComponents: defaultComponents, mappings: mappings })); } -module.exports.definePrimitive = definePrimitive; diff --git a/src/extras/primitives/primitives/a-camera.js b/src/extras/primitives/primitives/a-camera.js index 05233bf7d58..54932a9e5f8 100644 --- a/src/extras/primitives/primitives/a-camera.js +++ b/src/extras/primitives/primitives/a-camera.js @@ -1,4 +1,4 @@ -var registerPrimitive = require('../primitives').registerPrimitive; +import { registerPrimitive } from '../primitives.js'; registerPrimitive('a-camera', { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-cursor.js b/src/extras/primitives/primitives/a-cursor.js index 2acc0ffa002..4eb31380751 100644 --- a/src/extras/primitives/primitives/a-cursor.js +++ b/src/extras/primitives/primitives/a-cursor.js @@ -1,6 +1,6 @@ -var getMeshMixin = require('../getMeshMixin'); -var registerPrimitive = require('../primitives').registerPrimitive; -var utils = require('../../../utils/'); +import getMeshMixin from '../getMeshMixin.js'; +import { registerPrimitive } from '../primitives.js'; +import * as utils from '../../../utils/index.js'; registerPrimitive('a-cursor', utils.extendDeep({}, getMeshMixin(), { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-curvedimage.js b/src/extras/primitives/primitives/a-curvedimage.js index 69e0805bdbb..260e765bb26 100644 --- a/src/extras/primitives/primitives/a-curvedimage.js +++ b/src/extras/primitives/primitives/a-curvedimage.js @@ -1,6 +1,6 @@ -var getMeshMixin = require('../getMeshMixin'); -var registerPrimitive = require('../primitives').registerPrimitive; -var utils = require('../../../utils/'); +import getMeshMixin from '../getMeshMixin.js'; +import { registerPrimitive } from '../primitives.js'; +import * as utils from '../../../utils/index.js'; registerPrimitive('a-curvedimage', utils.extendDeep({}, getMeshMixin(), { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-gltf-model.js b/src/extras/primitives/primitives/a-gltf-model.js index 986d8bf5ba2..18ba4f5bfff 100644 --- a/src/extras/primitives/primitives/a-gltf-model.js +++ b/src/extras/primitives/primitives/a-gltf-model.js @@ -1,4 +1,4 @@ -var registerPrimitive = require('../primitives').registerPrimitive; +import { registerPrimitive } from '../primitives.js'; registerPrimitive('a-gltf-model', { mappings: { diff --git a/src/extras/primitives/primitives/a-image.js b/src/extras/primitives/primitives/a-image.js index 10adaf8ebce..454c2aac1cc 100644 --- a/src/extras/primitives/primitives/a-image.js +++ b/src/extras/primitives/primitives/a-image.js @@ -1,6 +1,6 @@ -var getMeshMixin = require('../getMeshMixin'); -var registerPrimitive = require('../primitives').registerPrimitive; -var utils = require('../../../utils/'); +import getMeshMixin from '../getMeshMixin.js'; +import { registerPrimitive } from '../primitives.js'; +import * as utils from '../../../utils/index.js'; registerPrimitive('a-image', utils.extendDeep({}, getMeshMixin(), { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-light.js b/src/extras/primitives/primitives/a-light.js index bc66cd40a4b..68bf1f26320 100644 --- a/src/extras/primitives/primitives/a-light.js +++ b/src/extras/primitives/primitives/a-light.js @@ -1,4 +1,4 @@ -var registerPrimitive = require('../primitives').registerPrimitive; +import { registerPrimitive } from '../primitives.js'; registerPrimitive('a-light', { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-link.js b/src/extras/primitives/primitives/a-link.js index c6e46d44532..d2c20d1e7f0 100644 --- a/src/extras/primitives/primitives/a-link.js +++ b/src/extras/primitives/primitives/a-link.js @@ -1,4 +1,4 @@ -var registerPrimitive = require('../primitives').registerPrimitive; +import { registerPrimitive } from '../primitives.js'; registerPrimitive('a-link', { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-obj-model.js b/src/extras/primitives/primitives/a-obj-model.js index 051eded08aa..e9e19aeecc1 100644 --- a/src/extras/primitives/primitives/a-obj-model.js +++ b/src/extras/primitives/primitives/a-obj-model.js @@ -1,8 +1,8 @@ -var meshMixin = require('../getMeshMixin')(); -var registerPrimitive = require('../primitives').registerPrimitive; -var utils = require('../../../utils/'); +import getMeshMixin from '../getMeshMixin.js'; +import { registerPrimitive } from '../primitives.js'; +import * as utils from '../../../utils/index.js'; -registerPrimitive('a-obj-model', utils.extendDeep({}, meshMixin, { +registerPrimitive('a-obj-model', utils.extendDeep({}, getMeshMixin(), { defaultComponents: { 'obj-model': {} }, diff --git a/src/extras/primitives/primitives/a-sky.js b/src/extras/primitives/primitives/a-sky.js index 0f96e428aa9..0faf1175771 100644 --- a/src/extras/primitives/primitives/a-sky.js +++ b/src/extras/primitives/primitives/a-sky.js @@ -1,7 +1,7 @@ -var getMeshMixin = require('../getMeshMixin'); -var registerPrimitive = require('../primitives').registerPrimitive; -var utils = require('../../../utils/'); -var meshPrimitives = require('./meshPrimitives'); +import getMeshMixin from '../getMeshMixin.js'; +import { registerPrimitive } from '../primitives.js'; +import * as utils from '../../../utils/index.js'; +import meshPrimitives from './meshPrimitives.js'; registerPrimitive('a-sky', utils.extendDeep({}, getMeshMixin(), { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-sound.js b/src/extras/primitives/primitives/a-sound.js index 096d4205b3e..6b712fc2d99 100644 --- a/src/extras/primitives/primitives/a-sound.js +++ b/src/extras/primitives/primitives/a-sound.js @@ -1,4 +1,4 @@ -var registerPrimitive = require('../primitives').registerPrimitive; +import { registerPrimitive } from '../primitives.js'; registerPrimitive('a-sound', { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-text.js b/src/extras/primitives/primitives/a-text.js index 2443f2860cc..13978a5b36d 100644 --- a/src/extras/primitives/primitives/a-text.js +++ b/src/extras/primitives/primitives/a-text.js @@ -1,3 +1,3 @@ // using `definePrimitive` helper. -var definePrimitive = require('../primitives').definePrimitive; +import { definePrimitive } from '../primitives.js'; definePrimitive('a-text', {text: {anchor: 'align', width: 5}}); diff --git a/src/extras/primitives/primitives/a-video.js b/src/extras/primitives/primitives/a-video.js index dc3262f2918..c3b6957b15f 100644 --- a/src/extras/primitives/primitives/a-video.js +++ b/src/extras/primitives/primitives/a-video.js @@ -1,6 +1,6 @@ -var getMeshMixin = require('../getMeshMixin'); -var registerPrimitive = require('../primitives').registerPrimitive; -var utils = require('../../../utils/'); +import getMeshMixin from '../getMeshMixin.js'; +import { registerPrimitive } from '../primitives.js'; +import * as utils from '../../../utils/index.js'; registerPrimitive('a-video', utils.extendDeep({}, getMeshMixin(), { defaultComponents: { diff --git a/src/extras/primitives/primitives/a-videosphere.js b/src/extras/primitives/primitives/a-videosphere.js index 9268d779244..f28ce160b50 100644 --- a/src/extras/primitives/primitives/a-videosphere.js +++ b/src/extras/primitives/primitives/a-videosphere.js @@ -1,6 +1,6 @@ -var getMeshMixin = require('../getMeshMixin'); -var registerPrimitive = require('../primitives').registerPrimitive; -var utils = require('../../../utils/'); +import getMeshMixin from '../getMeshMixin.js'; +import { registerPrimitive } from '../primitives.js'; +import * as utils from '../../../utils/index.js'; registerPrimitive('a-videosphere', utils.extendDeep({}, getMeshMixin(), { defaultComponents: { diff --git a/src/extras/primitives/primitives/meshPrimitives.js b/src/extras/primitives/primitives/meshPrimitives.js index af0d5e9e71b..36dc6231c81 100644 --- a/src/extras/primitives/primitives/meshPrimitives.js +++ b/src/extras/primitives/primitives/meshPrimitives.js @@ -1,14 +1,14 @@ /** * Automated mesh primitive registration. */ -var getMeshMixin = require('../getMeshMixin'); -var geometries = require('../../../core/geometry').geometries; -var geometryNames = require('../../../core/geometry').geometryNames; -var registerPrimitive = require('../primitives').registerPrimitive; -var utils = require('../../../utils/'); +import getMeshMixin from '../getMeshMixin.js'; +import { geometries, geometryNames } from '../../../core/geometry.js'; +import { registerPrimitive } from '../primitives.js'; +import * as utils from '../../../utils/index.js'; // For testing. -var meshPrimitives = module.exports = {}; +const meshPrimitives = {}; +export default meshPrimitives; // Generate primitive for each geometry type. geometryNames.forEach(function registerMeshPrimitive (geometryName) { diff --git a/src/geometries/box.js b/src/geometries/box.js index 71c9cc38659..54718b7faa6 100644 --- a/src/geometries/box.js +++ b/src/geometries/box.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; registerGeometry('box', { schema: { diff --git a/src/geometries/circle.js b/src/geometries/circle.js index 7a63ac0a252..470d133792a 100644 --- a/src/geometries/circle.js +++ b/src/geometries/circle.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; var degToRad = THREE.MathUtils.degToRad; diff --git a/src/geometries/cone.js b/src/geometries/cone.js index 1607fc7a823..ac4a239e7b5 100644 --- a/src/geometries/cone.js +++ b/src/geometries/cone.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; var degToRad = THREE.MathUtils.degToRad; diff --git a/src/geometries/cylinder.js b/src/geometries/cylinder.js index c56d0289355..103646c8102 100644 --- a/src/geometries/cylinder.js +++ b/src/geometries/cylinder.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; var degToRad = THREE.MathUtils.degToRad; diff --git a/src/geometries/dodecahedron.js b/src/geometries/dodecahedron.js index bba29767c06..3795985a0bc 100644 --- a/src/geometries/dodecahedron.js +++ b/src/geometries/dodecahedron.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; registerGeometry('dodecahedron', { schema: { diff --git a/src/geometries/icosahedron.js b/src/geometries/icosahedron.js index 160b4850608..9c9d3438ec2 100644 --- a/src/geometries/icosahedron.js +++ b/src/geometries/icosahedron.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; registerGeometry('icosahedron', { schema: { diff --git a/src/geometries/index.js b/src/geometries/index.js index ab14a18b748..2ee9cffb7ae 100644 --- a/src/geometries/index.js +++ b/src/geometries/index.js @@ -1,14 +1,14 @@ -require('./box.js'); -require('./circle.js'); -require('./cone.js'); -require('./cylinder.js'); -require('./dodecahedron.js'); -require('./icosahedron.js'); -require('./octahedron.js'); -require('./plane.js'); -require('./ring.js'); -require('./sphere.js'); -require('./tetrahedron.js'); -require('./torus.js'); -require('./torusKnot.js'); -require('./triangle.js'); +import './box.js'; +import './circle.js'; +import './cone.js'; +import './cylinder.js'; +import './dodecahedron.js'; +import './icosahedron.js'; +import './octahedron.js'; +import './plane.js'; +import './ring.js'; +import './sphere.js'; +import './tetrahedron.js'; +import './torus.js'; +import './torusKnot.js'; +import './triangle.js'; diff --git a/src/geometries/octahedron.js b/src/geometries/octahedron.js index 2c03e355416..52d779ac531 100644 --- a/src/geometries/octahedron.js +++ b/src/geometries/octahedron.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; registerGeometry('octahedron', { schema: { diff --git a/src/geometries/plane.js b/src/geometries/plane.js index 341d035e26b..1aad1507b69 100644 --- a/src/geometries/plane.js +++ b/src/geometries/plane.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; registerGeometry('plane', { schema: { diff --git a/src/geometries/ring.js b/src/geometries/ring.js index f9b75ced6b0..48a79ef6b94 100644 --- a/src/geometries/ring.js +++ b/src/geometries/ring.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; var degToRad = THREE.MathUtils.degToRad; diff --git a/src/geometries/sphere.js b/src/geometries/sphere.js index 0e46db03fd9..0450c537c6d 100644 --- a/src/geometries/sphere.js +++ b/src/geometries/sphere.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; var degToRad = THREE.MathUtils.degToRad; diff --git a/src/geometries/tetrahedron.js b/src/geometries/tetrahedron.js index 829ae5455ea..0a1958b4b78 100644 --- a/src/geometries/tetrahedron.js +++ b/src/geometries/tetrahedron.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; registerGeometry('tetrahedron', { schema: { diff --git a/src/geometries/torus.js b/src/geometries/torus.js index 887deac7e55..0b9bf08facd 100644 --- a/src/geometries/torus.js +++ b/src/geometries/torus.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; var degToRad = THREE.MathUtils.degToRad; diff --git a/src/geometries/torusKnot.js b/src/geometries/torusKnot.js index 78b0d85d00e..e84026e48e0 100644 --- a/src/geometries/torusKnot.js +++ b/src/geometries/torusKnot.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; registerGeometry('torusKnot', { schema: { diff --git a/src/geometries/triangle.js b/src/geometries/triangle.js index 8d1913d3ee4..e29b41047a5 100644 --- a/src/geometries/triangle.js +++ b/src/geometries/triangle.js @@ -1,5 +1,5 @@ -var registerGeometry = require('../core/geometry').registerGeometry; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerGeometry } from '../core/geometry.js'; var quaternion = new THREE.Quaternion(); var rotateVector = new THREE.Vector3(0, 0, 1); diff --git a/src/index.js b/src/index.js index 23dc23d9800..07b9761890a 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,37 @@ -var utils = require('./utils/'); +import ANIME from 'super-animejs'; +import THREE from './lib/three.js'; + +import { AScene } from './core/scene/a-scene.js'; +import scenes from './core/scene/scenes.js'; +import { ANode } from './core/a-node.js'; +import { AEntity } from './core/a-entity.js'; // Depends on ANode and core components. +import { registerComponent, components, Component } from './core/component.js'; +import { registerGeometry, geometries } from './core/geometry.js'; +import { registerPrimitive, primitives } from './extras/primitives/primitives.js'; +import { registerShader, shaders } from './core/shader.js'; +import { registerSystem, systems } from './core/system.js'; +import * as schema from './core/schema.js'; +import * as readyState from './core/readyState.js'; + +import './core/a-assets.js'; +import './core/a-cubemap.js'; +import './core/a-mixin.js'; + +import * as utils from './utils/index.js'; +import pkg from '../package.json'; + +import './components/index.js'; // Register standard components. +import './geometries/index.js'; // Register standard geometries. +import './shaders/index.js'; // Register standard shaders. +import './systems/index.js'; // Register standard systems. + +// Depends on material component and standard shader +import getMeshMixin from './extras/primitives/getMeshMixin.js'; + +// Extras. +import './extras/components/index.js'; +import './extras/primitives/index.js'; + var debug = utils.debug; var error = debug('A-Frame:error'); var warn = debug('A-Frame:warn'); @@ -21,41 +54,11 @@ if (!window.cordova && window.location.protocol === 'file:') { // CSS. if (utils.device.isBrowserEnvironment) { + window.logs = debug; require('./style/aframe.css'); require('./style/rStats.css'); } -// Required before `AEntity` so that all components are registered. -var AScene = require('./core/scene/a-scene').AScene; -var components = require('./core/component').components; -var registerComponent = require('./core/component').registerComponent; -var registerGeometry = require('./core/geometry').registerGeometry; -var registerPrimitive = require('./extras/primitives/primitives').registerPrimitive; -var registerShader = require('./core/shader').registerShader; -var registerSystem = require('./core/system').registerSystem; -var shaders = require('./core/shader').shaders; -var systems = require('./core/system').systems; -// Exports THREE to window so three.js can be used without alteration. -var THREE = window.THREE = require('./lib/three'); -var readyState = require('./core/readyState'); - -var pkg = require('../package'); - -require('./components/index'); // Register standard components. -require('./geometries/index'); // Register standard geometries. -require('./shaders/index'); // Register standard shaders. -require('./systems/index'); // Register standard systems. -var ANode = require('./core/a-node').ANode; -var AEntity = require('./core/a-entity').AEntity; // Depends on ANode and core components. - -require('./core/a-assets'); -require('./core/a-cubemap'); -require('./core/a-mixin'); - -// Extras. -require('./extras/components/'); -require('./extras/primitives/'); - console.log('A-Frame Version: 1.6.0 (Date 2025-01-12, Commit #fed48456)'); console.log('THREE Version (https://github.com/supermedium/three.js):', THREE.REVISION); @@ -65,26 +68,26 @@ if (!window.AFRAME_ASYNC) { readyState.waitForDocumentReadyState(); } -module.exports = window.AFRAME = { - AComponent: require('./core/component').Component, +export default { + AComponent: Component, AEntity: AEntity, ANode: ANode, - ANIME: require('super-animejs').default, + ANIME: ANIME, AScene: AScene, components: components, coreComponents: Object.keys(components), - geometries: require('./core/geometry').geometries, + geometries: geometries, registerComponent: registerComponent, registerGeometry: registerGeometry, registerPrimitive: registerPrimitive, registerShader: registerShader, registerSystem: registerSystem, primitives: { - getMeshMixin: require('./extras/primitives/getMeshMixin'), - primitives: require('./extras/primitives/primitives').primitives + getMeshMixin: getMeshMixin, + primitives: primitives }, - scenes: require('./core/scene/scenes'), - schema: require('./core/schema'), + scenes: scenes, + schema: schema, shaders: shaders, systems: systems, emitReady: readyState.emitReady, diff --git a/src/lib/three.js b/src/lib/three.js index d4b87cc28e6..a8e34a06a2b 100644 --- a/src/lib/three.js +++ b/src/lib/three.js @@ -1,11 +1,27 @@ -var THREE = require('./three.mjs').default; +import * as SUPER_THREE from 'three'; +import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'; +import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'; +import { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader.js'; +import { OBB } from 'three/addons/math/OBB.js'; +import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader.js'; +import { MTLLoader } from 'three/examples/jsm/loaders/MTLLoader.js'; +import * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js'; +import { LightProbeGenerator } from 'three/examples/jsm/lights/LightProbeGenerator.js'; +import { DeviceOrientationControls } from '../../vendor/DeviceOrientationControls.js'; // THREE.DeviceOrientationControls + +var THREE = global.THREE = SUPER_THREE; + // TODO: Eventually include these only if they are needed by a component. -global.THREE = THREE; -require('../../vendor/DeviceOrientationControls'); +THREE.DRACOLoader = DRACOLoader; +THREE.GLTFLoader = GLTFLoader; +THREE.KTX2Loader = KTX2Loader; +THREE.OBJLoader = OBJLoader; +THREE.MTLLoader = MTLLoader; +THREE.OBB = OBB; +THREE.BufferGeometryUtils = BufferGeometryUtils; +THREE.LightProbeGenerator = LightProbeGenerator; +THREE.DeviceOrientationControls = DeviceOrientationControls; -// In-memory caching for XHRs (for images, audio files, textures, etc.). -if (THREE.Cache) { - THREE.Cache.enabled = true; -} +THREE.Cache.enabled = true; -module.exports = THREE; +export default THREE; diff --git a/src/lib/three.mjs b/src/lib/three.mjs deleted file mode 100644 index 22a78bee7eb..00000000000 --- a/src/lib/three.mjs +++ /dev/null @@ -1,21 +0,0 @@ -import * as SUPER_THREE from 'three'; -import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'; -import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'; -import { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader.js'; -import { OBB } from 'three/addons/math/OBB.js'; -import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader.js'; -import { MTLLoader } from 'three/examples/jsm/loaders/MTLLoader.js'; -import * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js'; -import { LightProbeGenerator } from 'three/examples/jsm/lights/LightProbeGenerator.js'; - -var THREE = { ...SUPER_THREE }; -THREE.DRACOLoader = DRACOLoader; -THREE.GLTFLoader = GLTFLoader; -THREE.KTX2Loader = KTX2Loader; -THREE.OBJLoader = OBJLoader; -THREE.MTLLoader = MTLLoader; -THREE.OBB = OBB; -THREE.BufferGeometryUtils = BufferGeometryUtils; -THREE.LightProbeGenerator = LightProbeGenerator; - -export default THREE; diff --git a/src/shaders/flat.js b/src/shaders/flat.js index 5adc38ff317..8da6da47b81 100755 --- a/src/shaders/flat.js +++ b/src/shaders/flat.js @@ -1,11 +1,11 @@ -var registerShader = require('../core/shader').registerShader; -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import { registerShader } from '../core/shader.js'; +import THREE from '../lib/three.js'; +import * as utils from '../utils/index.js'; /** * Flat shader using THREE.MeshBasicMaterial. */ -module.exports.Shader = registerShader('flat', { +export var Shader = registerShader('flat', { schema: { color: {type: 'color'}, fog: {default: true}, diff --git a/src/shaders/index.js b/src/shaders/index.js index d289468b53b..a07d85d1eae 100755 --- a/src/shaders/index.js +++ b/src/shaders/index.js @@ -1,6 +1,6 @@ -require('./flat'); -require('./standard'); -require('./phong'); -require('./sdf'); -require('./msdf'); -require('./shadow'); +import './flat.js'; +import './standard.js'; +import './phong.js'; +import './sdf.js'; +import './msdf.js'; +import './shadow.js'; diff --git a/src/shaders/msdf.js b/src/shaders/msdf.js index f26230c735c..c638ca5c8aa 100644 --- a/src/shaders/msdf.js +++ b/src/shaders/msdf.js @@ -1,5 +1,5 @@ -var registerShader = require('../core/shader').registerShader; -var THREE = require('../lib/three'); +import { registerShader } from '../core/shader.js'; +import THREE from '../lib/three.js'; var VERTEX_SHADER = [ '#include ', @@ -70,7 +70,7 @@ var FRAGMENT_SHADER = [ * Multi-channel signed distance field. * Used by text component. */ -module.exports.Shader = registerShader('msdf', { +export var Shader = registerShader('msdf', { schema: { alphaTest: {type: 'number', is: 'uniform', default: 0.5}, color: {type: 'color', is: 'uniform', default: 'white'}, diff --git a/src/shaders/phong.js b/src/shaders/phong.js index f20a52f7fa8..faac355bab9 100644 --- a/src/shaders/phong.js +++ b/src/shaders/phong.js @@ -1,11 +1,11 @@ -var registerShader = require('../core/shader').registerShader; -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import { registerShader } from '../core/shader.js'; +import THREE from '../lib/three.js'; +import * as utils from '../utils/index.js'; /** * Phong shader using THREE.MeshPhongMaterial. */ -module.exports.Shader = registerShader('phong', { +export var Shader = registerShader('phong', { schema: { color: { type: 'color' }, emissive: { type: 'color', default: 'black' }, diff --git a/src/shaders/sdf.js b/src/shaders/sdf.js index d84dfd80cad..9e03dbcb972 100644 --- a/src/shaders/sdf.js +++ b/src/shaders/sdf.js @@ -1,5 +1,5 @@ -var registerShader = require('../core/shader').registerShader; -var THREE = require('../lib/three'); +import { registerShader } from '../core/shader.js'; +import THREE from '../lib/three.js'; var VERTEX_SHADER = [ '#include ', @@ -81,7 +81,7 @@ var FRAGMENT_SHADER = [ * Signed distance field. * Used by text component. */ -module.exports.Shader = registerShader('sdf', { +export var Shader = registerShader('sdf', { schema: { alphaTest: {type: 'number', is: 'uniform', default: 0.5}, color: {type: 'color', is: 'uniform', default: 'white'}, diff --git a/src/shaders/shadow.js b/src/shaders/shadow.js index 1cdf3aea196..8918d839e1a 100644 --- a/src/shaders/shadow.js +++ b/src/shaders/shadow.js @@ -1,10 +1,10 @@ -var registerShader = require('../core/shader').registerShader; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerShader } from '../core/shader.js'; /** * Flat shader using THREE.ShadowMaterial. */ -module.exports.Shader = registerShader('shadow', { +export var Shader = registerShader('shadow', { schema: { opacity: {default: 0.5}, transparent: {default: true}, diff --git a/src/shaders/standard.js b/src/shaders/standard.js index 853f730552e..2ad1d698554 100755 --- a/src/shaders/standard.js +++ b/src/shaders/standard.js @@ -1,11 +1,11 @@ -var registerShader = require('../core/shader').registerShader; -var THREE = require('../lib/three'); -var utils = require('../utils/'); +import THREE from '../lib/three.js'; +import { registerShader } from '../core/shader.js'; +import * as utils from '../utils/index.js'; /** * Standard (physically-based) shader using THREE.MeshStandardMaterial. */ -module.exports.Shader = registerShader('standard', { +export var Shader = registerShader('standard', { schema: { ambientOcclusionMap: {type: 'map'}, ambientOcclusionMapIntensity: {default: 1}, diff --git a/src/systems/camera.js b/src/systems/camera.js index 6e36c632dad..4c00ada75c8 100755 --- a/src/systems/camera.js +++ b/src/systems/camera.js @@ -1,5 +1,5 @@ -var constants = require('../constants/'); -var registerSystem = require('../core/system').registerSystem; +import * as constants from '../constants/index.js'; +import { registerSystem } from '../core/system.js'; var DEFAULT_CAMERA_ATTR = 'data-aframe-default-camera'; @@ -8,7 +8,7 @@ var DEFAULT_CAMERA_ATTR = 'data-aframe-default-camera'; * * @member {object} activeCameraEl - Active camera entity. */ -module.exports.System = registerSystem('camera', { +export var System = registerSystem('camera', { init: function () { this.activeCameraEl = null; diff --git a/src/systems/geometry.js b/src/systems/geometry.js index a0d978899c0..f30e2039420 100755 --- a/src/systems/geometry.js +++ b/src/systems/geometry.js @@ -1,5 +1,5 @@ -var geometries = require('../core/geometry').geometries; -var registerSystem = require('../core/system').registerSystem; +import { geometries } from '../core/geometry.js'; +import { registerSystem } from '../core/system.js'; /** * System for geometry component. @@ -9,7 +9,7 @@ var registerSystem = require('../core/system').registerSystem; * @member {object} cacheCount - Keep track of number of entities using a geometry to * know whether to dispose on removal. */ -module.exports.System = registerSystem('geometry', { +export var System = registerSystem('geometry', { init: function () { this.cache = {}; this.cacheCount = {}; diff --git a/src/systems/gltf-model.js b/src/systems/gltf-model.js index 2347f1b82de..603dda4355f 100755 --- a/src/systems/gltf-model.js +++ b/src/systems/gltf-model.js @@ -1,5 +1,5 @@ -var registerSystem = require('../core/system').registerSystem; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerSystem } from '../core/system.js'; function fetchScript (src) { return new Promise(function (resolve, reject) { @@ -22,7 +22,7 @@ function fetchScript (src) { * @param {string} basisTranscoderPath - Base path from which to load Basis transcoder library. * @param {string} meshoptDecoderPath - Full path from which to load Meshopt decoder. */ -module.exports.System = registerSystem('gltf-model', { +export var System = registerSystem('gltf-model', { schema: { dracoDecoderPath: {default: 'https://www.gstatic.com/draco/versioned/decoders/1.5.7/'}, basisTranscoderPath: {default: ''}, diff --git a/src/systems/index.js b/src/systems/index.js index f00b5a5ea46..3ecb6164097 100755 --- a/src/systems/index.js +++ b/src/systems/index.js @@ -1,10 +1,10 @@ -require('./camera'); -require('./geometry'); -require('./gltf-model'); -require('./light'); -require('./material'); -require('./obb-collider'); -require('./renderer'); -require('./shadow'); -require('./tracked-controls'); -require('./webxr'); +import './camera.js'; +import './geometry.js'; +import './gltf-model.js'; +import './light.js'; +import './material.js'; +import './obb-collider.js'; +import './renderer.js'; +import './shadow.js'; +import './tracked-controls.js'; +import './webxr.js'; diff --git a/src/systems/light.js b/src/systems/light.js index 68e11da7e48..ce27790f684 100755 --- a/src/systems/light.js +++ b/src/systems/light.js @@ -1,5 +1,5 @@ -var registerSystem = require('../core/system').registerSystem; -var constants = require('../constants/'); +import { registerSystem } from '../core/system.js'; +import * as constants from '../constants/index.js'; var DEFAULT_LIGHT_ATTR = 'data-aframe-default-light'; @@ -12,7 +12,7 @@ var DEFAULT_LIGHT_ATTR = 'data-aframe-default-light'; * @param {bool} defaultLights - Whether default lighting are defined. * @param {bool} userDefinedLights - Whether user lighting is defined. */ -module.exports.System = registerSystem('light', { +export var System = registerSystem('light', { schema: { defaultLightsEnabled: {default: true} }, diff --git a/src/systems/material.js b/src/systems/material.js index 15f651a7886..8b9c40e7b68 100755 --- a/src/systems/material.js +++ b/src/systems/material.js @@ -1,8 +1,7 @@ -var registerSystem = require('../core/system').registerSystem; -var THREE = require('../lib/three'); -var utils = require('../utils/'); -var setTextureProperties = require('../utils/material').setTextureProperties; -var createCompatibleTexture = require('../utils/material').createCompatibleTexture; +import THREE from '../lib/three.js'; +import { registerSystem } from '../core/system.js'; +import * as utils from '../utils/index.js'; +import { setTextureProperties, createCompatibleTexture } from '../utils/material.js'; var debug = utils.debug; var error = debug('components:texture:error'); @@ -16,7 +15,7 @@ var ImageLoader = new THREE.ImageLoader(); * @member {object} materials - Registered materials. * @member {object} sourceCache - Texture source cache for, Image, Video and Canvas sources */ -module.exports.System = registerSystem('material', { +export var System = registerSystem('material', { init: function () { this.materials = {}; this.sourceCache = {}; diff --git a/src/systems/obb-collider.js b/src/systems/obb-collider.js index d25b0915c38..8bee8facb50 100644 --- a/src/systems/obb-collider.js +++ b/src/systems/obb-collider.js @@ -1,4 +1,4 @@ -var registerSystem = require('../core/system').registerSystem; +import { registerSystem } from '../core/system.js'; registerSystem('obb-collider', { schema: { diff --git a/src/systems/renderer.js b/src/systems/renderer.js index 36fa3efad8a..3c65127f189 100644 --- a/src/systems/renderer.js +++ b/src/systems/renderer.js @@ -1,6 +1,6 @@ -var registerSystem = require('../core/system').registerSystem; -var utils = require('../utils/'); -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerSystem } from '../core/system.js'; +import * as utils from '../utils/index.js'; var debug = utils.debug; var warn = debug('components:renderer:warn'); @@ -8,7 +8,7 @@ var warn = debug('components:renderer:warn'); /** * Determines state of various renderer properties. */ -module.exports.System = registerSystem('renderer', { +export var System = registerSystem('renderer', { schema: { antialias: {default: 'auto', oneOf: ['true', 'false', 'auto']}, highRefreshRate: {default: utils.device.isOculusBrowser()}, @@ -110,7 +110,7 @@ module.exports.System = registerSystem('renderer', { // - sort front-to-back by z-depth from camera (this should minimize overdraw) // - otherwise leave objects in default order (object tree order) -function sortFrontToBack (a, b) { +export function sortFrontToBack (a, b) { if (a.groupOrder !== b.groupOrder) { return a.groupOrder - b.groupOrder; } @@ -123,7 +123,7 @@ function sortFrontToBack (a, b) { // Default sort for transparent objects: // - respect groupOrder & renderOrder settings // - otherwise leave objects in default order (object tree order) -function sortRenderOrderOnly (a, b) { +export function sortRenderOrderOnly (a, b) { if (a.groupOrder !== b.groupOrder) { return a.groupOrder - b.groupOrder; } @@ -134,7 +134,7 @@ function sortRenderOrderOnly (a, b) { // - respect groupOrder & renderOrder settings // - sort back-to-front by z-depth from camera // - otherwise leave objects in default order (object tree order) -function sortBackToFront (a, b) { +export function sortBackToFront (a, b) { if (a.groupOrder !== b.groupOrder) { return a.groupOrder - b.groupOrder; } @@ -143,8 +143,3 @@ function sortBackToFront (a, b) { } return b.z - a.z; } - -// exports needed for Unit Tests -module.exports.sortFrontToBack = sortFrontToBack; -module.exports.sortRenderOrderOnly = sortRenderOrderOnly; -module.exports.sortBackToFront = sortBackToFront; diff --git a/src/systems/shadow.js b/src/systems/shadow.js index fa61b0663e7..545700841b3 100644 --- a/src/systems/shadow.js +++ b/src/systems/shadow.js @@ -1,5 +1,5 @@ -var registerSystem = require('../core/system').registerSystem; -var THREE = require('../lib/three'); +import THREE from '../lib/three.js'; +import { registerSystem } from '../core/system.js'; var SHADOW_MAP_TYPE_MAP = { basic: THREE.BasicShadowMap, @@ -13,7 +13,7 @@ var SHADOW_MAP_TYPE_MAP = { * Enabled automatically when one or more shadow components are added to the scene, the system sets * options on the WebGLRenderer for configuring shadow appearance. */ -module.exports.System = registerSystem('shadow', { +export var System = registerSystem('shadow', { schema: { enabled: {default: true}, autoUpdate: {default: true}, diff --git a/src/systems/tracked-controls.js b/src/systems/tracked-controls.js index d42856f940b..d65e3ff7e88 100644 --- a/src/systems/tracked-controls.js +++ b/src/systems/tracked-controls.js @@ -1,11 +1,10 @@ -var registerSystem = require('../core/system').registerSystem; -var utils = require('../utils'); +import { registerSystem } from '../core/system.js'; /** * Tracked controls system. * Maintain list with available tracked controllers. */ -module.exports.System = registerSystem('tracked-controls', { +export var System = registerSystem('tracked-controls', { init: function () { this.controllers = []; this.onInputSourcesChange = this.onInputSourcesChange.bind(this); diff --git a/src/systems/webxr.js b/src/systems/webxr.js index afe355619c8..e0fee0774e2 100644 --- a/src/systems/webxr.js +++ b/src/systems/webxr.js @@ -1,12 +1,12 @@ -var registerSystem = require('../core/system').registerSystem; +import { registerSystem } from '../core/system.js'; +import * as utils from '../utils/index.js'; -var utils = require('../utils/'); var warn = utils.debug('systems:webxr:warn'); /** * WebXR session initialization and XR module support. */ -module.exports.System = registerSystem('webxr', { +export var System = registerSystem('webxr', { schema: { referenceSpaceType: {type: 'string', default: 'local-floor'}, requiredFeatures: {type: 'array', default: ['local-floor']}, diff --git a/src/utils/coordinates.js b/src/utils/coordinates.js index ab45fe10a88..af90624d0bd 100644 --- a/src/utils/coordinates.js +++ b/src/utils/coordinates.js @@ -1,5 +1,5 @@ /* global THREE */ -var debug = require('./debug'); +import debug from './debug.js'; var warn = debug('utils:coordinates:warn'); @@ -7,8 +7,7 @@ var warn = debug('utils:coordinates:warn'); var COORDINATE_KEYS = ['x', 'y', 'z', 'w']; // Coordinate string regex. Handles negative, positive, and decimals. -var regex = /^\s*((-?\d*\.{0,1}\d+(e-?\d+)?)\s+){2,3}(-?\d*\.{0,1}\d+(e-?\d+)?)\s*$/; -module.exports.regex = regex; +export var regex = /^\s*((-?\d*\.{0,1}\d+(e-?\d+)?)\s+){2,3}(-?\d*\.{0,1}\d+(e-?\d+)?)\s*$/; var whitespaceRegex = /\s+/g; @@ -21,7 +20,7 @@ var whitespaceRegex = /\s+/g; * @param {object} target - Optional target object for coordinates. * @returns {object} An object with keys [x, y, z]. */ -function parse (value, defaultVec, target) { +export function parse (value, defaultVec, target) { var coordinate; var defaultVal; var key; @@ -61,7 +60,6 @@ function parse (value, defaultVec, target) { } return vec; } -module.exports.parse = parse; /** * Stringify coordinates from an object with keys [x y z]. @@ -70,7 +68,7 @@ module.exports.parse = parse; * @param {object|string} data - An object with keys [x y z]. * @returns {string} An "x y z" string. */ -function stringify (data) { +export function stringify (data) { var str; if (typeof data !== 'object') { return data; } str = data.x + ' ' + data.y; @@ -78,7 +76,6 @@ function stringify (data) { if (data.w != null) { str += ' ' + data.w; } return str; } -module.exports.stringify = stringify; /** * Compares the values of two coordinates to check equality. @@ -87,26 +84,24 @@ module.exports.stringify = stringify; * @param {object|string} b - An object with keys [x y z]. * @returns {boolean} True if both coordinates are equal, false otherwise */ -function equals (a, b) { +export function equals (a, b) { if (typeof a !== 'object' || typeof b !== 'object') { return a === b; } return a.x === b.x && a.y === b.y && a.z === b.z && a.w === b.w; } -module.exports.equals = equals; /** * @returns {bool} */ -function isCoordinates (value) { +export function isCoordinates (value) { return regex.test(value); } -module.exports.isCoordinates = isCoordinates; -module.exports.isCoordinate = function (value) { +export function isCoordinate (value) { warn('`AFRAME.utils.isCoordinate` has been renamed to `AFRAME.utils.isCoordinates`'); return isCoordinates(value); -}; +} function parseIfString (val) { if (val !== null && val !== undefined && val.constructor === String) { @@ -118,6 +113,6 @@ function parseIfString (val) { /** * Convert {x, y, z} object to three.js Vector3. */ -module.exports.toVector3 = function (vec3) { +export function toVector3 (vec3) { return new THREE.Vector3(vec3.x, vec3.y, vec3.z); -}; +} diff --git a/src/utils/debug.js b/src/utils/debug.js index 2304ff0a5f1..7e7a87bdab1 100644 --- a/src/utils/debug.js +++ b/src/utils/debug.js @@ -1,5 +1,4 @@ -var debug = require('debug'); -var isBrowserEnvironment = require('./device').isBrowserEnvironment; +import debug from 'debug'; var settings = { colors: { @@ -115,6 +114,4 @@ if (ls && (parseInt(ls.logs, 10) || ls.logs === 'true')) { debug.enable('*:error,*:info,*:warn'); } -if (isBrowserEnvironment) { window.logs = debug; } - -module.exports = debug; +export default debug; diff --git a/src/utils/device.js b/src/utils/device.js index 1a29132b65d..82790f3b26c 100644 --- a/src/utils/device.js +++ b/src/utils/device.js @@ -1,13 +1,10 @@ -var error = require('debug')('device:error'); +import debug from './debug.js'; +var error = debug('device:error'); var supportsVRSession = false; var supportsARSession = false; -/** - * Oculus Browser 7 doesn't support the WebXR gamepads module. - * We fallback to WebVR API and will hotfix when implementation is complete. - */ -var isWebXRAvailable = module.exports.isWebXRAvailable = navigator.xr !== undefined; +export var isWebXRAvailable = navigator.xr !== undefined; // Support both WebVR and WebXR APIs. if (isWebXRAvailable) { @@ -57,22 +54,19 @@ if (isWebXRAvailable) { /** * Determine if a headset is connected. */ -function checkHeadsetConnected () { +export function checkHeadsetConnected () { return supportsVRSession || supportsARSession; } -module.exports.checkHeadsetConnected = checkHeadsetConnected; -function checkARSupport () { return supportsARSession; } -module.exports.checkARSupport = checkARSupport; +export function checkARSupport () { return supportsARSession; } -function checkVRSupport () { return supportsVRSession; } -module.exports.checkVRSupport = checkVRSupport; +export function checkVRSupport () { return supportsVRSession; } /** * Checks if browser is mobile and not stand-alone dedicated vr device. * @return {Boolean} True if mobile browser detected. */ -var isMobile = (function () { +export var isMobile = (function () { var _isMobile = false; (function (a) { // eslint-disable-next-line no-useless-escape @@ -89,13 +83,12 @@ var isMobile = (function () { return function () { return _isMobile; }; })(); -module.exports.isMobile = isMobile; /** * Detect tablet devices. * @param {string} mockUserAgent - Allow passing a mock user agent for testing. */ -function isTablet (mockUserAgent) { +export function isTablet (mockUserAgent) { var userAgent = mockUserAgent || window.navigator.userAgent; var isTablet = /Nexus (7|9)|xoom|sch-i800|playbook|tablet|kindle/i.test(userAgent); @@ -103,7 +96,6 @@ function isTablet (mockUserAgent) { // Additional check for iPad or MacIntel with touch capabilities and not an MSStream device return isTablet || isIpad(); } -module.exports.isTablet = isTablet; /** * Detect ipad devices. @@ -111,19 +103,18 @@ module.exports.isTablet = isTablet; * @param {string} mockDevicePlatform - Allow passing a mock device platform for testing. * @param {string} mockDeviceTouchPoints - Allow passing a mock device touch points for testing. */ -function isIpad (mockUserAgent, mockDevicePlatform, mockDeviceTouchPoints) { +export function isIpad (mockUserAgent, mockDevicePlatform, mockDeviceTouchPoints) { var userAgent = mockUserAgent || window.navigator.userAgent; var platform = mockDevicePlatform || window.navigator.platform; var maxTouchPoints = mockDeviceTouchPoints || window.navigator.maxTouchPoints || 0; return ((platform === 'iPad' || platform === 'MacIntel') && maxTouchPoints > 0 && /Macintosh|Intel|iPad|ipad/i.test(userAgent) && !window.MSStream); } -module.exports.isIpad = isIpad; /** * Detect Apple Vision Pro devices. -*/ -function isAppleVisionPro () { + */ +export function isAppleVisionPro () { // Safari for Apple Vision Pro presents itself as a desktop browser. var isMacintosh = navigator.userAgent.includes('Macintosh'); // Discriminates between a "real" desktop browser and Safari for Vision Pro. @@ -132,56 +123,49 @@ function isAppleVisionPro () { // This will no longer work once WebXR ships in iOS / iPad OS. return isMacintosh && hasFiveTouchPoints && isWebXRAvailable; } -module.exports.isAppleVisionPro = isAppleVisionPro; -function isIOS () { +export function isIOS () { return /iPad|iPhone|iPod/.test(window.navigator.platform); } -module.exports.isIOS = isIOS; -function isMobileDeviceRequestingDesktopSite () { +export function isMobileDeviceRequestingDesktopSite () { return !isMobile() && !isMobileVR() && window.orientation !== undefined; } -module.exports.isMobileDeviceRequestingDesktopSite = isMobileDeviceRequestingDesktopSite; /** * Detect Oculus Browser (standalone headset) */ -function isOculusBrowser () { +export function isOculusBrowser () { return /(OculusBrowser)/i.test(window.navigator.userAgent); } -module.exports.isOculusBrowser = isOculusBrowser; /** * Detect Firefox Reality (standalone headset) */ -function isFirefoxReality () { +export function isFirefoxReality () { return /(Mobile VR)/i.test(window.navigator.userAgent); } -module.exports.isFirefoxReality = isFirefoxReality; /** * Detect browsers in Stand-Alone headsets */ -function isMobileVR () { +export function isMobileVR () { return isOculusBrowser() || isFirefoxReality() || isAppleVisionPro(); } -module.exports.isMobileVR = isMobileVR; -function isR7 () { +export function isR7 () { return /R7 Build/.test(window.navigator.userAgent); } -module.exports.isR7 = isR7; /** * Checks mobile device orientation. * @return {Boolean} True if landscape orientation. */ -module.exports.isLandscape = function () { +export function isLandscape () { var orientation = window.orientation; if (isR7()) { orientation += 90; } return orientation === 90 || orientation === -90; -}; +} /** * Check if running in a browser or spoofed browser (bundler). @@ -190,9 +174,9 @@ module.exports.isLandscape = function () { * `window` is mocked in node. * `process` is also mocked by webpack running with karma, but has custom properties like process.browser. */ -module.exports.isBrowserEnvironment = typeof process === 'undefined' || process.browser === true; +export var isBrowserEnvironment = typeof process === 'undefined' || process.browser === true; /** * Check if running in node on the server. */ -module.exports.isNodeEnvironment = !module.exports.isBrowserEnvironment; +export var isNodeEnvironment = !isBrowserEnvironment; diff --git a/src/utils/entity.js b/src/utils/entity.js index 5c144c6e861..5713aa445ef 100644 --- a/src/utils/entity.js +++ b/src/utils/entity.js @@ -1,4 +1,4 @@ -var split = require('./split').split; +import { split } from './split.js'; /** * Split a delimited component property string (e.g., `material.color`) to an object @@ -11,7 +11,7 @@ var split = require('./split').split; * @param {string} delimiter - e.g., `.`. * @returns {array} e.g., `['material', 'opacity']`. */ -function getComponentPropertyPath (str, delimiter) { +export function getComponentPropertyPath (str, delimiter) { delimiter = delimiter || '.'; var parts = split(str, delimiter); if (parts.length === 1) { @@ -19,13 +19,12 @@ function getComponentPropertyPath (str, delimiter) { } return parts; } -module.exports.getComponentPropertyPath = getComponentPropertyPath; /** * Get component property using encoded component name + component property name with a * delimiter. */ -module.exports.getComponentProperty = function (el, name, delimiter) { +export function getComponentProperty (el, name, delimiter) { var splitName; delimiter = delimiter || '.'; if (name.indexOf(delimiter) !== -1) { @@ -36,13 +35,13 @@ module.exports.getComponentProperty = function (el, name, delimiter) { return el.getAttribute(splitName[0])[splitName[1]]; } return el.getAttribute(name); -}; +} /** * Set component property using encoded component name + component property name with a * delimiter. */ -module.exports.setComponentProperty = function (el, name, value, delimiter) { +export function setComponentProperty (el, name, value, delimiter) { var splitName; delimiter = delimiter || '.'; if (name.indexOf(delimiter) !== -1) { @@ -55,4 +54,4 @@ module.exports.setComponentProperty = function (el, name, value, delimiter) { return; } el.setAttribute(name, value); -}; +} diff --git a/src/utils/forceCanvasResizeSafariMobile.js b/src/utils/forceCanvasResizeSafariMobile.js index 2f87bdcc2bd..8d178baf329 100644 --- a/src/utils/forceCanvasResizeSafariMobile.js +++ b/src/utils/forceCanvasResizeSafariMobile.js @@ -1,4 +1,4 @@ -module.exports = function forceCanvasResizeSafariMobile (canvasEl) { +export default function forceCanvasResizeSafariMobile (canvasEl) { var width = canvasEl.style.width; var height = canvasEl.style.height; // Taken from webvr-polyfill (https://github.com/borismus/webvr-polyfill/blob/85f657cd502ec9417bf26b87c3cb2afa6a70e079/src/util.js#L200) @@ -11,4 +11,4 @@ module.exports = function forceCanvasResizeSafariMobile (canvasEl) { canvasEl.style.width = width; canvasEl.style.height = height; }, 200); -}; +} diff --git a/src/utils/index.js b/src/utils/index.js index 5c39137b423..77a4a9dce68 100644 --- a/src/utils/index.js +++ b/src/utils/index.js @@ -1,46 +1,47 @@ /* global location */ /* Centralized place to reference utilities since utils is exposed to the user. */ -var debug = require('./debug'); -var deepAssign = require('deep-assign'); -var device = require('./device'); -var objectPool = require('./object-pool'); +import debug from './debug.js'; +import deepAssign from 'deep-assign'; +import * as device from './device.js'; +import * as objectPool from './object-pool.js'; var warn = debug('utils:warn'); /** @deprecated */ -module.exports.bind = function (fn) { +export function bind (fn) { return fn.bind.apply(fn, Array.prototype.slice.call(arguments, 1)); -}; -module.exports.coordinates = require('./coordinates'); -module.exports.debug = debug; -module.exports.device = device; -module.exports.entity = require('./entity'); -module.exports.forceCanvasResizeSafariMobile = require('./forceCanvasResizeSafariMobile'); -module.exports.material = require('./material'); -module.exports.objectPool = objectPool; -module.exports.split = require('./split').split; -module.exports.styleParser = require('./styleParser'); -module.exports.trackedControls = require('./tracked-controls'); - -module.exports.checkHeadsetConnected = function () { +} +export * as coordinates from './coordinates.js'; +export { default as debug } from './debug.js'; +export * as device from './device.js'; +export * as entity from './entity.js'; +export { default as forceCanvasResizeSafariMobile } from './forceCanvasResizeSafariMobile.js'; +export * as material from './material.js'; +export * as objectPool from './object-pool.js'; +export { split } from './split.js'; +export * as styleParser from './styleParser.js'; +export * as trackedControls from './tracked-controls.js'; + +export function checkHeadsetConnected () { warn('`utils.checkHeadsetConnected` has moved to `utils.device.checkHeadsetConnected`'); return device.checkHeadsetConnected(arguments); -}; -module.exports.isGearVR = module.exports.device.isGearVR = function () { +} +export function isGearVR () { warn('`utils.isGearVR` has been deprecated, use `utils.device.isMobileVR`'); -}; -module.exports.isIOS = function () { +} + +export function isIOS () { warn('`utils.isIOS` has moved to `utils.device.isIOS`'); return device.isIOS(arguments); -}; -module.exports.isOculusGo = module.exports.device.isOculusGo = function () { +} +export function isOculusGo () { warn('`utils.isOculusGo` has been deprecated, use `utils.device.isMobileVR`'); -}; -module.exports.isMobile = function () { +} +export function isMobile () { warn('`utils.isMobile has moved to `utils.device.isMobile`'); return device.isMobile(arguments); -}; +} /** * Returns throttle function that gets called at most once every interval. @@ -50,7 +51,7 @@ module.exports.isMobile = function () { * @param {object} optionalContext - If given, bind function to throttle to this context. * @returns {function} Throttled function. */ -module.exports.throttle = function (functionToThrottle, minimumInterval, optionalContext) { +export function throttle (functionToThrottle, minimumInterval, optionalContext) { var lastTime; if (optionalContext) { functionToThrottle = functionToThrottle.bind(optionalContext); @@ -63,7 +64,7 @@ module.exports.throttle = function (functionToThrottle, minimumInterval, optiona functionToThrottle.apply(null, arguments); } }; -}; +} /** * Returns throttle function that gets called at most once every interval. @@ -83,7 +84,7 @@ module.exports.throttle = function (functionToThrottle, minimumInterval, optiona * @param {object} optionalContext - If given, bind function to throttle to this context. * @returns {function} Throttled function. */ -module.exports.throttleLeadingAndTrailing = function (functionToThrottle, minimumInterval, optionalContext) { +export function throttleLeadingAndTrailing (functionToThrottle, minimumInterval, optionalContext) { var lastTime; var deferTimer; if (optionalContext) { @@ -115,7 +116,7 @@ module.exports.throttleLeadingAndTrailing = function (functionToThrottle, minimu args = arguments; } }; -}; +} /** * Returns throttle function that gets called at most once every interval. @@ -126,7 +127,7 @@ module.exports.throttleLeadingAndTrailing = function (functionToThrottle, minimu * @param {object} optionalContext - If given, bind function to throttle to this context. * @returns {function} Throttled function. */ -module.exports.throttleTick = function (functionToThrottle, minimumInterval, optionalContext) { +export function throttleTick (functionToThrottle, minimumInterval, optionalContext) { var lastTime; if (optionalContext) { functionToThrottle = functionToThrottle.bind(optionalContext); @@ -138,7 +139,7 @@ module.exports.throttleTick = function (functionToThrottle, minimumInterval, opt functionToThrottle(time, sinceLastTime); } }; -}; +} /** * Returns debounce function that gets called only once after a set of repeated calls. @@ -148,7 +149,7 @@ module.exports.throttleTick = function (functionToThrottle, minimumInterval, opt * @param {boolean} immediate - Calls the function immediately regardless of if it should be waiting. * @returns {function} Debounced function. */ -module.exports.debounce = function (func, wait, immediate) { +export function debounce (func, wait, immediate) { var timeout; return function () { var context = this; @@ -162,7 +163,7 @@ module.exports.debounce = function (func, wait, immediate) { timeout = setTimeout(later, wait); if (callNow) func.apply(context, args); }; -}; +} /** * Mix the properties of source object(s) into a destination object. @@ -170,12 +171,12 @@ module.exports.debounce = function (func, wait, immediate) { * @param {object} dest - The object to which properties will be copied. * @param {...object} source - The object(s) from which properties will be copied. */ -module.exports.extend = Object.assign; -module.exports.extendDeep = deepAssign; +export var extend = Object.assign; +export var extendDeep = deepAssign; -module.exports.clone = function (obj) { +export function clone (obj) { return JSON.parse(JSON.stringify(obj)); -}; +} /** * Checks if two values are equal. @@ -187,7 +188,7 @@ module.exports.clone = function (obj) { * @param {object} b - Second object. * @returns {boolean} Whether two objects are deeply equal. */ -var deepEqual = (function () { +export var deepEqual = (function () { var arrayPool = objectPool.createPool(function () { return []; }); return function (a, b) { @@ -243,7 +244,6 @@ var deepEqual = (function () { return true; }; })(); -module.exports.deepEqual = deepEqual; /** * Computes the difference between two objects. @@ -254,7 +254,7 @@ module.exports.deepEqual = deepEqual; * Difference object where set of keys note which values were not equal, and values are * `b`'s values. */ -module.exports.diff = (function () { +export var diff = (function () { var keys = []; return function (a, b, targetObject) { @@ -301,10 +301,10 @@ module.exports.diff = (function () { * @param {Event} event Event object. * @returns {Boolean} Whether the key event should be captured. */ -module.exports.shouldCaptureKeyEvent = function (event) { +export function shouldCaptureKeyEvent (event) { if (event.metaKey) { return false; } return document.activeElement === document.body; -}; +} /** * Splits a string into an array based on a delimiter. @@ -313,14 +313,14 @@ module.exports.shouldCaptureKeyEvent = function (event) { * @param {string=} [delimiter=' '] Delimiter to use * @returns {array} Array of delimited strings */ -module.exports.splitString = function (str, delimiter) { +export function splitString (str, delimiter) { if (typeof delimiter === 'undefined') { delimiter = ' '; } // First collapse the whitespace (or whatever the delimiter is). var regex = new RegExp(delimiter, 'g'); str = (str || '').replace(regex, delimiter); // Then split. return str.split(delimiter); -}; +} /** * Extracts data from the element given an object that contains expected keys. @@ -329,7 +329,7 @@ module.exports.splitString = function (str, delimiter) { * @param {Object} [defaults={}] Object of default key-value pairs. * @returns {Object} */ -module.exports.getElData = function (el, defaults) { +export function getElData (el, defaults) { defaults = defaults || {}; var data = {}; Object.keys(defaults).forEach(copyAttribute); @@ -339,33 +339,33 @@ module.exports.getElData = function (el, defaults) { } } return data; -}; +} /** * Retrieves querystring value. * @param {String} name Name of querystring key. * @return {String} Value */ -module.exports.getUrlParameter = function (name) { +export function getUrlParameter (name) { // eslint-disable-next-line no-useless-escape name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]'); var regex = new RegExp('[\\?&]' + name + '=([^&#]*)'); var results = regex.exec(location.search); return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' ')); -}; +} /** * Detects whether context is within iframe. */ -module.exports.isIframed = function () { +export function isIframed () { return window.top !== window.self; -}; +} /** * Finds all elements under the element that have the isScene * property set to true */ -module.exports.findAllScenes = function (el) { +export function findAllScenes (el) { var matchingElements = []; var allElements = el.getElementsByTagName('*'); for (var i = 0, n = allElements.length; i < n; i++) { @@ -375,7 +375,7 @@ module.exports.findAllScenes = function (el) { } } return matchingElements; -}; +} // Must be at bottom to avoid circular dependency. -module.exports.srcLoader = require('./src-loader'); +export { default as srcLoader } from './src-loader.js'; diff --git a/src/utils/ios-orientationchange-blank-bug.js b/src/utils/ios-orientationchange-blank-bug.js index 16531809195..f5ceb574f08 100644 --- a/src/utils/ios-orientationchange-blank-bug.js +++ b/src/utils/ios-orientationchange-blank-bug.js @@ -1,13 +1,17 @@ +import { isIOS } from './device.js'; + // Safari regression introduced in iOS 12 and remains in iOS 13. // https://stackoverflow.com/questions/62717621/white-space-at-page-bottom-after-device-rotation-in-ios-safari -window.addEventListener('orientationchange', function () { - document.documentElement.style.height = 'initial'; - setTimeout(function () { - document.documentElement.style.height = '100%'; +if (isIOS()) { + window.addEventListener('orientationchange', function () { + document.documentElement.style.height = 'initial'; setTimeout(function () { - // this line prevents the content - // from hiding behind the address bar - window.scrollTo(0, 1); + document.documentElement.style.height = '100%'; + setTimeout(function () { + // this line prevents the content + // from hiding behind the address bar + window.scrollTo(0, 1); + }, 500); }, 500); - }, 500); -}); + }); +} diff --git a/src/utils/material.js b/src/utils/material.js index 410fcfa75b2..13a21452336 100644 --- a/src/utils/material.js +++ b/src/utils/material.js @@ -1,7 +1,7 @@ /* global HTMLCanvasElement, HTMLImageElement, HTMLVideoElement */ -var THREE = require('../lib/three'); -var srcLoader = require('./src-loader'); -var debug = require('./debug'); +import THREE from '../lib/three.js'; +import srcLoader from './src-loader.js'; +import debug from './debug.js'; var warn = debug('utils:material:warn'); var COLOR_MAPS = new Set([ @@ -16,7 +16,7 @@ var COLOR_MAPS = new Set([ * * @param {object} data - With keys like `repeat`. */ -function setTextureProperties (texture, data) { +export function setTextureProperties (texture, data) { var offset = data.offset || {x: 0, y: 0}; var repeat = data.repeat || {x: 1, y: 1}; var npot = data.npot || false; @@ -56,7 +56,6 @@ function setTextureProperties (texture, data) { texture.needsUpdate = true; } } -module.exports.setTextureProperties = setTextureProperties; /** * Update `material` texture property (usually but not always `map`) @@ -65,7 +64,7 @@ module.exports.setTextureProperties = setTextureProperties; * @param {object} shader - A-Frame shader instance. * @param {object} data */ -module.exports.updateMapMaterialFromData = function (materialName, dataName, shader, data) { +export function updateMapMaterialFromData (materialName, dataName, shader, data) { var el = shader.el; var material = shader.material; var rendererSystem = el.sceneEl.systems.renderer; @@ -150,7 +149,7 @@ module.exports.updateMapMaterialFromData = function (materialName, dataName, sha material.needsUpdate = true; handleTextureEvents(el, texture); } -}; +} /** * Update `material.map` given `data.src`. For standard and flat shaders. @@ -158,9 +157,9 @@ module.exports.updateMapMaterialFromData = function (materialName, dataName, sha * @param {object} shader - A-Frame shader instance. * @param {object} data */ -module.exports.updateMap = function (shader, data) { - return module.exports.updateMapMaterialFromData('map', 'src', shader, data); -}; +export function updateMap (shader, data) { + return updateMapMaterialFromData('map', 'src', shader, data); +} /** * Updates the material's maps which give the illusion of extra geometry. @@ -169,7 +168,7 @@ module.exports.updateMap = function (shader, data) { * @param {object} shader - A-Frame shader instance * @param {object} data */ -module.exports.updateDistortionMap = function (longType, shader, data) { +export function updateDistortionMap (longType, shader, data) { var shortType = longType; if (longType === 'ambientOcclusion') { shortType = 'ao'; } @@ -180,8 +179,8 @@ module.exports.updateDistortionMap = function (longType, shader, data) { info.offset = data[longType + 'TextureOffset']; info.repeat = data[longType + 'TextureRepeat']; info.wrap = data[longType + 'TextureWrap']; - return module.exports.updateMapMaterialFromData(shortType + 'Map', 'src', shader, info); -}; + return updateMapMaterialFromData(shortType + 'Map', 'src', shader, info); +} // Cache env map results as promises var envMapPromises = {}; @@ -192,7 +191,7 @@ var envMapPromises = {}; * @param {object} shader - A-Frame shader instance * @param {object} data */ -module.exports.updateEnvMap = function (shader, data) { +export function updateEnvMap (shader, data) { var material = shader.material; var el = shader.el; var materialName = 'envMap'; @@ -249,7 +248,7 @@ module.exports.updateEnvMap = function (shader, data) { material.needsUpdate = true; handleTextureEvents(el, texture); } -}; +} /** * Emit event on entities on texture-related events. @@ -257,7 +256,7 @@ module.exports.updateEnvMap = function (shader, data) { * @param {Element} el - Entity. * @param {object} texture - three.js Texture. */ -function handleTextureEvents (el, texture) { +export function handleTextureEvents (el, texture) { if (!texture) { return; } el.emit('materialtextureloaded', {src: texture.image, texture: texture}); @@ -281,7 +280,6 @@ function handleTextureEvents (el, texture) { texture.image.removeEventListener('ended', emitVideoTextureEndedAll); }); } -module.exports.handleTextureEvents = handleTextureEvents; /** * Checks if a given texture type is compatible with a given source. @@ -290,7 +288,7 @@ module.exports.handleTextureEvents = handleTextureEvents; * @param {THREE.Source} source - The source to check compatibility with * @returns {boolean} True if the texture is compatible with the source, false otherwise */ -function isCompatibleTexture (texture, source) { +export function isCompatibleTexture (texture, source) { if (texture.source !== source) { return false; } @@ -305,9 +303,8 @@ function isCompatibleTexture (texture, source) { return texture.isTexture && !texture.isCanvasTexture && !texture.isVideoTexture; } -module.exports.isCompatibleTexture = isCompatibleTexture; -function createCompatibleTexture (source) { +export function createCompatibleTexture (source) { var texture; if (source.data instanceof HTMLCanvasElement) { @@ -323,4 +320,3 @@ function createCompatibleTexture (source) { texture.needsUpdate = true; return texture; } -module.exports.createCompatibleTexture = createCompatibleTexture; diff --git a/src/utils/math.js b/src/utils/math.js index 50cdc1fad8b..eda4500be98 100644 --- a/src/utils/math.js +++ b/src/utils/math.js @@ -5,7 +5,7 @@ * @param {THREE.Vector3} pointToTest point to test * @returns Number */ - function distanceOfPointFromPlane (positionOnPlane, planeNormal, pointToTest) { + export function distanceOfPointFromPlane (positionOnPlane, planeNormal, pointToTest) { // the d value in the plane equation a*x + b*y + c*z=d var d = planeNormal.dot(positionOnPlane); @@ -21,7 +21,7 @@ * @param {THREE.Vector3} resultPoint where to store the result. * @returns */ - function nearestPointInPlane (positionOnPlane, planeNormal, pointToTest, resultPoint) { + export function nearestPointInPlane (positionOnPlane, planeNormal, pointToTest, resultPoint) { var t = distanceOfPointFromPlane(positionOnPlane, planeNormal, pointToTest); // closest point on the plane resultPoint.copy(planeNormal); @@ -29,6 +29,3 @@ resultPoint.add(pointToTest); return resultPoint; } - - module.exports.distanceOfPointFromPlane = distanceOfPointFromPlane; - module.exports.nearestPointInPlane = nearestPointInPlane; diff --git a/src/utils/object-pool.js b/src/utils/object-pool.js index 3a043a7eca0..c2184f9006a 100644 --- a/src/utils/object-pool.js +++ b/src/utils/object-pool.js @@ -10,7 +10,7 @@ function defaultObjectFactory () { return {}; } /** * Create a new pool. */ -module.exports.createPool = function createPool (objectFactory) { +export function createPool (objectFactory) { var objPool = []; var nextFreeSlot = null; // Pool location to look for a free object to use. @@ -68,16 +68,15 @@ module.exports.createPool = function createPool (objectFactory) { size: size, use: use }; -}; +} -function clearObject (obj) { +export function clearObject (obj) { var key; if (!obj || obj.constructor !== Object) { return; } for (key in obj) { obj[key] = undefined; } } -module.exports.clearObject = clearObject; -function removeUnusedKeys (obj, schema) { +export function removeUnusedKeys (obj, schema) { var key; if (!obj || obj.constructor !== Object) { return; } for (key in obj) { @@ -86,4 +85,3 @@ function removeUnusedKeys (obj, schema) { } } } -module.exports.removeUnusedKeys = removeUnusedKeys; diff --git a/src/utils/split.js b/src/utils/split.js index 5fa7b5abc4a..991ea479dc4 100644 --- a/src/utils/split.js +++ b/src/utils/split.js @@ -1,7 +1,7 @@ /** * String split with cached result. */ -module.exports.split = (function () { +export var split = (function () { var splitCache = {}; return function (str, delimiter) { diff --git a/src/utils/src-loader.js b/src/utils/src-loader.js index cd705831071..83cc969b710 100644 --- a/src/utils/src-loader.js +++ b/src/utils/src-loader.js @@ -1,5 +1,5 @@ /* global Image, XMLHttpRequest */ -var debug = require('./debug'); +import debug from './debug.js'; var warn = debug('utils:src-loader:warn'); @@ -184,7 +184,7 @@ function validateAndGetQuerySelector (selector) { } } -module.exports = { +export default { parseUrl: parseUrl, validateSrc: validateSrc, validateCubemapSrc: validateCubemapSrc, diff --git a/src/utils/styleParser.js b/src/utils/styleParser.js index e7e8d8b87a6..ae69cbcd4a4 100644 --- a/src/utils/styleParser.js +++ b/src/utils/styleParser.js @@ -12,14 +12,14 @@ var DASH_REGEX = /-([a-z])/g; * @param {object} obj - Reused object for object pooling. * @returns {object} Property data. */ -module.exports.parse = function (value, obj) { +export function parse (value, obj) { var parsedData; if (typeof value !== 'string') { return value; } parsedData = styleParse(value, obj); // The style parser returns an object { "" : "test"} when fed a string if (parsedData['']) { return value; } return parsedData; -}; +} /** * Serialize an object of properties into a style-like string. @@ -27,10 +27,10 @@ module.exports.parse = function (value, obj) { * @param {object} data - Property data. * @returns {string} */ -module.exports.stringify = function (data) { +export function stringify (data) { if (typeof data === 'string') { return data; } return styleStringify(data); -}; +} /** * Converts string from hyphen to camelCase. @@ -38,10 +38,9 @@ module.exports.stringify = function (data) { * @param {string} str - String to camelCase. * @return {string} CamelCased string. */ -function toCamelCase (str) { +export function toCamelCase (str) { return str.replace(DASH_REGEX, upperCase); } -module.exports.toCamelCase = toCamelCase; /** * Split a string into chunks matching `: ` diff --git a/src/utils/tracked-controls.js b/src/utils/tracked-controls.js index 67ccfa9ed95..108ae86339d 100644 --- a/src/utils/tracked-controls.js +++ b/src/utils/tracked-controls.js @@ -10,7 +10,7 @@ var AXIS_LABELS = ['x', 'y', 'z', 'w']; * @param {object} idPrefix - Prefix to match in gamepad id if any. * @param {object} queryObject - Map of values to match. */ -module.exports.checkControllerPresentAndSetup = function (component, idPrefix, queryObject) { +export function checkControllerPresentAndSetup (component, idPrefix, queryObject) { var el = component.el; var controller; var isControllerPresent = isControllerPresentWebXR; @@ -33,13 +33,13 @@ module.exports.checkControllerPresentAndSetup = function (component, idPrefix, q component.removeEventListeners(); el.emit('controllerdisconnected', {name: component.name, component: component}); } -}; +} /** * * @param {object} component - Tracked controls component. */ -function isControllerPresentWebXR (component, id, queryObject) { +export function isControllerPresentWebXR (component, id, queryObject) { var controllers; var sceneEl = component.el.sceneEl; var trackedControlsSystem = sceneEl && sceneEl.systems['tracked-controls']; @@ -53,9 +53,7 @@ function isControllerPresentWebXR (component, id, queryObject) { queryObject.hand, queryObject.index, queryObject.iterateControllerProfiles, queryObject.handTracking); } -module.exports.isControllerPresentWebXR = isControllerPresentWebXR; - -function findMatchingControllerWebXR (controllers, idPrefix, handedness, index, iterateProfiles, handTracking) { +export function findMatchingControllerWebXR (controllers, idPrefix, handedness, index, iterateProfiles, handTracking) { var i; var j; var controller; @@ -89,8 +87,6 @@ function findMatchingControllerWebXR (controllers, idPrefix, handedness, index, return undefined; } -module.exports.findMatchingControllerWebXR = findMatchingControllerWebXR; - /** * Emit specific `moved` event(s) if axes changed based on original axismove event. * @@ -98,7 +94,7 @@ module.exports.findMatchingControllerWebXR = findMatchingControllerWebXR; * @param {array} axesMapping - For example `{thumbstick: [0, 1]}`. * @param {object} evt - Event to process. */ -module.exports.emitIfAxesChanged = function (component, axesMapping, evt) { +export function emitIfAxesChanged (component, axesMapping, evt) { var axes; var buttonType; var changed; @@ -122,7 +118,7 @@ module.exports.emitIfAxesChanged = function (component, axesMapping, evt) { } component.el.emit(buttonType + 'moved', detail); } -}; +} /** * Handle a button event and reemits the events. @@ -132,11 +128,11 @@ module.exports.emitIfAxesChanged = function (component, axesMapping, evt) { * @param {object} component - reference to the component * @param {string} hand - handedness of the controller: left or right. */ -module.exports.onButtonEvent = function (id, evtName, component, hand) { +export function onButtonEvent (id, evtName, component, hand) { var mapping = hand ? component.mapping[hand] : component.mapping; var buttonName = mapping.buttons[id]; component.el.emit(buttonName + evtName); if (component.updateModel) { component.updateModel(buttonName, evtName); } -}; +} diff --git a/tests/__init.test.js b/tests/__init.test.js index 9943837803b..0d386ac07c8 100644 --- a/tests/__init.test.js +++ b/tests/__init.test.js @@ -5,60 +5,67 @@ */ window.debug = true; -navigator.xr = navigator.xr || {}; -navigator.xr.isSessionSupported = function (_sessionType) { return Promise.resolve(true); }; -navigator.xr.requestSession = function (_mode) { - const xrSession = new EventTarget(); - xrSession.supportedFrameRates = [90]; - xrSession.requestReferenceSpace = function () { return Promise.resolve(); }; - return Promise.resolve(xrSession); -}; - /* WebXR Stub */ -navigator.xr = navigator.xr || {}; +if (!navigator.xr) { + navigator.xr = {}; +} navigator.xr.isSessionSupported = function (_sessionType) { return Promise.resolve(true); }; navigator.xr.requestSession = function (_mode) { const xrSession = new EventTarget(); xrSession.supportedFrameRates = [90]; xrSession.requestReferenceSpace = function () { return Promise.resolve(); }; + xrSession.end = function () { return Promise.resolve(); }; return Promise.resolve(xrSession); }; -const AFRAME = require('index'); -var AScene = require('core/scene/a-scene').AScene; -// Make sure WebGL context is not created since CI runs headless. -// Stubs below failed once in a while due to asynchronous test setup / teardown. -AScene.prototype.setupRenderer = function () {}; +var AFRAME, AScene; +var loadPromise = Promise.allSettled([ + import('index.js'), + import('core/scene/a-scene.js') +]).then(function (results) { + AFRAME = results[0].value.default; + AScene = results[1].value.AScene; + + // Make sure WebGL context is not created since CI runs headless. + // Stubs below failed once in a while due to asynchronous test setup / teardown. + AScene.prototype.setupRenderer = function () {}; +}); -setup(function () { - window.AFRAME = AFRAME; - this.sinon = sinon.createSandbox(); - // Stubs to not create a WebGL context since CI runs headless. - this.sinon.stub(AScene.prototype, 'render'); - this.sinon.stub(AScene.prototype, 'setupRenderer'); - // Mock renderer. - AScene.prototype.renderer = { - xr: { - getDevice: function () { return {requestPresent: function () {}}; }, - isPresenting: function () { return true; }, - setDevice: function () {}, - setSession: function () { return Promise.resolve(); }, - setFoveation: function () {}, - setPoseTarget: function () {}, +setup(function (done) { + loadPromise.then(() => { + // Mock renderer. + AScene.prototype.renderer = { + xr: { + getDevice: function () { return {requestPresent: function () {}}; }, + isPresenting: function () { return true; }, + setDevice: function () {}, + setSession: function () { return Promise.resolve(); }, + setFoveation: function () {}, + setPoseTarget: function () {}, + dispose: function () {}, + setReferenceSpaceType: function () {}, + enabled: false + }, dispose: function () {}, - setReferenceSpaceType: function () {}, - enabled: false - }, - dispose: function () {}, - getContext: function () { return undefined; }, - render: function () {}, - setAnimationLoop: function () {}, - setOpaqueSort: function () {}, - setPixelRatio: function () {}, - setSize: function () {}, - setTransparentSort: function () {}, - shadowMap: {enabled: false} - }; + getContext: function () { return undefined; }, + render: function () {}, + setAnimationLoop: function () {}, + setOpaqueSort: function () {}, + setPixelRatio: function () {}, + setSize: function () {}, + setTransparentSort: function () {}, + shadowMap: {enabled: false} + }; + + this.sinon = sinon.createSandbox(); + // Stubs to not create a WebGL context since CI runs headless. + this.sinon.stub(AScene.prototype, 'render'); + this.sinon.stub(AScene.prototype, 'setupRenderer'); + + window.AFRAME = AFRAME; + + done(); + }); }); // Ensure that uncaught exceptions between tests result in the tests failing. diff --git a/tests/components/animation.test.js b/tests/components/animation.test.js index 3c85163c035..68635a02b3c 100644 --- a/tests/components/animation.test.js +++ b/tests/components/animation.test.js @@ -1,7 +1,6 @@ /* global assert, setup, suite, test, THREE */ -var entityFactory = require('../helpers').entityFactory; -var components = require('index').components; -var registerComponent = require('index').registerComponent; +import { entityFactory } from '../helpers.js'; +import { registerComponent, components } from 'core/component.js'; suite('animation', function () { var component; diff --git a/tests/components/camera.test.js b/tests/components/camera.test.js index 5e45f1e6c04..1fcf3719eea 100644 --- a/tests/components/camera.test.js +++ b/tests/components/camera.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var elFactory = require('../helpers').elFactory; +import { elFactory } from '../helpers.js'; suite('camera', function () { var el; diff --git a/tests/components/cursor.test.js b/tests/components/cursor.test.js index 5e31a2ae028..6668e452c9a 100644 --- a/tests/components/cursor.test.js +++ b/tests/components/cursor.test.js @@ -1,6 +1,5 @@ /* global assert, process, setup, suite, test, CustomEvent, MouseEvent, TouchEvent */ -var entityFactory = require('../helpers').entityFactory; -var once = require('../helpers').once; +import { entityFactory, once } from '../helpers.js'; const touchEventSupported = (typeof TouchEvent !== 'undefined'); suite('cursor', function () { diff --git a/tests/components/geometry.test.js b/tests/components/geometry.test.js index e432c098066..7fa140e371f 100644 --- a/tests/components/geometry.test.js +++ b/tests/components/geometry.test.js @@ -1,6 +1,7 @@ /* global assert, process, setup, suite, test */ -var helpers = require('../helpers'); -var degToRad = require('index').THREE.MathUtils.degToRad; +import * as helpers from '../helpers.js'; +import THREE from 'lib/three.js'; +var degToRad = THREE.MathUtils.degToRad; /** * Most geometry tests will disable BufferGeometries in order to assert on geometry types and diff --git a/tests/components/gltf-model.test.js b/tests/components/gltf-model.test.js index 38dbeb0ca32..fd9132dd4fd 100644 --- a/tests/components/gltf-model.test.js +++ b/tests/components/gltf-model.test.js @@ -1,6 +1,6 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; -var THREE = require('index').THREE; +import { entityFactory } from '../helpers.js'; +import THREE from 'lib/three.js'; var SRC = '/base/tests/assets/box/Box.gltf'; var SRC_NO_DEFAULT_SCENE = '/base/tests/assets/box/Box_no_default_scene.gltf'; diff --git a/tests/components/hand-controls.test.js b/tests/components/hand-controls.test.js index 0ba5af2c96f..7c7fd85ed55 100644 --- a/tests/components/hand-controls.test.js +++ b/tests/components/hand-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; var CONTROLLER_TYPE_VIVE = 'OpenVR Gamepad'; var CONTROLLER_TYPE_GENERIC = 'Generic Gamepad'; diff --git a/tests/components/hand-tracking-controls.test.js b/tests/components/hand-tracking-controls.test.js index 05cec5c1d96..ff677129c9e 100644 --- a/tests/components/hand-tracking-controls.test.js +++ b/tests/components/hand-tracking-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, sinon, suite, test, THREE */ -const entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('hand-tracking-controls', function () { var controller; diff --git a/tests/components/laser-controls.test.js b/tests/components/laser-controls.test.js index 4290bf465de..234a031cc30 100644 --- a/tests/components/laser-controls.test.js +++ b/tests/components/laser-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('laser-controls', function () { var el; diff --git a/tests/components/light.test.js b/tests/components/light.test.js index 8788378f58a..f81024b515b 100644 --- a/tests/components/light.test.js +++ b/tests/components/light.test.js @@ -1,6 +1,6 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; -var THREE = require('index').THREE; +import { entityFactory } from '../helpers.js'; +import THREE from 'lib/three.js'; suite('light', function () { setup(function (done) { diff --git a/tests/components/line.test.js b/tests/components/line.test.js index c431c1082af..e88d9b204b5 100644 --- a/tests/components/line.test.js +++ b/tests/components/line.test.js @@ -1,5 +1,5 @@ /* global THREE, assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('line', function () { var el; diff --git a/tests/components/link.test.js b/tests/components/link.test.js index 7bf428760f1..913913a5ae9 100644 --- a/tests/components/link.test.js +++ b/tests/components/link.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('link', function () { var el; diff --git a/tests/components/look-controls.test.js b/tests/components/look-controls.test.js index 17dc1392f29..15b5e060506 100644 --- a/tests/components/look-controls.test.js +++ b/tests/components/look-controls.test.js @@ -1,7 +1,7 @@ /* global Event, assert, process, setup, suite, test */ +import * as helpers from '../helpers.js'; var CANVAS_GRAB_CLASS = 'a-grab-cursor'; -var helpers = require('../helpers'); suite('look-controls', function () { setup(function (done) { diff --git a/tests/components/material.test.js b/tests/components/material.test.js index cf51060bdda..12b3fcc901f 100644 --- a/tests/components/material.test.js +++ b/tests/components/material.test.js @@ -1,7 +1,7 @@ /* global assert, process, setup, suite, test, sinon, AFRAME */ -var entityFactory = require('../helpers').entityFactory; -var shaders = require('core/shader').shaders; -var THREE = require('index').THREE; +import { entityFactory } from '../helpers.js'; +import { shaders } from 'core/shader.js'; +import THREE from 'lib/three.js'; var IMG_SRC = '/base/tests/assets/test.png'; diff --git a/tests/components/meta-touch-controls.test.js b/tests/components/meta-touch-controls.test.js index 7c9838dbb38..a2923fb6cb3 100644 --- a/tests/components/meta-touch-controls.test.js +++ b/tests/components/meta-touch-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, sinon, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('meta-touch-controls', function () { var el; diff --git a/tests/components/obj-model.test.js b/tests/components/obj-model.test.js index 7b1e4bd5196..eba58c58a18 100644 --- a/tests/components/obj-model.test.js +++ b/tests/components/obj-model.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; var MTL = '/base/tests/assets/crate/crate.mtl'; var OBJ = '/base/tests/assets/crate/crate.obj'; diff --git a/tests/components/oculus-go-controls.test.js b/tests/components/oculus-go-controls.test.js index 05eefe939e6..4324ef66e75 100644 --- a/tests/components/oculus-go-controls.test.js +++ b/tests/components/oculus-go-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, sinon, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('oculus-go-controls', function () { setup(function (done) { diff --git a/tests/components/position.test.js b/tests/components/position.test.js index 039470267c5..aa9b4bdbde0 100644 --- a/tests/components/position.test.js +++ b/tests/components/position.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('position', function () { setup(function (done) { diff --git a/tests/components/raycaster.test.js b/tests/components/raycaster.test.js index 8744187b28d..7277eadb8a6 100644 --- a/tests/components/raycaster.test.js +++ b/tests/components/raycaster.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test, THREE */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('raycaster', function () { var component; diff --git a/tests/components/rotation.test.js b/tests/components/rotation.test.js index 11b9465e81a..8f90fb71735 100644 --- a/tests/components/rotation.test.js +++ b/tests/components/rotation.test.js @@ -1,6 +1,7 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; -var degToRad = require('index').THREE.MathUtils.degToRad; +import { entityFactory } from '../helpers.js'; +import THREE from 'lib/three.js'; +var degToRad = THREE.MathUtils.degToRad; suite('rotation', function () { setup(function (done) { diff --git a/tests/components/scale.test.js b/tests/components/scale.test.js index 411a8b80cdd..4091a88b08d 100644 --- a/tests/components/scale.test.js +++ b/tests/components/scale.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('scale', function () { setup(function (done) { diff --git a/tests/components/scene/device-motion-permission-ui.test.js b/tests/components/scene/device-motion-permission-ui.test.js index 8ef80320a1f..a022d5ab257 100644 --- a/tests/components/scene/device-motion-permission-ui.test.js +++ b/tests/components/scene/device-motion-permission-ui.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test, teardown */ -var entityFactory = require('../../helpers').entityFactory; +import { entityFactory } from '../../helpers.js'; var PERMISSION_DIALOG_CLASSES = ['.a-modal', '.a-dialog', '.a-dialog-allow-button', '.a-dialog-deny-button']; diff --git a/tests/components/scene/embedded.test.js b/tests/components/scene/embedded.test.js index 418378f52d9..9ba4c2640e8 100644 --- a/tests/components/scene/embedded.test.js +++ b/tests/components/scene/embedded.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../../helpers').entityFactory; +import { entityFactory } from '../../helpers.js'; var SCENE_FULLSCREEN_CLASS = 'a-fullscreen'; diff --git a/tests/components/scene/fog.test.js b/tests/components/scene/fog.test.js index a8a01715032..5a8c1884c79 100644 --- a/tests/components/scene/fog.test.js +++ b/tests/components/scene/fog.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../../helpers').entityFactory; +import { entityFactory } from '../../helpers.js'; suite('fog', function () { setup(function (done) { diff --git a/tests/components/scene/pool.test.js b/tests/components/scene/pool.test.js index e590c1ff5e9..0f6e6240f1e 100644 --- a/tests/components/scene/pool.test.js +++ b/tests/components/scene/pool.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var helpers = require('../../helpers'); +import * as helpers from '../../helpers.js'; suite('pool', function () { setup(function (done) { diff --git a/tests/components/scene/stats.test.js b/tests/components/scene/stats.test.js index 5046ad2f9a6..faf8535dcfe 100644 --- a/tests/components/scene/stats.test.js +++ b/tests/components/scene/stats.test.js @@ -1,8 +1,6 @@ /* global assert, setup, suite, teardown, test */ -var utils = require('utils/'); - suite('stats', function () { - var originalGetUrlParameter = utils.getUrlParameter; + var originalLocationUrl = window.location.toString(); setup(function (done) { var el = this.sceneEl = document.createElement('a-scene'); @@ -11,14 +9,14 @@ suite('stats', function () { el.addEventListener('loaded', function () { done(); }); - utils.getUrlParameter = function () { return 'false'; }; + window.history.replaceState(null, '', originalLocationUrl + '?stats=false'); }); teardown(function () { var el = this.sceneEl; el.parentNode.removeChild(el); - utils.getUrlParameter = originalGetUrlParameter; + window.history.replaceState(null, '', originalLocationUrl); }); test('Stats are not created when query string "stats" is "false"', function () { diff --git a/tests/components/scene/xr-mode-ui.test.js b/tests/components/scene/xr-mode-ui.test.js index caf05b3232c..a370c0379a9 100644 --- a/tests/components/scene/xr-mode-ui.test.js +++ b/tests/components/scene/xr-mode-ui.test.js @@ -1,12 +1,13 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../../helpers').entityFactory; +import { entityFactory } from '../../helpers.js'; -var UI_CLASSES = ['.a-orientation-modal', '.a-enter-vr-button']; +var UI_CLASSES = ['.a-orientation-modal', '.a-enter-vr']; suite('xr-mode-ui', function () { setup(function (done) { this.entityEl = entityFactory(); var el = this.el = this.entityEl.parentNode; + el.hasWebXR = true; el.addEventListener('loaded', function () { done(); }); }); @@ -25,16 +26,21 @@ suite('xr-mode-ui', function () { }); }); - test('hides on enter VR', function () { + test('hides on enter VR', function (done) { var scene = this.el; // mock camera scene.camera = { el: {object3D: {}}, updateProjectionMatrix: function () {} }; + scene.enterVR(); - UI_CLASSES.forEach(function (uiClass) { - assert.ok(scene.querySelector(uiClass).className.indexOf('a-hidden')); + + process.nextTick(function () { + UI_CLASSES.forEach(function (uiClass) { + assert.include(scene.querySelector(uiClass).className, 'a-hidden'); + }); + done(); }); }); @@ -45,13 +51,16 @@ suite('xr-mode-ui', function () { el: {object3D: {}, getAttribute: function () { return {spectator: false}; }}, updateProjectionMatrix: function () {} }; - scene.enterVR(); - scene.exitVR(); - process.nextTick(function () { - assert.equal(scene.querySelector('.a-enter-vr-button').className.indexOf('a-hidden'), - -1); + scene.addEventListener('enter-vr', function () { + scene.exitVR(); + }); + + scene.addEventListener('exit-vr', function () { + assert.notInclude(scene.querySelector('.a-enter-vr').className, 'a-hidden'); done(); }); + + scene.enterVR(); }); }); diff --git a/tests/components/shadow.test.js b/tests/components/shadow.test.js index 71dba456f75..1944bf87354 100644 --- a/tests/components/shadow.test.js +++ b/tests/components/shadow.test.js @@ -1,6 +1,6 @@ /* global assert, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; -var THREE = require('index').THREE; +import { entityFactory } from '../helpers.js'; +import THREE from 'lib/three.js'; suite('shadow component', function () { var component; diff --git a/tests/components/sound.test.js b/tests/components/sound.test.js index 9a9b54b96c9..bb542941efd 100644 --- a/tests/components/sound.test.js +++ b/tests/components/sound.test.js @@ -1,6 +1,6 @@ /* global assert, process, sinon, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; -var THREE = require('index').THREE; +import { entityFactory } from '../helpers.js'; +import THREE from 'lib/three.js'; suite('sound', function () { setup(function (done) { diff --git a/tests/components/text.test.js b/tests/components/text.test.js index 3ee4c96ecaf..161e42d975f 100644 --- a/tests/components/text.test.js +++ b/tests/components/text.test.js @@ -1,6 +1,6 @@ /* global assert, setup, suite, test, THREE */ -var Component = require('components/text').Component; -var entityFactory = require('../helpers').entityFactory; +import { Component } from 'components/text.js'; +import { entityFactory } from '../helpers.js'; suite('text', function () { var component; diff --git a/tests/components/tracked-controls.test.js b/tests/components/tracked-controls.test.js index a0feb8d9b18..4fa1f33f3d8 100644 --- a/tests/components/tracked-controls.test.js +++ b/tests/components/tracked-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test, THREE */ -const entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('tracked-controls', function () { var component; diff --git a/tests/components/visible.test.js b/tests/components/visible.test.js index 96d356824bb..8ec6eaed41b 100644 --- a/tests/components/visible.test.js +++ b/tests/components/visible.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var elFactory = require('../helpers').elFactory; +import { elFactory } from '../helpers.js'; suite('visible', function () { var el; diff --git a/tests/components/vive-controls.test.js b/tests/components/vive-controls.test.js index 927e39c6e91..ad50d009141 100644 --- a/tests/components/vive-controls.test.js +++ b/tests/components/vive-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test, THREE */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('vive-controls', function () { var component; diff --git a/tests/components/vive-focus-controls.test.js b/tests/components/vive-focus-controls.test.js index 2c3a15642b0..57f89e180a3 100644 --- a/tests/components/vive-focus-controls.test.js +++ b/tests/components/vive-focus-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, sinon, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('vive-focus-controls', function () { setup(function (done) { diff --git a/tests/components/windows-motion-controls.test.js b/tests/components/windows-motion-controls.test.js index 38df0f84946..ab81eac72cb 100644 --- a/tests/components/windows-motion-controls.test.js +++ b/tests/components/windows-motion-controls.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test, THREE */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('windows-motion-controls', function () { var el; diff --git a/tests/core/a-assets.test.js b/tests/core/a-assets.test.js index 8a246956b58..b2ea78fc30a 100644 --- a/tests/core/a-assets.test.js +++ b/tests/core/a-assets.test.js @@ -1,8 +1,6 @@ /* global assert, setup, suite, test */ -var THREE = require('lib/three'); - -var inferResponseType = require('core/a-assets').inferResponseType; -var getFileNameFromURL = require('core/a-assets').getFileNameFromURL; +import THREE from 'lib/three.js'; +import { inferResponseType, getFileNameFromURL } from 'core/a-assets.js'; var IMG_SRC = '/base/tests/assets/test.png'; var XHR_SRC = '/base/tests/assets/dummy/dummy.txt'; diff --git a/tests/core/a-entity.test.js b/tests/core/a-entity.test.js index 982ca5a03dc..28665bf6a4f 100644 --- a/tests/core/a-entity.test.js +++ b/tests/core/a-entity.test.js @@ -1,11 +1,10 @@ /* global AFRAME, assert, process, sinon, setup, suite, teardown, test, HTMLElement */ -var AEntity = require('core/a-entity').AEntity; -var ANode = require('core/a-node').ANode; -var extend = require('utils').extend; -var registerComponent = require('core/component').registerComponent; -var components = require('core/component').components; -var THREE = require('index').THREE; -var helpers = require('../helpers'); +import { AEntity } from 'core/a-entity.js'; +import { ANode } from 'core/a-node.js'; +import { extend } from 'utils/index.js'; +import { registerComponent, components } from 'core/component.js'; +import THREE from 'lib/three.js'; +import * as helpers from '../helpers.js'; var elFactory = helpers.elFactory; var mixinFactory = helpers.mixinFactory; diff --git a/tests/core/a-mixin.test.js b/tests/core/a-mixin.test.js index ba985a08cbb..ed994394963 100644 --- a/tests/core/a-mixin.test.js +++ b/tests/core/a-mixin.test.js @@ -1,7 +1,6 @@ /* global assert, setup, suite, test */ -var helpers = require('../helpers'); -var components = require('index').components; -var registerComponent = require('index').registerComponent; +import * as helpers from '../helpers.js'; +import { components, registerComponent } from 'core/component.js'; suite('a-mixin', function () { var assetsEl; diff --git a/tests/core/component.test.js b/tests/core/component.test.js index 045a59c894d..831453d01dd 100644 --- a/tests/core/component.test.js +++ b/tests/core/component.test.js @@ -1,10 +1,7 @@ /* global AFRAME, assert, process, suite, teardown, test, setup, sinon, HTMLElement, HTMLHeadElement */ -var Component = require('core/component'); -var components = require('index').components; -var debug = require('utils').debug; - -var helpers = require('../helpers'); -var registerComponent = require('index').registerComponent; +import { components, registerComponent, registrationOrderWarnings } from 'core/component.js'; +import { debug } from 'utils/index.js'; +import * as helpers from '../helpers.js'; var CloneComponent = { init: function () { @@ -1582,53 +1579,53 @@ suite('registerComponent warnings', function () { teardown(function () { delete AFRAME.components.testorder; - delete Component.registrationOrderWarnings.testorder; + delete registrationOrderWarnings.testorder; if (script && script.parentNode) { script.parentNode.removeChild(script); } }); test('does not throw warning if component registered in head', function (done) { - assert.notOk(Component.registrationOrderWarnings.testorder, 'waht'); + assert.notOk(registrationOrderWarnings.testorder, 'waht'); document.head.appendChild(script); setTimeout(() => { - assert.notOk(Component.registrationOrderWarnings.testorder); + assert.notOk(registrationOrderWarnings.testorder); done(); }); }); test('does not throw warning if component registered before scene', function (done) { - assert.notOk(Component.registrationOrderWarnings.testorder, 'foo'); + assert.notOk(registrationOrderWarnings.testorder, 'foo'); document.body.insertBefore(script, sceneEl); setTimeout(() => { - assert.notOk(Component.registrationOrderWarnings.testorder); + assert.notOk(registrationOrderWarnings.testorder); done(); }); }); test('does not throw warning if component registered after scene loaded', function (done) { - assert.notOk(Component.registrationOrderWarnings.testorder, 'blah'); + assert.notOk(registrationOrderWarnings.testorder, 'blah'); sceneEl.addEventListener('loaded', () => { document.body.appendChild(script); setTimeout(() => { - assert.notOk(Component.registrationOrderWarnings.testorder); + assert.notOk(registrationOrderWarnings.testorder); done(); }); }); }); test('throws warning if component registered after scene', function (done) { - assert.notOk(Component.registrationOrderWarnings.testorder); + assert.notOk(registrationOrderWarnings.testorder); document.body.appendChild(script); setTimeout(() => { - assert.ok(Component.registrationOrderWarnings.testorder); + assert.ok(registrationOrderWarnings.testorder); done(); }); }); test('throws warning if component registered within scene', function (done) { - assert.notOk(Component.registrationOrderWarnings.testorder); + assert.notOk(registrationOrderWarnings.testorder); sceneEl.appendChild(script); setTimeout(() => { - assert.ok(Component.registrationOrderWarnings.testorder); + assert.ok(registrationOrderWarnings.testorder); done(); }); }); diff --git a/tests/core/controls.test.js b/tests/core/controls.test.js index 2d356c402de..beb4bf07254 100644 --- a/tests/core/controls.test.js +++ b/tests/core/controls.test.js @@ -1,5 +1,5 @@ /* global Event, assert, process, setup, suite, test */ -var helpers = require('../helpers'); +import * as helpers from '../helpers.js'; var PI = Math.PI; suite('position controls on camera with WASD controls (integration unit test)', function () { @@ -407,7 +407,7 @@ suite('rotation controls on camera with touch drag (integration unit test)', fun canvas = sceneEl.canvas; sceneEl.isMobile = true; - canvas.clientWidth = 1000; + assert.isAtLeast(canvas.clientWidth, 1000); // Dispatch touchstart event. touchStartEvent = new Event('touchstart'); @@ -437,7 +437,7 @@ suite('rotation controls on camera with touch drag (integration unit test)', fun canvas = sceneEl.canvas; sceneEl.isMobile = true; - canvas.clientWidth = 1000; + assert.isAtLeast(canvas.clientWidth, 1000); // Dispatch touchstart event. touchStartEvent = new Event('touchstart'); diff --git a/tests/core/geometry.test.js b/tests/core/geometry.test.js index 3c782588719..0261695229d 100644 --- a/tests/core/geometry.test.js +++ b/tests/core/geometry.test.js @@ -1,7 +1,5 @@ /* global assert, process, suite, test, teardown */ -var registerGeometry = require('core/geometry').registerGeometry; -var geometries = require('core/geometry').geometries; -var geometryNames = require('core/geometry').geometryNames; +import { registerGeometry, geometries, geometryNames } from 'core/geometry.js'; suite('core/geometry', function () { test('registers standard geometries', function () { diff --git a/tests/core/loadingScreen.test.js b/tests/core/loadingScreen.test.js index 443cddb5714..a56df84762c 100644 --- a/tests/core/loadingScreen.test.js +++ b/tests/core/loadingScreen.test.js @@ -1,5 +1,5 @@ /* global assert, process, suite, teardown, test */ -var helpers = require('../helpers'); +import * as helpers from '../helpers.js'; helpers.getSkipCISuite()('loadingScreen', function () { suite('setup', function () { diff --git a/tests/core/propertyTypes.test.js b/tests/core/propertyTypes.test.js index b7e026f356d..89c88970e3a 100644 --- a/tests/core/propertyTypes.test.js +++ b/tests/core/propertyTypes.test.js @@ -1,5 +1,5 @@ /* global assert, setup, suite, teardown, test */ -var PropertyTypes = require('core/propertyTypes'); +import * as PropertyTypes from 'core/propertyTypes.js'; var isValidDefaultCoordinate = PropertyTypes.isValidDefaultCoordinate; var isValidDefaultValue = PropertyTypes.isValidDefaultValue; diff --git a/tests/core/readyState.test.js b/tests/core/readyState.test.js index 4e03bb0d8d0..4b3f0da624e 100644 --- a/tests/core/readyState.test.js +++ b/tests/core/readyState.test.js @@ -1,12 +1,12 @@ /* global AFRAME, assert, suite, test, setup */ -var readyState = require('core/readyState'); +import * as readyState from 'core/readyState.js'; suite('readyState', function () { setup(function (done) { // Test setup initializes AFRAME when document is already ready. // This timeout ensures the readyState is reset before running the tests here. setTimeout(function () { - readyState.canInitializeElements = false; + readyState.reset(); done(); }); }); diff --git a/tests/core/scene/a-scene.test.js b/tests/core/scene/a-scene.test.js index 4355c096ca8..7e1f855de0c 100644 --- a/tests/core/scene/a-scene.test.js +++ b/tests/core/scene/a-scene.test.js @@ -1,16 +1,11 @@ /* global AFRAME, assert, CustomEvent, process, screen, sinon, setup, suite, teardown, test, THREE, EventTarget */ -var AScene = require('core/scene/a-scene').AScene; -var AEntity = require('core/a-entity').AEntity; -var ANode = require('core/a-node').ANode; -var components = require('core/component').components; -var registerComponent = require('core/component').registerComponent; -var scenes = require('core/scene/scenes'); -var determineComponentBehaviorOrder = require('core/scene/a-scene').determineComponentBehaviorOrder; -var setupCanvas = require('core/scene/a-scene').setupCanvas; -var systems = require('core/system').systems; - -var helpers = require('../../helpers'); -var utils = require('index').utils; +import { AScene, determineComponentBehaviorOrder, setupCanvas } from 'core/scene/a-scene.js'; +import { AEntity } from 'core/a-entity.js'; +import { ANode } from 'core/a-node.js'; +import { registerComponent } from 'core/component.js'; +import scenes from 'core/scene/scenes.js'; + +import * as helpers from '../../helpers.js'; var xrSession = new EventTarget(); xrSession.requestReferenceSpace = function () { diff --git a/tests/core/scene/meta-tags.test.js b/tests/core/scene/meta-tags.test.js index 3b0f5b5f799..54ed198eb28 100644 --- a/tests/core/scene/meta-tags.test.js +++ b/tests/core/scene/meta-tags.test.js @@ -1,8 +1,8 @@ /* global assert, setup, suite, test */ -var helpers = require('../../helpers'); -var initMetaTags = require('core/scene/metaTags').inject; -var metaTags = require('core/scene/metaTags'); -var constants = require('constants/'); +import * as helpers from '../../helpers.js'; +import { inject as initMetaTags } from 'core/scene/metaTags.js'; +import * as metaTags from 'core/scene/metaTags.js'; +import * as constants from 'constants/index.js'; suite('metaTags', function () { setup(function (done) { diff --git a/tests/core/schema.test.js b/tests/core/schema.test.js index 2e25bdfdfd4..c4bc351a172 100644 --- a/tests/core/schema.test.js +++ b/tests/core/schema.test.js @@ -1,13 +1,6 @@ /* global assert, suite, test */ -var Schema = require('core/schema'); -var propertyTypes = require('core/propertyTypes').propertyTypes; -var registerPropertyType = require('core/propertyTypes').registerPropertyType; - -var isSingleProperty = Schema.isSingleProperty; -var parseProperties = Schema.parseProperties; -var parseProperty = Schema.parseProperty; -var processSchema = Schema.process; -var stringifyProperty = Schema.stringifyProperty; +import { isSingleProperty, parseProperties, parseProperty, process as processSchema, stringifyProperty } from 'core/schema.js'; +import { propertyTypes, registerPropertyType } from 'core/propertyTypes.js'; suite('schema', function () { suite('isSingleProperty', function () { diff --git a/tests/core/shader.test.js b/tests/core/shader.test.js index 37464ff743c..4dd0e4d11b7 100644 --- a/tests/core/shader.test.js +++ b/tests/core/shader.test.js @@ -1,7 +1,7 @@ /* global AFRAME, assert, process, setup, suite, test, teardown */ -const entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; +import THREE from 'lib/three.js'; -const THREE = require('lib/three'); const VIDEO = 'base/tests/assets/test.mp4'; suite('shader', function () { diff --git a/tests/core/system.test.js b/tests/core/system.test.js index f13e5c52b85..ba1be09950c 100644 --- a/tests/core/system.test.js +++ b/tests/core/system.test.js @@ -1,7 +1,6 @@ /* global AFRAME, assert, process, suite, test, setup */ -var components = require('core/component').components; -var systems = require('core/system').systems; -var registerSystem = require('core/system').registerSystem; +import { components } from 'core/component.js'; +import { registerSystem, systems } from 'core/system.js'; var TestSystem = { init: function () {}, diff --git a/tests/extras/components/pivot.test.js b/tests/extras/components/pivot.test.js index 234e1ec4029..8931d042291 100644 --- a/tests/extras/components/pivot.test.js +++ b/tests/extras/components/pivot.test.js @@ -1,6 +1,6 @@ /* global assert, process, setup, suite, test */ -var helpers = require('../../helpers'); -var THREE = require('lib/three'); +import * as helpers from '../../helpers.js'; +import THREE from 'lib/three.js'; var positionVec3 = new THREE.Vector3(); diff --git a/tests/extras/primitives/primitives.test.js b/tests/extras/primitives/primitives.test.js index 5bc86d15395..651bf330d41 100644 --- a/tests/extras/primitives/primitives.test.js +++ b/tests/extras/primitives/primitives.test.js @@ -1,8 +1,7 @@ /* global AFRAME, assert, suite, test, THREE */ -var helpers = require('../../helpers'); -var registerPrimitive = require('extras/primitives/primitives').registerPrimitive; -var registerComponent = require('index').registerComponent; -var primitives = require('extras/primitives/primitives').primitives; +import * as helpers from '../../helpers.js'; +import { registerPrimitive, primitives } from 'extras/primitives/primitives.js'; +import { registerComponent } from 'core/component.js'; var primitiveId = 0; diff --git a/tests/extras/primitives/primitives/a-cursor.test.js b/tests/extras/primitives/primitives/a-cursor.test.js index e5956a871f4..27b0c3edd85 100644 --- a/tests/extras/primitives/primitives/a-cursor.test.js +++ b/tests/extras/primitives/primitives/a-cursor.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test, setup */ -var helpers = require('../../../helpers'); +import * as helpers from '../../../helpers.js'; suite('a-cursor', function () { setup(function (done) { diff --git a/tests/extras/primitives/primitives/a-obj-model.test.js b/tests/extras/primitives/primitives/a-obj-model.test.js index 29b826a6279..00e31e14397 100644 --- a/tests/extras/primitives/primitives/a-obj-model.test.js +++ b/tests/extras/primitives/primitives/a-obj-model.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test, setup */ -var helpers = require('../../../helpers'); +import * as helpers from '../../../helpers.js'; suite('a-obj-model', function () { setup(function (done) { diff --git a/tests/extras/primitives/primitives/a-sky.test.js b/tests/extras/primitives/primitives/a-sky.test.js index 304f9dff92c..07213ce8627 100644 --- a/tests/extras/primitives/primitives/a-sky.test.js +++ b/tests/extras/primitives/primitives/a-sky.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test, setup */ -var helpers = require('../../../helpers'); +import * as helpers from '../../../helpers.js'; suite('a-sky', function () { setup(function (done) { diff --git a/tests/extras/primitives/primitives/a-torus.test.js b/tests/extras/primitives/primitives/a-torus.test.js index 0b3d2e5f313..578d2d2b51b 100644 --- a/tests/extras/primitives/primitives/a-torus.test.js +++ b/tests/extras/primitives/primitives/a-torus.test.js @@ -1,6 +1,6 @@ /* global assert, suite, test, setup */ -var helpers = require('../../../helpers'); -var registerComponent = require('core/component').registerComponent; +import * as helpers from '../../../helpers.js'; +import { registerComponent } from 'core/component.js'; suite('a-torus', function () { setup(function (done) { diff --git a/tests/extras/primitives/primitives/meshPrimitives.test.js b/tests/extras/primitives/primitives/meshPrimitives.test.js index faca566b10e..2c934f2504d 100644 --- a/tests/extras/primitives/primitives/meshPrimitives.test.js +++ b/tests/extras/primitives/primitives/meshPrimitives.test.js @@ -1,8 +1,8 @@ /* global assert, suite, test, setup */ -var helpers = require('../../../helpers'); -var geometryNames = require('core/geometry').geometryNames; -var primitives = require('extras/primitives/primitives/meshPrimitives'); -var utils = require('utils/'); +import * as helpers from '../../../helpers.js'; +import { geometryNames } from 'core/geometry.js'; +import primitives from 'extras/primitives/primitives/meshPrimitives.js'; +import * as utils from 'utils/index.js'; suite('meshPrimitives', function () { setup(function createScene (done) { diff --git a/tests/helpers.js b/tests/helpers.js index a01c4791759..aafb2f8da45 100644 --- a/tests/helpers.js +++ b/tests/helpers.js @@ -4,14 +4,14 @@ * Add an event listener to be executed only once. Help when reusing entities across * tests and an event emitted in one may be picked up by another, causing test failures. */ -module.exports.once = function (el, eventName, handler) { +export function once (el, eventName, handler) { var done = false; el.addEventListener(eventName, function onceHandler (evt) { if (done) { return; } handler(evt); done = true; }); -}; +} /** * Helper method to create a scene, create an entity, add entity to scene, @@ -21,7 +21,7 @@ module.exports.once = function (el, eventName, handler) { * * @returns {object} An `` element. */ -function entityFactory (opts) { +export function entityFactory (opts) { var scene = document.createElement('a-scene'); var assets = document.createElement('a-assets'); var entity = document.createElement('a-entity'); @@ -40,7 +40,6 @@ function entityFactory (opts) { document.body.appendChild(scene); return entity; } -module.exports.entityFactory = entityFactory; /** * A more robust entity factory that resolves once stuff is loaded without having to wait @@ -48,7 +47,7 @@ module.exports.entityFactory = entityFactory; * * @returns {Promise} */ -module.exports.elFactory = function (opts) { +export function elFactory (opts) { let entity = entityFactory(opts); return new Promise(resolve => { if (entity.sceneEl) { @@ -61,7 +60,7 @@ module.exports.elFactory = function (opts) { entity.sceneEl.addEventListener('loaded', () => { resolve(entity); }); }); }); -}; +} /** * Creates and attaches a mixin element (and an `` element if necessary). @@ -71,7 +70,7 @@ module.exports.elFactory = function (opts) { * @param {Element} scene - Indicate which scene to apply mixin to if necessary. * @returns {object} An attached `` element. */ -module.exports.mixinFactory = function (id, obj, scene) { +export function mixinFactory (id, obj, scene) { var mixinEl = document.createElement('a-mixin'); mixinEl.setAttribute('id', id); Object.keys(obj).forEach(function (componentName) { @@ -82,26 +81,26 @@ module.exports.mixinFactory = function (id, obj, scene) { assetsEl.appendChild(mixinEl); return mixinEl; -}; +} /** * Test that is only run locally and is skipped on CI. */ -module.exports.getSkipCISuite = function () { +export function getSkipCISuite () { if (window.__env__.TEST_ENV === 'ci') { return suite.skip; } else { return suite; } -}; +} /** * Test that is only run locally and is skipped on CI. */ -module.exports.getSkipCITest = function () { +export function getSkipCITest () { if (window.__env__.TEST_ENV === 'ci') { return test.skip; } else { return test; } -}; +} diff --git a/tests/shaders/flat.test.js b/tests/shaders/flat.test.js index 71e4c02db9f..3b62594961e 100644 --- a/tests/shaders/flat.test.js +++ b/tests/shaders/flat.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('flat material', function () { setup(function (done) { diff --git a/tests/shaders/phong.test.js b/tests/shaders/phong.test.js index 70db0ae7a63..83229195d18 100644 --- a/tests/shaders/phong.test.js +++ b/tests/shaders/phong.test.js @@ -1,6 +1,6 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; -var THREE = require('index').THREE; +import { entityFactory } from '../helpers.js'; +import THREE from 'lib/three.js'; suite('phong material', function () { setup(function (done) { diff --git a/tests/shaders/standard.test.js b/tests/shaders/standard.test.js index bd72788729c..8114e712d5e 100644 --- a/tests/shaders/standard.test.js +++ b/tests/shaders/standard.test.js @@ -1,6 +1,6 @@ /* global assert, process, setup, suite, test */ -var entityFactory = require('../helpers').entityFactory; -var THREE = require('index').THREE; +import { entityFactory } from '../helpers.js'; +import THREE from 'lib/three.js'; var VIDEO = 'base/tests/assets/test.mp4'; diff --git a/tests/systems/camera.test.js b/tests/systems/camera.test.js index 5241d95a5c5..218dcc5597d 100644 --- a/tests/systems/camera.test.js +++ b/tests/systems/camera.test.js @@ -1,6 +1,6 @@ /* global assert, process, setup, suite, test, sinon */ -var constants = require('constants/'); -var entityFactory = require('../helpers').entityFactory; +import * as constants from 'constants/index.js'; +import { entityFactory } from '../helpers.js'; var IMG_SRC = '/base/tests/assets/test.png'; diff --git a/tests/systems/geometry.test.js b/tests/systems/geometry.test.js index 1d757a64b7d..a0610dae38e 100644 --- a/tests/systems/geometry.test.js +++ b/tests/systems/geometry.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, teardown, test */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('geometry system', function () { setup(function (done) { diff --git a/tests/systems/light.test.js b/tests/systems/light.test.js index b295095966a..158eb8de70c 100644 --- a/tests/systems/light.test.js +++ b/tests/systems/light.test.js @@ -1,6 +1,6 @@ /* global assert, process, setup, suite, test */ -var constants = require('constants/'); -var entityFactory = require('../helpers').entityFactory; +import * as constants from 'constants/index.js'; +import { entityFactory } from '../helpers.js'; var DEFAULT_LIGHT_ATTR = 'data-aframe-default-light'; suite('light system', function () { diff --git a/tests/systems/material.test.js b/tests/systems/material.test.js index 4247ae4c782..30f6f0e0be7 100644 --- a/tests/systems/material.test.js +++ b/tests/systems/material.test.js @@ -1,5 +1,5 @@ /* global assert, process, setup, suite, test, AFRAME, THREE */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; var IMAGE1 = 'base/tests/assets/test.png'; var IMAGE2 = 'base/tests/assets/test2.png'; diff --git a/tests/systems/renderer.test.js b/tests/systems/renderer.test.js index 4494333d0f5..be11f9d058f 100644 --- a/tests/systems/renderer.test.js +++ b/tests/systems/renderer.test.js @@ -1,13 +1,10 @@ /* global assert, suite, test, setup, teardown, THREE */ -var { -sortFrontToBack, - sortRenderOrderOnly, - sortBackToFront -} = require('systems/renderer'); +import { sortFrontToBack, sortRenderOrderOnly, sortBackToFront } from 'systems/renderer.js'; suite('renderer', function () { + var sceneEl; function createScene () { - var sceneEl = this.sceneEl = document.createElement('a-scene'); + sceneEl = document.createElement('a-scene'); sceneEl.time = 0; return sceneEl; } diff --git a/tests/systems/shadow.test.js b/tests/systems/shadow.test.js index 8f1bd216696..c9a80b15400 100644 --- a/tests/systems/shadow.test.js +++ b/tests/systems/shadow.test.js @@ -1,5 +1,5 @@ /* global process, setup, suite, test, assert, THREE */ -var entityFactory = require('../helpers').entityFactory; +import { entityFactory } from '../helpers.js'; suite('shadow system', function () { setup(function () { diff --git a/tests/utils/bind.test.js b/tests/utils/bind.test.js index c0256c9a553..187e52cea03 100644 --- a/tests/utils/bind.test.js +++ b/tests/utils/bind.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test */ -var bind = require('utils').bind; +import { bind } from 'utils/index.js'; suite('utils.bind', function () { test('utils.bind binds to object', function () { diff --git a/tests/utils/coordinates.test.js b/tests/utils/coordinates.test.js index 6b3dce290a7..b6a35e6c7c9 100644 --- a/tests/utils/coordinates.test.js +++ b/tests/utils/coordinates.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test */ -var coordinates = require('index').utils.coordinates; +import { coordinates } from 'utils/index.js'; suite('utils.coordinates', function () { suite('isCoordinates', function () { diff --git a/tests/utils/device.test.js b/tests/utils/device.test.js index 5c0b803cd22..309a060f263 100644 --- a/tests/utils/device.test.js +++ b/tests/utils/device.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test */ -var device = require('utils').device; +import { device } from 'utils/index.js'; suite('isTablet', function () { test('is true for Nexus 7 and Nexus 9', function () { diff --git a/tests/utils/entity.test.js b/tests/utils/entity.test.js index b2f64af4f19..be2e4d97fa9 100644 --- a/tests/utils/entity.test.js +++ b/tests/utils/entity.test.js @@ -1,6 +1,6 @@ /* global assert, setup, suite, test */ -var helpers = require('../helpers'); -var entity = require('utils/').entity; +import * as helpers from '../helpers.js'; +import { entity } from 'utils/index.js'; var getComponentProperty = entity.getComponentProperty; var setComponentProperty = entity.setComponentProperty; diff --git a/tests/utils/isIOSOlderThan10.test.js b/tests/utils/isIOSOlderThan10.test.js index 13752373666..932a0847e8d 100644 --- a/tests/utils/isIOSOlderThan10.test.js +++ b/tests/utils/isIOSOlderThan10.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test */ -var isIOSOlderThan10 = require('utils/isIOSOlderThan10'); +var isIOSOlderThan10 = require('utils/isIOSOlderThan10.js'); suite('isIOSOlderThan10', function () { test('is true for versions 7, 8, 9', function () { diff --git a/tests/utils/objects.test.js b/tests/utils/objects.test.js index 30b17c7dee3..47a08d3b6c5 100644 --- a/tests/utils/objects.test.js +++ b/tests/utils/objects.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test */ -var utils = require('index').utils; +import * as utils from 'utils/index.js'; var diff = utils.diff; var deepEqual = utils.deepEqual; diff --git a/tests/utils/src-loader.test.js b/tests/utils/src-loader.test.js index c94b20e5d1f..f7c7d554938 100644 --- a/tests/utils/src-loader.test.js +++ b/tests/utils/src-loader.test.js @@ -1,6 +1,6 @@ /* global assert, suite, setup, test, Image */ -var srcLoader = require('utils/src-loader'); -var entityFactory = require('../helpers').entityFactory; +import srcLoader from 'utils/src-loader.js'; +import { entityFactory } from '../helpers.js'; suite('utils.src-loader', function () { suite('validateEnvMapSrc', function () { diff --git a/tests/utils/throttle.test.js b/tests/utils/throttle.test.js index 06045625ab9..df77cac6fd6 100644 --- a/tests/utils/throttle.test.js +++ b/tests/utils/throttle.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test */ -var throttle = require('utils').throttle; +import { throttle } from 'utils/index.js'; suite('utils.throttle', function () { var ts; diff --git a/tests/utils/throttleTick.test.js b/tests/utils/throttleTick.test.js index b9c573e2b52..20633d660d3 100644 --- a/tests/utils/throttleTick.test.js +++ b/tests/utils/throttleTick.test.js @@ -1,5 +1,5 @@ /* global assert, suite, test */ -var throttleTick = require('utils').throttleTick; +import { throttleTick } from 'utils/index.js'; suite('utils.throttleTick', function () { var ts; diff --git a/tests/utils/tracked-controls.test.js b/tests/utils/tracked-controls.test.js index dee6825dfb3..a96583973be 100644 --- a/tests/utils/tracked-controls.test.js +++ b/tests/utils/tracked-controls.test.js @@ -1,5 +1,5 @@ /* global assert, sinon, suite, test */ -var trackedControlsUtils = require('utils/tracked-controls'); +import * as trackedControlsUtils from 'utils/tracked-controls.js'; suite('onButtonEvent', function () { test('reemit button event based on mappings', function () { diff --git a/vendor/DeviceOrientationControls.js b/vendor/DeviceOrientationControls.js index cf6b4df61df..49921958a8d 100644 --- a/vendor/DeviceOrientationControls.js +++ b/vendor/DeviceOrientationControls.js @@ -5,7 +5,7 @@ * W3C Device Orientation control (http://w3c.github.io/deviceorientation/spec-source-orientation.html) */ -THREE.DeviceOrientationControls = function ( object ) { +export var DeviceOrientationControls = function ( object ) { var scope = this; diff --git a/webpack.config.js b/webpack.config.js index cbecc7ec19c..ac47f2f5cce 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -4,7 +4,11 @@ var webpack = require('webpack'); module.exports = { entry: './src/index.js', output: { - library: 'AFRAME', + library: { + name: 'AFRAME', + type: 'var', + export: 'default' + }, libraryTarget: 'umd', path: path.resolve(__dirname, 'dist'), publicPath: '/dist/', diff --git a/webpack.prod.config.js b/webpack.prod.config.js index 897ff8c542a..982c21958e7 100644 --- a/webpack.prod.config.js +++ b/webpack.prod.config.js @@ -4,7 +4,11 @@ var TerserPlugin = require('terser-webpack-plugin'); module.exports = { extends: ['webpack.config.js'], output: { - library: 'AFRAME', + library: { + name: 'AFRAME', + type: 'var', + export: 'default' + }, libraryTarget: 'umd', path: path.resolve(__dirname, 'dist'), publicPath: '/dist/',