From fe4eb46a0a6b925698b1fac14dbdf0a41a561a0b Mon Sep 17 00:00:00 2001 From: Diego Marcos Segura Date: Tue, 10 Sep 2024 10:05:33 -0700 Subject: [PATCH] Update site content --- blog/8/index.html | 3 +-- blog/gamestate/index.html | 2 -- blog/motion-capture/index.html | 2 -- docs/0.3.0/components/geometry.html | 2 +- docs/0.3.0/components/material.html | 2 +- docs/0.3.0/core/animations.html | 2 +- docs/0.3.0/core/asset-management-system.html | 2 +- docs/0.3.0/core/component.html | 2 +- docs/0.3.0/core/entity.html | 2 +- docs/0.3.0/core/index.html | 2 +- docs/0.3.0/core/mixins.html | 2 +- docs/0.3.0/core/scene.html | 2 +- docs/0.3.0/core/systems.html | 2 +- docs/0.3.0/core/utils.html | 2 +- docs/0.3.0/guides/building-with-components.html | 2 +- docs/0.3.0/guides/building-with-magicavoxel.html | 2 +- docs/0.3.0/guides/index.html | 2 +- docs/0.3.0/introduction/device-and-platform-support.html | 2 +- docs/0.3.0/introduction/faq.html | 2 +- docs/0.3.0/introduction/getting-started.html | 2 +- docs/0.3.0/primitives/index.html | 2 +- docs/0.4.0/components/geometry.html | 2 +- docs/0.4.0/components/material.html | 2 +- docs/0.4.0/core/animations.html | 2 +- docs/0.4.0/core/asset-management-system.html | 2 +- docs/0.4.0/core/component.html | 2 +- docs/0.4.0/core/entity.html | 2 +- docs/0.4.0/core/index.html | 2 +- docs/0.4.0/core/mixins.html | 2 +- docs/0.4.0/core/scene.html | 2 +- docs/0.4.0/core/systems.html | 2 +- docs/0.4.0/core/utils.html | 2 +- docs/0.4.0/guides/building-with-components.html | 2 +- docs/0.4.0/guides/building-with-magicavoxel.html | 2 +- docs/0.4.0/guides/index.html | 2 +- docs/0.4.0/guides/using-javascript-and-dom-apis.html | 2 +- docs/0.4.0/introduction/device-and-platform-support.html | 2 +- docs/0.4.0/introduction/faq.html | 2 +- docs/0.4.0/introduction/getting-started.html | 2 +- docs/0.4.0/primitives/index.html | 2 +- docs/0.5.0/components/geometry.html | 2 +- docs/0.5.0/components/gltf-model.html | 2 +- docs/0.5.0/components/material.html | 2 +- docs/0.5.0/components/text.html | 2 +- docs/0.5.0/core/animations.html | 2 +- docs/0.5.0/core/asset-management-system.html | 2 +- docs/0.5.0/core/component.html | 2 +- docs/0.5.0/core/entity.html | 2 +- docs/0.5.0/core/mixins.html | 2 +- docs/0.5.0/core/scene.html | 2 +- docs/0.5.0/core/systems.html | 2 +- docs/0.5.0/core/utils.html | 2 +- docs/0.5.0/guides/building-a-360-image-gallery.html | 2 +- docs/0.5.0/guides/building-a-basic-scene.html | 2 +- docs/0.5.0/guides/building-a-minecraft-demo.html | 2 +- docs/0.5.0/guides/building-with-magicavoxel.html | 2 +- docs/0.5.0/introduction/entity-component-system.html | 2 +- docs/0.5.0/introduction/faq.html | 2 +- docs/0.5.0/introduction/hosting-and-publishing.html | 2 +- docs/0.5.0/introduction/html-and-primitives.html | 2 +- docs/0.5.0/introduction/installation.html | 2 +- docs/0.5.0/introduction/interactions-and-controllers.html | 2 +- docs/0.5.0/introduction/javascript-events-dom-apis.html | 2 +- docs/0.5.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/0.5.0/introduction/vr-headsets-and-webvr-browsers.html | 2 +- docs/0.6.0/components/geometry.html | 2 +- docs/0.6.0/components/gltf-model.html | 2 +- docs/0.6.0/components/light.html | 2 +- docs/0.6.0/components/material.html | 2 +- docs/0.6.0/components/text.html | 2 +- docs/0.6.0/core/animations.html | 2 +- docs/0.6.0/core/asset-management-system.html | 2 +- docs/0.6.0/core/component.html | 2 +- docs/0.6.0/core/entity.html | 2 +- docs/0.6.0/core/mixins.html | 2 +- docs/0.6.0/core/scene.html | 2 +- docs/0.6.0/core/systems.html | 2 +- docs/0.6.0/core/utils.html | 2 +- docs/0.6.0/guides/building-a-360-image-gallery.html | 2 +- docs/0.6.0/guides/building-a-basic-scene.html | 2 +- docs/0.6.0/guides/building-a-minecraft-demo.html | 2 +- docs/0.6.0/guides/building-with-magicavoxel.html | 2 +- docs/0.6.0/introduction/entity-component-system.html | 2 +- docs/0.6.0/introduction/faq.html | 2 +- docs/0.6.0/introduction/hosting-and-publishing.html | 2 +- docs/0.6.0/introduction/html-and-primitives.html | 2 +- docs/0.6.0/introduction/installation.html | 2 +- docs/0.6.0/introduction/interactions-and-controllers.html | 2 +- docs/0.6.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/0.6.0/introduction/vr-headsets-and-webvr-browsers.html | 2 +- docs/0.7.0/components/geometry.html | 2 +- docs/0.7.0/components/gltf-model.html | 2 +- docs/0.7.0/components/light.html | 2 +- docs/0.7.0/components/material.html | 2 +- docs/0.7.0/components/text.html | 2 +- docs/0.7.0/core/animations.html | 2 +- docs/0.7.0/core/asset-management-system.html | 2 +- docs/0.7.0/core/component.html | 2 +- docs/0.7.0/core/entity.html | 2 +- docs/0.7.0/core/mixins.html | 2 +- docs/0.7.0/core/scene.html | 2 +- docs/0.7.0/core/systems.html | 2 +- docs/0.7.0/core/utils.html | 2 +- docs/0.7.0/guides/building-a-360-image-gallery.html | 2 +- docs/0.7.0/guides/building-a-basic-scene.html | 2 +- docs/0.7.0/guides/building-a-minecraft-demo.html | 2 +- docs/0.7.0/guides/building-with-magicavoxel.html | 2 +- docs/0.7.0/introduction/entity-component-system.html | 2 +- docs/0.7.0/introduction/faq.html | 2 +- docs/0.7.0/introduction/hosting-and-publishing.html | 2 +- docs/0.7.0/introduction/html-and-primitives.html | 2 +- docs/0.7.0/introduction/installation.html | 2 +- docs/0.7.0/introduction/interactions-and-controllers.html | 2 +- docs/0.7.0/introduction/javascript-events-dom-apis.html | 2 +- docs/0.7.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/0.7.0/introduction/vr-headsets-and-webvr-browsers.html | 2 +- docs/0.8.0/components/geometry.html | 2 +- docs/0.8.0/components/gltf-model.html | 2 +- docs/0.8.0/components/light.html | 2 +- docs/0.8.0/components/material.html | 2 +- docs/0.8.0/components/text.html | 2 +- docs/0.8.0/core/animations.html | 2 +- docs/0.8.0/core/asset-management-system.html | 2 +- docs/0.8.0/core/component.html | 2 +- docs/0.8.0/core/entity.html | 2 +- docs/0.8.0/core/mixins.html | 2 +- docs/0.8.0/core/scene.html | 2 +- docs/0.8.0/core/systems.html | 2 +- docs/0.8.0/core/utils.html | 2 +- docs/0.8.0/guides/building-a-360-image-gallery.html | 2 +- docs/0.8.0/guides/building-a-basic-scene.html | 2 +- docs/0.8.0/guides/building-a-minecraft-demo.html | 2 +- docs/0.8.0/guides/building-with-magicavoxel.html | 2 +- docs/0.8.0/introduction/entity-component-system.html | 2 +- docs/0.8.0/introduction/faq.html | 2 +- docs/0.8.0/introduction/hosting-and-publishing.html | 2 +- docs/0.8.0/introduction/html-and-primitives.html | 2 +- docs/0.8.0/introduction/installation.html | 2 +- docs/0.8.0/introduction/interactions-and-controllers.html | 2 +- docs/0.8.0/introduction/javascript-events-dom-apis.html | 2 +- docs/0.8.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/0.8.0/introduction/vr-headsets-and-webvr-browsers.html | 2 +- docs/0.9.0/components/animation.html | 2 +- docs/0.9.0/components/geometry.html | 2 +- docs/0.9.0/components/gltf-model.html | 2 +- docs/0.9.0/components/light.html | 2 +- docs/0.9.0/components/material.html | 2 +- docs/0.9.0/components/text.html | 2 +- docs/0.9.0/core/asset-management-system.html | 2 +- docs/0.9.0/core/component.html | 2 +- docs/0.9.0/core/entity.html | 2 +- docs/0.9.0/core/mixins.html | 2 +- docs/0.9.0/core/scene.html | 2 +- docs/0.9.0/core/systems.html | 2 +- docs/0.9.0/core/utils.html | 2 +- docs/0.9.0/guides/building-a-360-image-gallery.html | 2 +- docs/0.9.0/guides/building-a-basic-scene.html | 2 +- docs/0.9.0/guides/building-a-minecraft-demo.html | 2 +- docs/0.9.0/introduction/entity-component-system.html | 2 +- docs/0.9.0/introduction/faq.html | 2 +- docs/0.9.0/introduction/hosting-and-publishing.html | 2 +- docs/0.9.0/introduction/html-and-primitives.html | 2 +- docs/0.9.0/introduction/installation.html | 2 +- docs/0.9.0/introduction/interactions-and-controllers.html | 2 +- docs/0.9.0/introduction/javascript-events-dom-apis.html | 2 +- docs/0.9.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/0.9.0/introduction/vr-headsets-and-webvr-browsers.html | 2 +- docs/1.0.0/components/animation.html | 2 +- docs/1.0.0/components/geometry.html | 2 +- docs/1.0.0/components/gltf-model.html | 2 +- docs/1.0.0/components/light.html | 2 +- docs/1.0.0/components/material.html | 2 +- docs/1.0.0/components/text.html | 2 +- docs/1.0.0/core/asset-management-system.html | 2 +- docs/1.0.0/core/component.html | 2 +- docs/1.0.0/core/entity.html | 2 +- docs/1.0.0/core/mixins.html | 2 +- docs/1.0.0/core/scene.html | 2 +- docs/1.0.0/core/systems.html | 2 +- docs/1.0.0/core/utils.html | 2 +- docs/1.0.0/guides/building-a-360-image-gallery.html | 2 +- docs/1.0.0/guides/building-a-basic-scene.html | 2 +- docs/1.0.0/guides/building-a-minecraft-demo.html | 2 +- docs/1.0.0/introduction/entity-component-system.html | 2 +- docs/1.0.0/introduction/faq.html | 2 +- docs/1.0.0/introduction/hosting-and-publishing.html | 2 +- docs/1.0.0/introduction/html-and-primitives.html | 2 +- docs/1.0.0/introduction/installation.html | 2 +- docs/1.0.0/introduction/interactions-and-controllers.html | 2 +- docs/1.0.0/introduction/javascript-events-dom-apis.html | 2 +- docs/1.0.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/1.0.0/introduction/vr-headsets-and-webvr-browsers.html | 2 +- docs/1.1.0/components/animation.html | 2 +- docs/1.1.0/components/geometry.html | 2 +- docs/1.1.0/components/gltf-model.html | 2 +- docs/1.1.0/components/light.html | 2 +- docs/1.1.0/components/material.html | 2 +- docs/1.1.0/components/text.html | 2 +- docs/1.1.0/core/asset-management-system.html | 2 +- docs/1.1.0/core/component.html | 2 +- docs/1.1.0/core/entity.html | 2 +- docs/1.1.0/core/mixins.html | 2 +- docs/1.1.0/core/scene.html | 2 +- docs/1.1.0/core/systems.html | 2 +- docs/1.1.0/core/utils.html | 2 +- docs/1.1.0/guides/building-a-360-image-gallery.html | 2 +- docs/1.1.0/guides/building-a-basic-scene.html | 2 +- docs/1.1.0/guides/building-a-minecraft-demo.html | 2 +- docs/1.1.0/introduction/entity-component-system.html | 2 +- docs/1.1.0/introduction/faq.html | 2 +- docs/1.1.0/introduction/hosting-and-publishing.html | 2 +- docs/1.1.0/introduction/html-and-primitives.html | 2 +- docs/1.1.0/introduction/installation.html | 2 +- docs/1.1.0/introduction/interactions-and-controllers.html | 2 +- docs/1.1.0/introduction/javascript-events-dom-apis.html | 2 +- docs/1.1.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/1.1.0/introduction/vr-headsets-and-webvr-browsers.html | 2 +- docs/1.2.0/components/animation.html | 2 +- docs/1.2.0/components/geometry.html | 2 +- docs/1.2.0/components/gltf-model.html | 2 +- docs/1.2.0/components/light.html | 2 +- docs/1.2.0/components/material.html | 2 +- docs/1.2.0/components/text.html | 2 +- docs/1.2.0/core/asset-management-system.html | 2 +- docs/1.2.0/core/component.html | 2 +- docs/1.2.0/core/entity.html | 2 +- docs/1.2.0/core/mixins.html | 2 +- docs/1.2.0/core/scene.html | 2 +- docs/1.2.0/core/systems.html | 2 +- docs/1.2.0/core/utils.html | 2 +- docs/1.2.0/guides/building-a-360-image-gallery.html | 2 +- docs/1.2.0/guides/building-a-basic-scene.html | 2 +- docs/1.2.0/guides/building-a-minecraft-demo.html | 2 +- docs/1.2.0/introduction/entity-component-system.html | 2 +- docs/1.2.0/introduction/faq.html | 2 +- docs/1.2.0/introduction/hosting-and-publishing.html | 2 +- docs/1.2.0/introduction/html-and-primitives.html | 2 +- docs/1.2.0/introduction/installation.html | 2 +- docs/1.2.0/introduction/interactions-and-controllers.html | 2 +- docs/1.2.0/introduction/javascript-events-dom-apis.html | 2 +- docs/1.2.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/1.2.0/introduction/vr-headsets-and-webvr-browsers.html | 2 +- docs/1.3.0/components/animation.html | 2 +- docs/1.3.0/components/geometry.html | 2 +- docs/1.3.0/components/gltf-model.html | 2 +- docs/1.3.0/components/light.html | 2 +- docs/1.3.0/components/material.html | 2 +- docs/1.3.0/components/text.html | 2 +- docs/1.3.0/core/asset-management-system.html | 2 +- docs/1.3.0/core/component.html | 2 +- docs/1.3.0/core/entity.html | 2 +- docs/1.3.0/core/mixins.html | 2 +- docs/1.3.0/core/scene.html | 2 +- docs/1.3.0/core/systems.html | 2 +- docs/1.3.0/core/utils.html | 2 +- docs/1.3.0/guides/building-a-360-image-gallery.html | 2 +- docs/1.3.0/guides/building-a-basic-scene.html | 2 +- docs/1.3.0/guides/building-a-minecraft-demo.html | 2 +- docs/1.3.0/introduction/entity-component-system.html | 2 +- docs/1.3.0/introduction/faq.html | 2 +- docs/1.3.0/introduction/hosting-and-publishing.html | 2 +- docs/1.3.0/introduction/html-and-primitives.html | 2 +- docs/1.3.0/introduction/installation.html | 2 +- docs/1.3.0/introduction/interactions-and-controllers.html | 2 +- docs/1.3.0/introduction/javascript-events-dom-apis.html | 2 +- docs/1.3.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/1.3.0/introduction/vr-headsets-and-webxr-browsers.html | 2 +- docs/1.4.0/components/animation.html | 2 +- docs/1.4.0/components/geometry.html | 2 +- docs/1.4.0/components/gltf-model.html | 2 +- docs/1.4.0/components/light.html | 2 +- docs/1.4.0/components/material.html | 2 +- docs/1.4.0/components/text.html | 2 +- docs/1.4.0/core/asset-management-system.html | 2 +- docs/1.4.0/core/component.html | 2 +- docs/1.4.0/core/entity.html | 2 +- docs/1.4.0/core/mixins.html | 2 +- docs/1.4.0/core/scene.html | 2 +- docs/1.4.0/core/systems.html | 2 +- docs/1.4.0/core/utils.html | 2 +- docs/1.4.0/guides/building-a-360-image-gallery.html | 2 +- docs/1.4.0/guides/building-a-basic-scene.html | 2 +- docs/1.4.0/guides/building-a-minecraft-demo.html | 2 +- docs/1.4.0/introduction/entity-component-system.html | 2 +- docs/1.4.0/introduction/faq.html | 2 +- docs/1.4.0/introduction/hosting-and-publishing.html | 2 +- docs/1.4.0/introduction/html-and-primitives.html | 2 +- docs/1.4.0/introduction/installation.html | 2 +- docs/1.4.0/introduction/interactions-and-controllers.html | 2 +- docs/1.4.0/introduction/javascript-events-dom-apis.html | 2 +- docs/1.4.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/1.4.0/introduction/vr-headsets-and-webxr-browsers.html | 2 +- docs/1.5.0/components/animation.html | 2 +- docs/1.5.0/components/geometry.html | 2 +- docs/1.5.0/components/gltf-model.html | 2 +- docs/1.5.0/components/light.html | 2 +- docs/1.5.0/components/material.html | 2 +- docs/1.5.0/components/text.html | 2 +- docs/1.5.0/core/asset-management-system.html | 2 +- docs/1.5.0/core/component.html | 2 +- docs/1.5.0/core/entity.html | 2 +- docs/1.5.0/core/mixins.html | 2 +- docs/1.5.0/core/scene.html | 2 +- docs/1.5.0/core/systems.html | 2 +- docs/1.5.0/core/utils.html | 2 +- docs/1.5.0/guides/building-a-360-image-gallery.html | 2 +- docs/1.5.0/guides/building-a-basic-scene.html | 2 +- docs/1.5.0/guides/building-a-minecraft-demo.html | 2 +- docs/1.5.0/introduction/entity-component-system.html | 2 +- docs/1.5.0/introduction/faq.html | 2 +- docs/1.5.0/introduction/hosting-and-publishing.html | 2 +- docs/1.5.0/introduction/html-and-primitives.html | 2 +- docs/1.5.0/introduction/installation.html | 2 +- docs/1.5.0/introduction/interactions-and-controllers.html | 2 +- docs/1.5.0/introduction/javascript-events-dom-apis.html | 2 +- docs/1.5.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/1.5.0/introduction/vr-headsets-and-webxr-browsers.html | 2 +- docs/1.6.0/components/animation.html | 2 +- docs/1.6.0/components/geometry.html | 2 +- docs/1.6.0/components/gltf-model.html | 2 +- docs/1.6.0/components/light.html | 2 +- docs/1.6.0/components/material.html | 2 +- docs/1.6.0/components/text.html | 2 +- docs/1.6.0/core/asset-management-system.html | 2 +- docs/1.6.0/core/component.html | 2 +- docs/1.6.0/core/entity.html | 2 +- docs/1.6.0/core/mixins.html | 2 +- docs/1.6.0/core/scene.html | 2 +- docs/1.6.0/core/systems.html | 2 +- docs/1.6.0/core/utils.html | 2 +- docs/1.6.0/guides/building-a-360-image-gallery.html | 2 +- docs/1.6.0/guides/building-a-basic-scene.html | 2 +- docs/1.6.0/guides/building-a-minecraft-demo.html | 2 +- docs/1.6.0/introduction/entity-component-system.html | 2 +- docs/1.6.0/introduction/faq.html | 2 +- docs/1.6.0/introduction/hosting-and-publishing.html | 2 +- docs/1.6.0/introduction/html-and-primitives.html | 2 +- docs/1.6.0/introduction/installation.html | 2 +- docs/1.6.0/introduction/interactions-and-controllers.html | 2 +- docs/1.6.0/introduction/javascript-events-dom-apis.html | 2 +- docs/1.6.0/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/1.6.0/introduction/vr-headsets-and-webxr-browsers.html | 2 +- docs/master/components/animation.html | 2 +- docs/master/components/geometry.html | 2 +- docs/master/components/gltf-model.html | 2 +- docs/master/components/light.html | 2 +- docs/master/components/material.html | 2 +- docs/master/components/text.html | 2 +- docs/master/core/asset-management-system.html | 2 +- docs/master/core/component.html | 2 +- docs/master/core/entity.html | 2 +- docs/master/core/mixins.html | 2 +- docs/master/core/scene.html | 2 +- docs/master/core/systems.html | 2 +- docs/master/core/utils.html | 2 +- docs/master/guides/building-a-360-image-gallery.html | 2 +- docs/master/guides/building-a-basic-scene.html | 2 +- docs/master/guides/building-a-minecraft-demo.html | 2 +- docs/master/introduction/entity-component-system.html | 2 +- docs/master/introduction/faq.html | 2 +- docs/master/introduction/hosting-and-publishing.html | 2 +- docs/master/introduction/html-and-primitives.html | 2 +- docs/master/introduction/installation.html | 2 +- docs/master/introduction/interactions-and-controllers.html | 2 +- docs/master/introduction/javascript-events-dom-apis.html | 2 +- docs/master/introduction/visual-inspector-and-dev-tools.html | 2 +- docs/master/introduction/vr-headsets-and-webxr-browsers.html | 2 +- 367 files changed, 365 insertions(+), 370 deletions(-) diff --git a/blog/8/index.html b/blog/8/index.html index c6eca2c0d..f1cd19783 100644 --- a/blog/8/index.html +++ b/blog/8/index.html @@ -2011,8 +2011,7 @@

Managing Application and Game State in A-Frame

Redux. Having built several non-trivial WebVR applications, we’ll go over how we started to bring these ideas of state management into A-Frame’s DOM-based entity-component -architecture.

- +architecture.

Read more … diff --git a/blog/gamestate/index.html b/blog/gamestate/index.html index 9e478022c..040e64ec0 100644 --- a/blog/gamestate/index.html +++ b/blog/gamestate/index.html @@ -1820,8 +1820,6 @@

Managing Application and Game State in A-F built several non-trivial WebVR applications, we’ll go over how we started to bring these ideas of state management into A-Frame’s DOM-based entity-component architecture.

- -

Initial Approach with Redux

Redux

diff --git a/blog/motion-capture/index.html b/blog/motion-capture/index.html index 0f50941ee..d3821bfa8 100644 --- a/blog/motion-capture/index.html +++ b/blog/motion-capture/index.html @@ -1845,8 +1845,6 @@

Rapid Motion-Capture-Powered VR Developmen actions, on any device from anywhere without a headset.

- -

Motion Capture Makes VR Developer Lives Easier

Rapid Development

Below are several real-life use cases of motion capture vastly improving VR development ergonomics:

diff --git a/docs/0.3.0/components/geometry.html b/docs/0.3.0/components/geometry.html index 8b5737d7f..2bba8cbdd 100644 --- a/docs/0.3.0/components/geometry.html +++ b/docs/0.3.0/components/geometry.html @@ -944,7 +944,7 @@

additional properties are used to further define the geometry. A material component is usually defined to provide a appearance alongside the shape to create a complete mesh.

- +

Base Properties

Every geometry type will have these properties:

diff --git a/docs/0.3.0/components/material.html b/docs/0.3.0/components/material.html index 5dd1be374..435e1263a 100644 --- a/docs/0.3.0/components/material.html +++ b/docs/0.3.0/components/material.html @@ -943,7 +943,7 @@

component which provides shape.

Custom materials and shaders can be registered to extend the material component in order to provide a wide range of visual effects.

- +

Example

Defining a red material using the default standard material:

<a-entity geometry="primitive: box" material="color: red"></a-entity>
diff --git a/docs/0.3.0/core/animations.html b/docs/0.3.0/core/animations.html index 7920e4f8c..f98344163 100644 --- a/docs/0.3.0/core/animations.html +++ b/docs/0.3.0/core/animations.html @@ -953,7 +953,7 @@

the animation, and loops indefinitely.

<a-entity>
  <a-entity position="5 0 0"></a-entity>
  <a-animation attribute="rotation"
               dur="10000"
               fill="forwards"
               to="0 360 0"
               repeat="indefinite"></a-animation>
</a-entity>
- +

Attributes

Here is an overview of animation attributes. We’ll go into more detail below.

diff --git a/docs/0.3.0/core/asset-management-system.html b/docs/0.3.0/core/asset-management-system.html index 8e7e88d88..20afae337 100644 --- a/docs/0.3.0/core/asset-management-system.html +++ b/docs/0.3.0/core/asset-management-system.html @@ -954,7 +954,7 @@

The scene and all entities will block (i.e., the scene won’t render) until all of these types of assets are fetched (or error out) before playing.

- +

Example

We can define all of our assets in <a-assets> and point to those assets from our entities using selectors:

diff --git a/docs/0.3.0/core/component.html b/docs/0.3.0/core/component.html index 78b05fedb..93b7c80ea 100644 --- a/docs/0.3.0/core/component.html +++ b/docs/0.3.0/core/component.html @@ -952,7 +952,7 @@

Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

- +

What a Component Looks Like

A component holds a bucket of data in the form of one or more component properties. This data is used to modify the entity. Consider an engine diff --git a/docs/0.3.0/core/entity.html b/docs/0.3.0/core/entity.html index 717f60781..d7f2badcc 100644 --- a/docs/0.3.0/core/entity.html +++ b/docs/0.3.0/core/entity.html @@ -946,7 +946,7 @@

and functionality.

In A-Frame, entities are inherently attached with the position, rotation, and scale components.

- +

Example

Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

diff --git a/docs/0.3.0/core/index.html b/docs/0.3.0/core/index.html index d09ef3d84..a4818eb5c 100644 --- a/docs/0.3.0/core/index.html +++ b/docs/0.3.0/core/index.html @@ -953,7 +953,7 @@

ECS grants developers the key to permissionless innovation. Developers can write, share, and plug in components that extend new features or iterate upon existing features.

- +

Concept

As an abstract example, imagine a car is an entity:

<a-entity material="color: red" geometry="primitive: box"></a-entity>
<a-entity material="color: blue" geometry="primitive: box"></a-entity>
- +

Merging Component Properties

Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

<a-scene>
  <a-assets>
    <a-mixin id="box" geometry="primitive: box"></a-mixin>
    <a-mixin id="tall" geometry="height: 10"></a-mixin>
    <a-mixin id="wide" geometry="width: 10"></a-mixin>
  </a-assets>

  <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
</a-scene>
diff --git a/docs/0.3.0/core/scene.html b/docs/0.3.0/core/scene.html index 4b58c01e7..e13ea6afa 100644 --- a/docs/0.3.0/core/scene.html +++ b/docs/0.3.0/core/scene.html @@ -951,7 +951,7 @@

  • Set up webvr-polyfill, VREffect
  • Add UI to Enter VR that calls WebVR API
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/0.3.0/core/systems.html b/docs/0.3.0/core/systems.html index bfb67caf9..bfa9e08fe 100644 --- a/docs/0.3.0/core/systems.html +++ b/docs/0.3.0/core/systems.html @@ -945,7 +945,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/0.3.0/core/utils.html b/docs/0.3.0/core/utils.html index f661630a3..8afdebdd3 100644 --- a/docs/0.3.0/core/utils.html +++ b/docs/0.3.0/core/utils.html @@ -939,7 +939,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinate(value)

    Tests whether a string is a vec3.

    diff --git a/docs/0.3.0/guides/building-with-components.html b/docs/0.3.0/guides/building-with-components.html index 0799b5474..12e7f629c 100644 --- a/docs/0.3.0/guides/building-with-components.html +++ b/docs/0.3.0/guides/building-with-components.html @@ -953,7 +953,7 @@

    The scene we will build is a 360° image gallery. There will be three panels which the user can click on. Once clicked, the background will fade and swap the 360° images.

    - +

    Skeleton

    This is the starting point for our scene:

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="img/city.jpg">
        <img id="city-thumb" src="img/thumb-city.png">
        <img id="cubes" src="img/cubes.jpg">
        <img id="cubes-thumb" src="img/thumb-cubes.png">
        <img id="sechelt" src="img/sechelt.jpg">
        <img id="sechelt-thumb" src="img/thumb-sechelt.png">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link. -->
      <a-plane class="link" height="1" width="1"></a-plane>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor id="cursor">
          <a-animation begin="click" easing="ease-in" attribute="scale"
                       fill="backwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation>
          <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale"
                       from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation>
        </a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/0.3.0/guides/building-with-magicavoxel.html b/docs/0.3.0/guides/building-with-magicavoxel.html index 9a7ff5573..135033851 100644 --- a/docs/0.3.0/guides/building-with-magicavoxel.html +++ b/docs/0.3.0/guides/building-with-magicavoxel.html @@ -942,7 +942,7 @@

    3D scenes and models using voxels (i.e., blocks). MagicaVoxel makes modeling super easy, similar to building in Minecraft.

    magicavoxel

    - +

    Installation

    MagicaVoxel works on Windows and OS X. On the MagicaVoxel homepage, click the Download button and install the application:

    diff --git a/docs/0.3.0/guides/index.html b/docs/0.3.0/guides/index.html index 5500932b7..92e3f9fe4 100644 --- a/docs/0.3.0/guides/index.html +++ b/docs/0.3.0/guides/index.html @@ -940,7 +940,7 @@

    Let’s build a scene using A-Frame’s basic primitive HTML building blocks!

    - +

    Adding a Box

    This sample Hello World scene starts with a box:

    <a-scene>
      <a-box color="#6173F4" width="4" height="10" depth="2"></a-box>
    </a-scene>
    diff --git a/docs/0.3.0/introduction/device-and-platform-support.html b/docs/0.3.0/introduction/device-and-platform-support.html index c76ae0923..16da2da13 100644 --- a/docs/0.3.0/introduction/device-and-platform-support.html +++ b/docs/0.3.0/introduction/device-and-platform-support.html @@ -942,7 +942,7 @@

    devices and APIs. A-Frame supports both flat (3D on a normal screen) and WebVR experiences, though its focus is heavily VR. We will break up support into two categories: flat and VR.

    - +

    Support for Flat Experiences

    Support for flat experiences primarily depends on a browser’s WebGL support. We can see which browsers support WebGL at Can I use WebGL?.

    diff --git a/docs/0.3.0/introduction/faq.html b/docs/0.3.0/introduction/faq.html index 155a3d084..e2dee9b2d 100644 --- a/docs/0.3.0/introduction/faq.html +++ b/docs/0.3.0/introduction/faq.html @@ -938,7 +938,7 @@

    - +

    What is A-Frame?

    A-Frame is an open-source web framework for building virtual reality experiences. We can build VR web pages that we can walk inside with just HTML. diff --git a/docs/0.3.0/introduction/getting-started.html b/docs/0.3.0/introduction/getting-started.html index e6d6c59bf..8b3f214df 100644 --- a/docs/0.3.0/introduction/getting-started.html +++ b/docs/0.3.0/introduction/getting-started.html @@ -942,7 +942,7 @@

    Welcome! Make sure to read the introduction. If you’re ready to go, we have several ways of getting started.

    - +

    Play with CodePen

    CodePen is a playground for front-end web development. We can edit HTML and JavaScript directly in the browser with its text editor, see changes diff --git a/docs/0.3.0/primitives/index.html b/docs/0.3.0/primitives/index.html index 124395fb8..06021b9ea 100644 --- a/docs/0.3.0/primitives/index.html +++ b/docs/0.3.0/primitives/index.html @@ -953,7 +953,7 @@

    They are sort of like Prefabs in Unity. Some literature on the entity-component-system pattern refer to these as assemblages.

    - +

    Example

    Here is an assortment of various primitives in use:

    <a-scene>
      <!-- Using the asset management system for caching. -->
      <a-assets>
        <a-asset-item id="fox-obj" src="fox.obj"></a-asset-item>
        <a-asset-item id="fox-mtl" src="fox.mtl"></a-asset-item>
        <img id="texture" src="texture.png">
        <video id="video" src="video.mp4"></video>
      </a-assets>

      <a-camera fov="80"><a-cursor></a-cursor></a-camera>
      <a-box src="#texture" depth="2" height="5" width="1"></a-box>
      <a-image src="fireball.jpg"></a-image>
      <a-video src="#video"></a-video>
      <a-sky color="#432FA0"></a-sky>
    </a-scene>
    diff --git a/docs/0.4.0/components/geometry.html b/docs/0.4.0/components/geometry.html index 447a49afc..09d7c6aeb 100644 --- a/docs/0.4.0/components/geometry.html +++ b/docs/0.4.0/components/geometry.html @@ -991,7 +991,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/0.4.0/components/material.html b/docs/0.4.0/components/material.html index bf85b2b05..3acc3026a 100644 --- a/docs/0.4.0/components/material.html +++ b/docs/0.4.0/components/material.html @@ -992,7 +992,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/0.4.0/core/animations.html b/docs/0.4.0/core/animations.html index e3a257fe0..5ae0a3a9e 100644 --- a/docs/0.4.0/core/animations.html +++ b/docs/0.4.0/core/animations.html @@ -1001,7 +1001,7 @@

    the animation, and loops indefinitely.

    <a-entity>
      <a-entity position="5 0 0"></a-entity>
      <a-animation attribute="rotation"
                   dur="10000"
                   fill="forwards"
                   to="0 360 0"
                   repeat="indefinite"></a-animation>
    </a-entity>
    - +

    Attributes

    Here is an overview of animation attributes. We’ll go into more detail below.

    diff --git a/docs/0.4.0/core/asset-management-system.html b/docs/0.4.0/core/asset-management-system.html index 1dd8f375a..928641038 100644 --- a/docs/0.4.0/core/asset-management-system.html +++ b/docs/0.4.0/core/asset-management-system.html @@ -1003,7 +1003,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/0.4.0/core/component.html b/docs/0.4.0/core/component.html index 02b078168..01cbb89ff 100644 --- a/docs/0.4.0/core/component.html +++ b/docs/0.4.0/core/component.html @@ -1001,7 +1001,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/0.4.0/core/entity.html b/docs/0.4.0/core/entity.html index daf85210d..1da9cf680 100644 --- a/docs/0.4.0/core/entity.html +++ b/docs/0.4.0/core/entity.html @@ -995,7 +995,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/0.4.0/core/index.html b/docs/0.4.0/core/index.html index 08f24df98..de6632102 100644 --- a/docs/0.4.0/core/index.html +++ b/docs/0.4.0/core/index.html @@ -1004,7 +1004,7 @@

    ECS grants developers the key to permissionless innovation. Developers can write, share, and plug in components that extend new features or iterate upon existing features.

    - +

    Concept

    As an abstract example, imagine a car is an entity:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/0.4.0/core/scene.html b/docs/0.4.0/core/scene.html index bcc16dfb1..757dceb47 100644 --- a/docs/0.4.0/core/scene.html +++ b/docs/0.4.0/core/scene.html @@ -1000,7 +1000,7 @@

  • Set up webvr-polyfill, VREffect
  • Add UI to Enter VR that calls WebVR API
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/0.4.0/core/systems.html b/docs/0.4.0/core/systems.html index 64cb1fe3b..48daf7657 100644 --- a/docs/0.4.0/core/systems.html +++ b/docs/0.4.0/core/systems.html @@ -994,7 +994,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/0.4.0/core/utils.html b/docs/0.4.0/core/utils.html index e92f91e91..301ebd152 100644 --- a/docs/0.4.0/core/utils.html +++ b/docs/0.4.0/core/utils.html @@ -988,7 +988,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinate (value)

    Tests whether a string is a vec3.

    diff --git a/docs/0.4.0/guides/building-with-components.html b/docs/0.4.0/guides/building-with-components.html index 1ab46ca20..40b582081 100644 --- a/docs/0.4.0/guides/building-with-components.html +++ b/docs/0.4.0/guides/building-with-components.html @@ -1002,7 +1002,7 @@

    The scene we will build is a 360° image gallery. There will be three panels which the user can click on. Once clicked, the background will fade and swap the 360° images.

    - +

    Skeleton

    This is the starting point for our scene:

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="img/city.jpg">
        <img id="city-thumb" src="img/thumb-city.png">
        <img id="cubes" src="img/cubes.jpg">
        <img id="cubes-thumb" src="img/thumb-cubes.png">
        <img id="sechelt" src="img/sechelt.jpg">
        <img id="sechelt-thumb" src="img/thumb-sechelt.png">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor id="cursor">
          <a-animation begin="click" easing="ease-in" attribute="scale"
                       fill="backwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation>
          <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale"
                       from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation>
        </a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/0.4.0/guides/building-with-magicavoxel.html b/docs/0.4.0/guides/building-with-magicavoxel.html index fbd6c04c1..de8eef5e8 100644 --- a/docs/0.4.0/guides/building-with-magicavoxel.html +++ b/docs/0.4.0/guides/building-with-magicavoxel.html @@ -991,7 +991,7 @@

    3D scenes and models using voxels (i.e., blocks). MagicaVoxel makes modeling super easy, similar to building in Minecraft.

    magicavoxel

    - +

    Installation

    MagicaVoxel works on Windows and OS X. On the MagicaVoxel homepage, click the Download button and install the application:

    diff --git a/docs/0.4.0/guides/index.html b/docs/0.4.0/guides/index.html index f162b5a3f..842d6ed28 100644 --- a/docs/0.4.0/guides/index.html +++ b/docs/0.4.0/guides/index.html @@ -1033,7 +1033,7 @@

    - +

    Starting with HTML

    We start out with the minimum required HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/0.4.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      <body>
    </html>
    diff --git a/docs/0.4.0/guides/using-javascript-and-dom-apis.html b/docs/0.4.0/guides/using-javascript-and-dom-apis.html index 7d0a47cc9..7aef284bd 100644 --- a/docs/0.4.0/guides/using-javascript-and-dom-apis.html +++ b/docs/0.4.0/guides/using-javascript-and-dom-apis.html @@ -996,7 +996,7 @@

    prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Before we go over the different ways to use JavaScript and DOM APIs, we recommend encapsulating your JavaScript code within A-Frame components. diff --git a/docs/0.4.0/introduction/device-and-platform-support.html b/docs/0.4.0/introduction/device-and-platform-support.html index 3e8377283..88334ced9 100644 --- a/docs/0.4.0/introduction/device-and-platform-support.html +++ b/docs/0.4.0/introduction/device-and-platform-support.html @@ -991,7 +991,7 @@

    devices and APIs. A-Frame supports both flat (3D on a normal screen) and WebVR experiences, though its focus is heavily VR. We will break up support into two categories: flat and VR.

    - +

    Support for Flat Experiences

    Support for flat experiences primarily depends on a browser’s WebGL support. We can see which browsers support WebGL at Can I use WebGL?.

    diff --git a/docs/0.4.0/introduction/faq.html b/docs/0.4.0/introduction/faq.html index 3d4afb979..f34cca019 100644 --- a/docs/0.4.0/introduction/faq.html +++ b/docs/0.4.0/introduction/faq.html @@ -987,7 +987,7 @@

    - +

    What is A-Frame?

    A-Frame is an open-source web framework for building virtual reality experiences. We can build VR web pages that we can walk inside with just HTML. diff --git a/docs/0.4.0/introduction/getting-started.html b/docs/0.4.0/introduction/getting-started.html index c5962db5a..f4c57bb9c 100644 --- a/docs/0.4.0/introduction/getting-started.html +++ b/docs/0.4.0/introduction/getting-started.html @@ -991,7 +991,7 @@

    Welcome! Make sure to read the introduction. If you’re ready to go, there are multiple ways of getting started.

    - +

    Play with CodePen

    CodePen is a playground for front-end web development. We can edit HTML and JavaScript directly in the browser with its text editor, see changes diff --git a/docs/0.4.0/primitives/index.html b/docs/0.4.0/primitives/index.html index aed8ec637..53645afa4 100644 --- a/docs/0.4.0/primitives/index.html +++ b/docs/0.4.0/primitives/index.html @@ -1002,7 +1002,7 @@

    They are sort of like Prefabs in Unity. Some literature on the entity-component-system pattern refer to these as assemblages.

    - +

    Example

    Below is an assortment of primitives in use:

    <a-scene>
      <!-- Using the asset management system for caching. -->
      <a-assets>
        <a-asset-item id="fox-obj" src="fox.obj"></a-asset-item>
        <a-asset-item id="fox-mtl" src="fox.mtl"></a-asset-item>
        <img id="texture" src="texture.png">
        <video id="video" src="video.mp4"></video>
      </a-assets>

      <a-camera fov="80"><a-cursor></a-cursor></a-camera>
      <a-box src="#texture" depth="2" height="5" width="1"></a-box>
      <a-image src="fireball.jpg"></a-image>
      <a-video src="#video"></a-video>
      <a-sky color="#432FA0"></a-sky>
    </a-scene>
    diff --git a/docs/0.5.0/components/geometry.html b/docs/0.5.0/components/geometry.html index 5c33a86c9..62a6a8d3e 100644 --- a/docs/0.5.0/components/geometry.html +++ b/docs/0.5.0/components/geometry.html @@ -1047,7 +1047,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/0.5.0/components/gltf-model.html b/docs/0.5.0/components/gltf-model.html index 87b69a05a..98b03b364 100644 --- a/docs/0.5.0/components/gltf-model.html +++ b/docs/0.5.0/components/gltf-model.html @@ -1051,7 +1051,7 @@

    Note that glTF is a fairly new specification and adoption is still growing. Work on the three.js glTF loader and converters are still active.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/0.5.0/components/material.html b/docs/0.5.0/components/material.html index d38601ac2..d8ad7f5c5 100644 --- a/docs/0.5.0/components/material.html +++ b/docs/0.5.0/components/material.html @@ -1048,7 +1048,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/0.5.0/components/text.html b/docs/0.5.0/components/text.html index 7bda74d3c..2dd18e691 100644 --- a/docs/0.5.0/components/text.html +++ b/docs/0.5.0/components/text.html @@ -1045,7 +1045,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handles diff --git a/docs/0.5.0/core/animations.html b/docs/0.5.0/core/animations.html index 5b1c7c763..483f8bded 100644 --- a/docs/0.5.0/core/animations.html +++ b/docs/0.5.0/core/animations.html @@ -1057,7 +1057,7 @@

    the animation, and loops indefinitely.

    <a-entity>
      <a-entity position="5 0 0"></a-entity>
      <a-animation attribute="rotation"
                   dur="10000"
                   fill="forwards"
                   to="0 360 0"
                   repeat="indefinite"></a-animation>
    </a-entity>
    - +

    Attributes

    Here is an overview of animation attributes. We’ll go into more detail below.

    diff --git a/docs/0.5.0/core/asset-management-system.html b/docs/0.5.0/core/asset-management-system.html index c2acba5ff..d868c5d3a 100644 --- a/docs/0.5.0/core/asset-management-system.html +++ b/docs/0.5.0/core/asset-management-system.html @@ -1059,7 +1059,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/0.5.0/core/component.html b/docs/0.5.0/core/component.html index 2c66cd031..13682fb83 100644 --- a/docs/0.5.0/core/component.html +++ b/docs/0.5.0/core/component.html @@ -1057,7 +1057,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/0.5.0/core/entity.html b/docs/0.5.0/core/entity.html index 96c4034e4..1051e4995 100644 --- a/docs/0.5.0/core/entity.html +++ b/docs/0.5.0/core/entity.html @@ -1049,7 +1049,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/0.5.0/core/mixins.html b/docs/0.5.0/core/mixins.html index ace302499..a2a91822c 100644 --- a/docs/0.5.0/core/mixins.html +++ b/docs/0.5.0/core/mixins.html @@ -1055,7 +1055,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/0.5.0/core/scene.html b/docs/0.5.0/core/scene.html index 992aa5008..09674247a 100644 --- a/docs/0.5.0/core/scene.html +++ b/docs/0.5.0/core/scene.html @@ -1056,7 +1056,7 @@

  • Set up webvr-polyfill, VREffect
  • Add UI to Enter VR that calls WebVR API
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/0.5.0/core/systems.html b/docs/0.5.0/core/systems.html index b41a8d46f..8ca75bf2f 100644 --- a/docs/0.5.0/core/systems.html +++ b/docs/0.5.0/core/systems.html @@ -1050,7 +1050,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/0.5.0/core/utils.html b/docs/0.5.0/core/utils.html index 7018c6969..9a42ddc7a 100644 --- a/docs/0.5.0/core/utils.html +++ b/docs/0.5.0/core/utils.html @@ -1044,7 +1044,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinate (value)

    Tests whether a string is a vec3.

    diff --git a/docs/0.5.0/guides/building-a-360-image-gallery.html b/docs/0.5.0/guides/building-a-360-image-gallery.html index 48e8c9540..31c6a5bbc 100644 --- a/docs/0.5.0/guides/building-a-360-image-gallery.html +++ b/docs/0.5.0/guides/building-a-360-image-gallery.html @@ -1059,7 +1059,7 @@

  • Using community components from the ecosystem.
  • Writing custom components to accomplish whatever we want.
    • - +

    Skeleton

    This is the starting point for our scene:

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor id="cursor">
          <a-animation begin="click" easing="ease-in" attribute="scale"
                       fill="backwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation>
          <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale"
                       from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation>
        </a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/0.5.0/guides/building-a-basic-scene.html b/docs/0.5.0/guides/building-a-basic-scene.html index d48b746b1..422a23244 100644 --- a/docs/0.5.0/guides/building-a-basic-scene.html +++ b/docs/0.5.0/guides/building-a-basic-scene.html @@ -1054,7 +1054,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      <body>
    </html>
    diff --git a/docs/0.5.0/guides/building-a-minecraft-demo.html b/docs/0.5.0/guides/building-a-minecraft-demo.html index 2a40b5caa..00d04a5da 100644 --- a/docs/0.5.0/guides/building-a-minecraft-demo.html +++ b/docs/0.5.0/guides/building-a-minecraft-demo.html @@ -1049,7 +1049,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/0.5.0/guides/building-with-magicavoxel.html b/docs/0.5.0/guides/building-with-magicavoxel.html index cd2a961a4..6b97adcef 100644 --- a/docs/0.5.0/guides/building-with-magicavoxel.html +++ b/docs/0.5.0/guides/building-with-magicavoxel.html @@ -1047,7 +1047,7 @@

    3D scenes and models using voxels (i.e., blocks). MagicaVoxel makes modeling super easy, similar to building in Minecraft.

    magicavoxel

    - +

    Installation

    MagicaVoxel works on Windows and OS X. On the MagicaVoxel homepage, click the Download button and install the application:

    diff --git a/docs/0.5.0/introduction/entity-component-system.html b/docs/0.5.0/introduction/entity-component-system.html index dcfebee7a..0a602fa8f 100644 --- a/docs/0.5.0/introduction/entity-component-system.html +++ b/docs/0.5.0/introduction/entity-component-system.html @@ -1072,7 +1072,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication. But we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/0.5.0/introduction/faq.html b/docs/0.5.0/introduction/faq.html index 22f271328..da888576f 100644 --- a/docs/0.5.0/introduction/faq.html +++ b/docs/0.5.0/introduction/faq.html @@ -1043,7 +1043,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/0.5.0/introduction/hosting-and-publishing.html b/docs/0.5.0/introduction/hosting-and-publishing.html index b89e96b44..db1e7c428 100644 --- a/docs/0.5.0/introduction/hosting-and-publishing.html +++ b/docs/0.5.0/introduction/hosting-and-publishing.html @@ -1045,7 +1045,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/0.5.0/introduction/html-and-primitives.html b/docs/0.5.0/introduction/html-and-primitives.html index acfd48376..4def71422 100644 --- a/docs/0.5.0/introduction/html-and-primitives.html +++ b/docs/0.5.0/introduction/html-and-primitives.html @@ -1047,7 +1047,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/0.5.0/introduction/installation.html b/docs/0.5.0/introduction/installation.html index 36bdae198..8e56dc189 100644 --- a/docs/0.5.0/introduction/installation.html +++ b/docs/0.5.0/introduction/installation.html @@ -1046,7 +1046,7 @@

    This installation section will show several ways to get started with A-Frame. Although many of the ways don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/0.5.0/introduction/interactions-and-controllers.html b/docs/0.5.0/introduction/interactions-and-controllers.html index 41dc5bfb5..77ef8b816 100644 --- a/docs/0.5.0/introduction/interactions-and-controllers.html +++ b/docs/0.5.0/introduction/interactions-and-controllers.html @@ -1054,7 +1054,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/0.5.0/introduction/javascript-events-dom-apis.html b/docs/0.5.0/introduction/javascript-events-dom-apis.html index 960618ec8..c1cb372b3 100644 --- a/docs/0.5.0/introduction/javascript-events-dom-apis.html +++ b/docs/0.5.0/introduction/javascript-events-dom-apis.html @@ -1052,7 +1052,7 @@

    prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Before we go over the different ways to use JavaScript and DOM APIs, we recommend encapsulating your JavaScript code within A-Frame components. diff --git a/docs/0.5.0/introduction/visual-inspector-and-dev-tools.html b/docs/0.5.0/introduction/visual-inspector-and-dev-tools.html index f245aad0d..07e56d500 100644 --- a/docs/0.5.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/0.5.0/introduction/visual-inspector-and-dev-tools.html @@ -1070,7 +1070,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/0.5.0/introduction/vr-headsets-and-webvr-browsers.html b/docs/0.5.0/introduction/vr-headsets-and-webvr-browsers.html index 3437986f0..01d9004e9 100644 --- a/docs/0.5.0/introduction/vr-headsets-and-webvr-browsers.html +++ b/docs/0.5.0/introduction/vr-headsets-and-webvr-browsers.html @@ -1043,7 +1043,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/0.6.0/components/geometry.html b/docs/0.6.0/components/geometry.html index 766807563..fcf0a076b 100644 --- a/docs/0.6.0/components/geometry.html +++ b/docs/0.6.0/components/geometry.html @@ -1089,7 +1089,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/0.6.0/components/gltf-model.html b/docs/0.6.0/components/gltf-model.html index 06c9be24b..aad4d5aba 100644 --- a/docs/0.6.0/components/gltf-model.html +++ b/docs/0.6.0/components/gltf-model.html @@ -1093,7 +1093,7 @@

    Note that glTF is a fairly new specification and adoption is still growing. Work on the three.js glTF loader and converters are still active.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/0.6.0/components/light.html b/docs/0.6.0/components/light.html index c14ed2d59..084bfb9bb 100644 --- a/docs/0.6.0/components/light.html +++ b/docs/0.6.0/components/light.html @@ -1100,7 +1100,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/0.6.0/components/material.html b/docs/0.6.0/components/material.html index acf21ff3a..efe6c5916 100644 --- a/docs/0.6.0/components/material.html +++ b/docs/0.6.0/components/material.html @@ -1090,7 +1090,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/0.6.0/components/text.html b/docs/0.6.0/components/text.html index 0609d0587..51eab02d8 100644 --- a/docs/0.6.0/components/text.html +++ b/docs/0.6.0/components/text.html @@ -1087,7 +1087,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handles diff --git a/docs/0.6.0/core/animations.html b/docs/0.6.0/core/animations.html index fa7440558..9debc750d 100644 --- a/docs/0.6.0/core/animations.html +++ b/docs/0.6.0/core/animations.html @@ -1099,7 +1099,7 @@

    the animation, and loops indefinitely.

    <a-entity>
      <a-entity position="5 0 0"></a-entity>
      <a-animation attribute="rotation"
                   dur="10000"
                   fill="forwards"
                   to="0 360 0"
                   repeat="indefinite"></a-animation>
    </a-entity>
    - +

    Attributes

    Here is an overview of animation attributes. We’ll go into more detail below.

    diff --git a/docs/0.6.0/core/asset-management-system.html b/docs/0.6.0/core/asset-management-system.html index da314affd..ec849fe20 100644 --- a/docs/0.6.0/core/asset-management-system.html +++ b/docs/0.6.0/core/asset-management-system.html @@ -1101,7 +1101,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/0.6.0/core/component.html b/docs/0.6.0/core/component.html index 7f0c5ed39..2f9cc19c5 100644 --- a/docs/0.6.0/core/component.html +++ b/docs/0.6.0/core/component.html @@ -1099,7 +1099,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/0.6.0/core/entity.html b/docs/0.6.0/core/entity.html index 00369de0d..b2b4e2fe4 100644 --- a/docs/0.6.0/core/entity.html +++ b/docs/0.6.0/core/entity.html @@ -1091,7 +1091,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/0.6.0/core/mixins.html b/docs/0.6.0/core/mixins.html index f2e96b1f3..f36501f2b 100644 --- a/docs/0.6.0/core/mixins.html +++ b/docs/0.6.0/core/mixins.html @@ -1097,7 +1097,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/0.6.0/core/scene.html b/docs/0.6.0/core/scene.html index 64c1ab549..d49fa282a 100644 --- a/docs/0.6.0/core/scene.html +++ b/docs/0.6.0/core/scene.html @@ -1098,7 +1098,7 @@

  • Set up webvr-polyfill, VREffect
  • Add UI to Enter VR that calls WebVR API
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/0.6.0/core/systems.html b/docs/0.6.0/core/systems.html index 5b9627445..588879b86 100644 --- a/docs/0.6.0/core/systems.html +++ b/docs/0.6.0/core/systems.html @@ -1092,7 +1092,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/0.6.0/core/utils.html b/docs/0.6.0/core/utils.html index 0ffb3bd98..f03fc9fe2 100644 --- a/docs/0.6.0/core/utils.html +++ b/docs/0.6.0/core/utils.html @@ -1086,7 +1086,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3.

    diff --git a/docs/0.6.0/guides/building-a-360-image-gallery.html b/docs/0.6.0/guides/building-a-360-image-gallery.html index 878245522..f19831fa2 100644 --- a/docs/0.6.0/guides/building-a-360-image-gallery.html +++ b/docs/0.6.0/guides/building-a-360-image-gallery.html @@ -1095,7 +1095,7 @@

  • Using community components from the ecosystem.
  • Writing custom components to accomplish whatever we want.
    • - +

    Skeleton

    This is the starting point for our scene:

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor id="cursor">
          <a-animation begin="click" easing="ease-in" attribute="scale"
                       fill="backwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation>
          <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale"
                       from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation>
        </a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/0.6.0/guides/building-a-basic-scene.html b/docs/0.6.0/guides/building-a-basic-scene.html index ac4d0a38a..4325b3294 100644 --- a/docs/0.6.0/guides/building-a-basic-scene.html +++ b/docs/0.6.0/guides/building-a-basic-scene.html @@ -1098,7 +1098,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/0.6.1/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/0.6.0/guides/building-a-minecraft-demo.html b/docs/0.6.0/guides/building-a-minecraft-demo.html index 2238dfd2b..ad68ce18d 100644 --- a/docs/0.6.0/guides/building-a-minecraft-demo.html +++ b/docs/0.6.0/guides/building-a-minecraft-demo.html @@ -1091,7 +1091,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/0.6.1/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/0.6.0/guides/building-with-magicavoxel.html b/docs/0.6.0/guides/building-with-magicavoxel.html index b47edb0f2..169c54a22 100644 --- a/docs/0.6.0/guides/building-with-magicavoxel.html +++ b/docs/0.6.0/guides/building-with-magicavoxel.html @@ -1089,7 +1089,7 @@

    3D scenes and models using voxels (i.e., blocks). MagicaVoxel makes modeling super easy, similar to building in Minecraft.

    magicavoxel

    - +

    Installation

    MagicaVoxel works on Windows and OS X. On the MagicaVoxel homepage, click the Download button and install the application:

    diff --git a/docs/0.6.0/introduction/entity-component-system.html b/docs/0.6.0/introduction/entity-component-system.html index f3d0f6763..c85de588c 100644 --- a/docs/0.6.0/introduction/entity-component-system.html +++ b/docs/0.6.0/introduction/entity-component-system.html @@ -1114,7 +1114,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication. But we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/0.6.0/introduction/faq.html b/docs/0.6.0/introduction/faq.html index 1e4ee539d..d21049080 100644 --- a/docs/0.6.0/introduction/faq.html +++ b/docs/0.6.0/introduction/faq.html @@ -1085,7 +1085,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/0.6.0/introduction/hosting-and-publishing.html b/docs/0.6.0/introduction/hosting-and-publishing.html index adb0c85cf..0329fff28 100644 --- a/docs/0.6.0/introduction/hosting-and-publishing.html +++ b/docs/0.6.0/introduction/hosting-and-publishing.html @@ -1087,7 +1087,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/0.6.0/introduction/html-and-primitives.html b/docs/0.6.0/introduction/html-and-primitives.html index 2087d6cc3..c6bc73410 100644 --- a/docs/0.6.0/introduction/html-and-primitives.html +++ b/docs/0.6.0/introduction/html-and-primitives.html @@ -1089,7 +1089,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/0.6.0/introduction/installation.html b/docs/0.6.0/introduction/installation.html index 887cb5db1..172341ba9 100644 --- a/docs/0.6.0/introduction/installation.html +++ b/docs/0.6.0/introduction/installation.html @@ -1088,7 +1088,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/0.6.0/introduction/interactions-and-controllers.html b/docs/0.6.0/introduction/interactions-and-controllers.html index 25b953975..b056dc489 100644 --- a/docs/0.6.0/introduction/interactions-and-controllers.html +++ b/docs/0.6.0/introduction/interactions-and-controllers.html @@ -1096,7 +1096,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/0.6.0/introduction/visual-inspector-and-dev-tools.html b/docs/0.6.0/introduction/visual-inspector-and-dev-tools.html index fb5bd382d..fc5176740 100644 --- a/docs/0.6.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/0.6.0/introduction/visual-inspector-and-dev-tools.html @@ -1112,7 +1112,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/0.6.0/introduction/vr-headsets-and-webvr-browsers.html b/docs/0.6.0/introduction/vr-headsets-and-webvr-browsers.html index 83ab3d5e9..cd269ade3 100644 --- a/docs/0.6.0/introduction/vr-headsets-and-webvr-browsers.html +++ b/docs/0.6.0/introduction/vr-headsets-and-webvr-browsers.html @@ -1085,7 +1085,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/0.7.0/components/geometry.html b/docs/0.7.0/components/geometry.html index e53a65f45..5f28c9067 100644 --- a/docs/0.7.0/components/geometry.html +++ b/docs/0.7.0/components/geometry.html @@ -1103,7 +1103,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/0.7.0/components/gltf-model.html b/docs/0.7.0/components/gltf-model.html index 9337ff6e6..234e0ad45 100644 --- a/docs/0.7.0/components/gltf-model.html +++ b/docs/0.7.0/components/gltf-model.html @@ -1111,7 +1111,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/0.7.0/components/light.html b/docs/0.7.0/components/light.html index e2fb95cf3..34e773681 100644 --- a/docs/0.7.0/components/light.html +++ b/docs/0.7.0/components/light.html @@ -1114,7 +1114,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/0.7.0/components/material.html b/docs/0.7.0/components/material.html index ecc675794..a86d567d6 100644 --- a/docs/0.7.0/components/material.html +++ b/docs/0.7.0/components/material.html @@ -1104,7 +1104,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/0.7.0/components/text.html b/docs/0.7.0/components/text.html index 89f4541b2..55ba54720 100644 --- a/docs/0.7.0/components/text.html +++ b/docs/0.7.0/components/text.html @@ -1101,7 +1101,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handles diff --git a/docs/0.7.0/core/animations.html b/docs/0.7.0/core/animations.html index d28d949c4..676062cd8 100644 --- a/docs/0.7.0/core/animations.html +++ b/docs/0.7.0/core/animations.html @@ -1113,7 +1113,7 @@

    the animation, and loops indefinitely.

    <a-entity>
      <a-entity position="5 0 0"></a-entity>
      <a-animation attribute="rotation"
                   dur="10000"
                   fill="forwards"
                   to="0 360 0"
                   repeat="indefinite"></a-animation>
    </a-entity>
    - +

    Attributes

    Here is an overview of animation attributes. We’ll go into more detail below.

    diff --git a/docs/0.7.0/core/asset-management-system.html b/docs/0.7.0/core/asset-management-system.html index da992316c..2559bcfdf 100644 --- a/docs/0.7.0/core/asset-management-system.html +++ b/docs/0.7.0/core/asset-management-system.html @@ -1115,7 +1115,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/0.7.0/core/component.html b/docs/0.7.0/core/component.html index 5dc95ac0f..e1b115843 100644 --- a/docs/0.7.0/core/component.html +++ b/docs/0.7.0/core/component.html @@ -1113,7 +1113,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/0.7.0/core/entity.html b/docs/0.7.0/core/entity.html index 4b6af349e..5983d4d5c 100644 --- a/docs/0.7.0/core/entity.html +++ b/docs/0.7.0/core/entity.html @@ -1105,7 +1105,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/0.7.0/core/mixins.html b/docs/0.7.0/core/mixins.html index 026e336ad..dac814f6c 100644 --- a/docs/0.7.0/core/mixins.html +++ b/docs/0.7.0/core/mixins.html @@ -1111,7 +1111,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/0.7.0/core/scene.html b/docs/0.7.0/core/scene.html index 6b5a61167..4e42c1408 100644 --- a/docs/0.7.0/core/scene.html +++ b/docs/0.7.0/core/scene.html @@ -1112,7 +1112,7 @@

  • Set up webvr-polyfill, VREffect
  • Add UI to Enter VR that calls WebVR API
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/0.7.0/core/systems.html b/docs/0.7.0/core/systems.html index 21c2204e7..7abdee17d 100644 --- a/docs/0.7.0/core/systems.html +++ b/docs/0.7.0/core/systems.html @@ -1106,7 +1106,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/0.7.0/core/utils.html b/docs/0.7.0/core/utils.html index c08ca5449..b8a4ca5fc 100644 --- a/docs/0.7.0/core/utils.html +++ b/docs/0.7.0/core/utils.html @@ -1100,7 +1100,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3.

    diff --git a/docs/0.7.0/guides/building-a-360-image-gallery.html b/docs/0.7.0/guides/building-a-360-image-gallery.html index 344bb3333..af72582d5 100644 --- a/docs/0.7.0/guides/building-a-360-image-gallery.html +++ b/docs/0.7.0/guides/building-a-360-image-gallery.html @@ -1109,7 +1109,7 @@

  • Using community components from the ecosystem.
  • Writing custom components to accomplish whatever we want.
    • - +

    Skeleton

    This is the starting point for our scene:

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor id="cursor">
          <a-animation begin="click" easing="ease-in" attribute="scale"
                       fill="backwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation>
          <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale"
                       from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation>
        </a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/0.7.0/guides/building-a-basic-scene.html b/docs/0.7.0/guides/building-a-basic-scene.html index 8b528202e..b8f1601b2 100644 --- a/docs/0.7.0/guides/building-a-basic-scene.html +++ b/docs/0.7.0/guides/building-a-basic-scene.html @@ -1112,7 +1112,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/0.7.0/guides/building-a-minecraft-demo.html b/docs/0.7.0/guides/building-a-minecraft-demo.html index dee8d7354..10eb5a561 100644 --- a/docs/0.7.0/guides/building-a-minecraft-demo.html +++ b/docs/0.7.0/guides/building-a-minecraft-demo.html @@ -1105,7 +1105,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/0.7.0/guides/building-with-magicavoxel.html b/docs/0.7.0/guides/building-with-magicavoxel.html index 7ad092223..7ae91acf0 100644 --- a/docs/0.7.0/guides/building-with-magicavoxel.html +++ b/docs/0.7.0/guides/building-with-magicavoxel.html @@ -1103,7 +1103,7 @@

    3D scenes and models using voxels (i.e., blocks). MagicaVoxel makes modeling super easy, similar to building in Minecraft.

    magicavoxel

    - +

    Installation

    MagicaVoxel works on Windows and OS X. On the MagicaVoxel homepage, click the Download button and install the application:

    diff --git a/docs/0.7.0/introduction/entity-component-system.html b/docs/0.7.0/introduction/entity-component-system.html index 6d2a48d1e..9499d75d4 100644 --- a/docs/0.7.0/introduction/entity-component-system.html +++ b/docs/0.7.0/introduction/entity-component-system.html @@ -1128,7 +1128,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication. But we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/0.7.0/introduction/faq.html b/docs/0.7.0/introduction/faq.html index 093dea491..49614f672 100644 --- a/docs/0.7.0/introduction/faq.html +++ b/docs/0.7.0/introduction/faq.html @@ -1099,7 +1099,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/0.7.0/introduction/hosting-and-publishing.html b/docs/0.7.0/introduction/hosting-and-publishing.html index 2e4bc2a25..1a2857d11 100644 --- a/docs/0.7.0/introduction/hosting-and-publishing.html +++ b/docs/0.7.0/introduction/hosting-and-publishing.html @@ -1101,7 +1101,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/0.7.0/introduction/html-and-primitives.html b/docs/0.7.0/introduction/html-and-primitives.html index 8b6096efd..bd68356fc 100644 --- a/docs/0.7.0/introduction/html-and-primitives.html +++ b/docs/0.7.0/introduction/html-and-primitives.html @@ -1103,7 +1103,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/0.7.0/introduction/installation.html b/docs/0.7.0/introduction/installation.html index 75c849955..4cd94d5c2 100644 --- a/docs/0.7.0/introduction/installation.html +++ b/docs/0.7.0/introduction/installation.html @@ -1102,7 +1102,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/0.7.0/introduction/interactions-and-controllers.html b/docs/0.7.0/introduction/interactions-and-controllers.html index 3937d2bd2..7af9e718d 100644 --- a/docs/0.7.0/introduction/interactions-and-controllers.html +++ b/docs/0.7.0/introduction/interactions-and-controllers.html @@ -1110,7 +1110,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/0.7.0/introduction/javascript-events-dom-apis.html b/docs/0.7.0/introduction/javascript-events-dom-apis.html index 7bb221ccb..dd41d8a0a 100644 --- a/docs/0.7.0/introduction/javascript-events-dom-apis.html +++ b/docs/0.7.0/introduction/javascript-events-dom-apis.html @@ -1106,7 +1106,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/0.7.0/introduction/visual-inspector-and-dev-tools.html b/docs/0.7.0/introduction/visual-inspector-and-dev-tools.html index 59b733fa1..3e0132079 100644 --- a/docs/0.7.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/0.7.0/introduction/visual-inspector-and-dev-tools.html @@ -1126,7 +1126,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/0.7.0/introduction/vr-headsets-and-webvr-browsers.html b/docs/0.7.0/introduction/vr-headsets-and-webvr-browsers.html index 4902eb18f..098dcdcc6 100644 --- a/docs/0.7.0/introduction/vr-headsets-and-webvr-browsers.html +++ b/docs/0.7.0/introduction/vr-headsets-and-webvr-browsers.html @@ -1099,7 +1099,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/0.8.0/components/geometry.html b/docs/0.8.0/components/geometry.html index 2f79b31f5..b5ca32bd6 100644 --- a/docs/0.8.0/components/geometry.html +++ b/docs/0.8.0/components/geometry.html @@ -1110,7 +1110,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/0.8.0/components/gltf-model.html b/docs/0.8.0/components/gltf-model.html index 73e15fc2e..8fd629ede 100644 --- a/docs/0.8.0/components/gltf-model.html +++ b/docs/0.8.0/components/gltf-model.html @@ -1118,7 +1118,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/0.8.0/components/light.html b/docs/0.8.0/components/light.html index 36af9e41b..266652d27 100644 --- a/docs/0.8.0/components/light.html +++ b/docs/0.8.0/components/light.html @@ -1121,7 +1121,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/0.8.0/components/material.html b/docs/0.8.0/components/material.html index 669076f9e..01e82f547 100644 --- a/docs/0.8.0/components/material.html +++ b/docs/0.8.0/components/material.html @@ -1111,7 +1111,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/0.8.0/components/text.html b/docs/0.8.0/components/text.html index beadb2755..e7935d0d3 100644 --- a/docs/0.8.0/components/text.html +++ b/docs/0.8.0/components/text.html @@ -1108,7 +1108,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handles diff --git a/docs/0.8.0/core/animations.html b/docs/0.8.0/core/animations.html index e54951545..45238b6a9 100644 --- a/docs/0.8.0/core/animations.html +++ b/docs/0.8.0/core/animations.html @@ -1120,7 +1120,7 @@

    the animation, and loops indefinitely.

    <a-entity>
      <a-entity position="5 0 0"></a-entity>
      <a-animation attribute="rotation"
                   dur="10000"
                   fill="forwards"
                   to="0 360 0"
                   repeat="indefinite"></a-animation>
    </a-entity>
    - +

    Attributes

    Here is an overview of animation attributes. We’ll go into more detail below.

    diff --git a/docs/0.8.0/core/asset-management-system.html b/docs/0.8.0/core/asset-management-system.html index 9c617f163..2a61d0918 100644 --- a/docs/0.8.0/core/asset-management-system.html +++ b/docs/0.8.0/core/asset-management-system.html @@ -1122,7 +1122,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/0.8.0/core/component.html b/docs/0.8.0/core/component.html index b38502f91..89a284f9e 100644 --- a/docs/0.8.0/core/component.html +++ b/docs/0.8.0/core/component.html @@ -1120,7 +1120,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/0.8.0/core/entity.html b/docs/0.8.0/core/entity.html index 459436b92..6136cc4c7 100644 --- a/docs/0.8.0/core/entity.html +++ b/docs/0.8.0/core/entity.html @@ -1112,7 +1112,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/0.8.0/core/mixins.html b/docs/0.8.0/core/mixins.html index 305fae5d1..af5f17fe4 100644 --- a/docs/0.8.0/core/mixins.html +++ b/docs/0.8.0/core/mixins.html @@ -1118,7 +1118,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/0.8.0/core/scene.html b/docs/0.8.0/core/scene.html index 89eb7c9e5..0d156c4b8 100644 --- a/docs/0.8.0/core/scene.html +++ b/docs/0.8.0/core/scene.html @@ -1119,7 +1119,7 @@

  • Set up webvr-polyfill, VREffect
  • Add UI to Enter VR that calls WebVR API
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/0.8.0/core/systems.html b/docs/0.8.0/core/systems.html index 456ca24b6..f26498cd6 100644 --- a/docs/0.8.0/core/systems.html +++ b/docs/0.8.0/core/systems.html @@ -1113,7 +1113,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/0.8.0/core/utils.html b/docs/0.8.0/core/utils.html index 7fe18fc21..c3fbca067 100644 --- a/docs/0.8.0/core/utils.html +++ b/docs/0.8.0/core/utils.html @@ -1107,7 +1107,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/0.8.0/guides/building-a-360-image-gallery.html b/docs/0.8.0/guides/building-a-360-image-gallery.html index 706cd16ad..7e97301b5 100644 --- a/docs/0.8.0/guides/building-a-360-image-gallery.html +++ b/docs/0.8.0/guides/building-a-360-image-gallery.html @@ -1116,7 +1116,7 @@

  • Using community components from the ecosystem.
  • Writing custom components to accomplish whatever we want.
    • - +

    Skeleton

    This is the starting point for our scene:

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor id="cursor">
          <a-animation begin="click" easing="ease-in" attribute="scale"
                       fill="backwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation>
          <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale"
                       from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation>
        </a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/0.8.0/guides/building-a-basic-scene.html b/docs/0.8.0/guides/building-a-basic-scene.html index 4a4da66c4..88f26294e 100644 --- a/docs/0.8.0/guides/building-a-basic-scene.html +++ b/docs/0.8.0/guides/building-a-basic-scene.html @@ -1119,7 +1119,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/0.8.0/guides/building-a-minecraft-demo.html b/docs/0.8.0/guides/building-a-minecraft-demo.html index bf1075d24..a467f43c2 100644 --- a/docs/0.8.0/guides/building-a-minecraft-demo.html +++ b/docs/0.8.0/guides/building-a-minecraft-demo.html @@ -1112,7 +1112,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/0.8.0/guides/building-with-magicavoxel.html b/docs/0.8.0/guides/building-with-magicavoxel.html index b8257c06d..3a1f11963 100644 --- a/docs/0.8.0/guides/building-with-magicavoxel.html +++ b/docs/0.8.0/guides/building-with-magicavoxel.html @@ -1110,7 +1110,7 @@

    3D scenes and models using voxels (i.e., blocks). MagicaVoxel makes modeling super easy, similar to building in Minecraft.

    magicavoxel

    - +

    Installation

    MagicaVoxel works on Windows and OS X. On the MagicaVoxel homepage, click the Download button and install the application:

    diff --git a/docs/0.8.0/introduction/entity-component-system.html b/docs/0.8.0/introduction/entity-component-system.html index 92e4d7f3a..5a3125bbc 100644 --- a/docs/0.8.0/introduction/entity-component-system.html +++ b/docs/0.8.0/introduction/entity-component-system.html @@ -1135,7 +1135,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication. But we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/0.8.0/introduction/faq.html b/docs/0.8.0/introduction/faq.html index eb445e04a..28ee00772 100644 --- a/docs/0.8.0/introduction/faq.html +++ b/docs/0.8.0/introduction/faq.html @@ -1106,7 +1106,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/0.8.0/introduction/hosting-and-publishing.html b/docs/0.8.0/introduction/hosting-and-publishing.html index 968f6b306..abb24c6f1 100644 --- a/docs/0.8.0/introduction/hosting-and-publishing.html +++ b/docs/0.8.0/introduction/hosting-and-publishing.html @@ -1108,7 +1108,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/0.8.0/introduction/html-and-primitives.html b/docs/0.8.0/introduction/html-and-primitives.html index d45a72717..508ad4959 100644 --- a/docs/0.8.0/introduction/html-and-primitives.html +++ b/docs/0.8.0/introduction/html-and-primitives.html @@ -1110,7 +1110,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/0.8.0/introduction/installation.html b/docs/0.8.0/introduction/installation.html index bfc8b8a45..1d328eafa 100644 --- a/docs/0.8.0/introduction/installation.html +++ b/docs/0.8.0/introduction/installation.html @@ -1109,7 +1109,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/0.8.0/introduction/interactions-and-controllers.html b/docs/0.8.0/introduction/interactions-and-controllers.html index 52ee71dc0..9a400adf8 100644 --- a/docs/0.8.0/introduction/interactions-and-controllers.html +++ b/docs/0.8.0/introduction/interactions-and-controllers.html @@ -1117,7 +1117,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/0.8.0/introduction/javascript-events-dom-apis.html b/docs/0.8.0/introduction/javascript-events-dom-apis.html index 231205db2..7b3af7589 100644 --- a/docs/0.8.0/introduction/javascript-events-dom-apis.html +++ b/docs/0.8.0/introduction/javascript-events-dom-apis.html @@ -1113,7 +1113,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/0.8.0/introduction/visual-inspector-and-dev-tools.html b/docs/0.8.0/introduction/visual-inspector-and-dev-tools.html index cd4345c5e..7a43b31ab 100644 --- a/docs/0.8.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/0.8.0/introduction/visual-inspector-and-dev-tools.html @@ -1121,7 +1121,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/0.8.0/introduction/vr-headsets-and-webvr-browsers.html b/docs/0.8.0/introduction/vr-headsets-and-webvr-browsers.html index 95a38455e..8be3658ad 100644 --- a/docs/0.8.0/introduction/vr-headsets-and-webvr-browsers.html +++ b/docs/0.8.0/introduction/vr-headsets-and-webvr-browsers.html @@ -1106,7 +1106,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/0.9.0/components/animation.html b/docs/0.9.0/components/animation.html index 405fd1162..2f69ceab5 100644 --- a/docs/0.9.0/components/animation.html +++ b/docs/0.9.0/components/animation.html @@ -1132,7 +1132,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/0.9.0/components/geometry.html b/docs/0.9.0/components/geometry.html index aece6141b..dc10b26a8 100644 --- a/docs/0.9.0/components/geometry.html +++ b/docs/0.9.0/components/geometry.html @@ -1117,7 +1117,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/0.9.0/components/gltf-model.html b/docs/0.9.0/components/gltf-model.html index f74962a9e..b0c3de314 100644 --- a/docs/0.9.0/components/gltf-model.html +++ b/docs/0.9.0/components/gltf-model.html @@ -1125,7 +1125,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/0.9.0/components/light.html b/docs/0.9.0/components/light.html index c1e341a64..d5282f553 100644 --- a/docs/0.9.0/components/light.html +++ b/docs/0.9.0/components/light.html @@ -1128,7 +1128,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/0.9.0/components/material.html b/docs/0.9.0/components/material.html index bc9b2e64e..f9153e210 100644 --- a/docs/0.9.0/components/material.html +++ b/docs/0.9.0/components/material.html @@ -1118,7 +1118,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/0.9.0/components/text.html b/docs/0.9.0/components/text.html index eeb8ca53c..bedae18bf 100644 --- a/docs/0.9.0/components/text.html +++ b/docs/0.9.0/components/text.html @@ -1115,7 +1115,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handles diff --git a/docs/0.9.0/core/asset-management-system.html b/docs/0.9.0/core/asset-management-system.html index cf4aa80d4..77884b1d4 100644 --- a/docs/0.9.0/core/asset-management-system.html +++ b/docs/0.9.0/core/asset-management-system.html @@ -1131,7 +1131,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/0.9.0/core/component.html b/docs/0.9.0/core/component.html index e2a42f692..3870e09d5 100644 --- a/docs/0.9.0/core/component.html +++ b/docs/0.9.0/core/component.html @@ -1127,7 +1127,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/0.9.0/core/entity.html b/docs/0.9.0/core/entity.html index 502aa3139..2b79b7fc1 100644 --- a/docs/0.9.0/core/entity.html +++ b/docs/0.9.0/core/entity.html @@ -1119,7 +1119,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/0.9.0/core/mixins.html b/docs/0.9.0/core/mixins.html index 426f3d28f..5943d29a9 100644 --- a/docs/0.9.0/core/mixins.html +++ b/docs/0.9.0/core/mixins.html @@ -1125,7 +1125,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/0.9.0/core/scene.html b/docs/0.9.0/core/scene.html index d3079ef0f..a895d1f41 100644 --- a/docs/0.9.0/core/scene.html +++ b/docs/0.9.0/core/scene.html @@ -1126,7 +1126,7 @@

  • Set up webvr-polyfill, VREffect
  • Add UI to Enter VR that calls WebVR API
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/0.9.0/core/systems.html b/docs/0.9.0/core/systems.html index 1be227c34..54adecf1b 100644 --- a/docs/0.9.0/core/systems.html +++ b/docs/0.9.0/core/systems.html @@ -1120,7 +1120,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/0.9.0/core/utils.html b/docs/0.9.0/core/utils.html index 62ac389cb..8bf747626 100644 --- a/docs/0.9.0/core/utils.html +++ b/docs/0.9.0/core/utils.html @@ -1114,7 +1114,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/0.9.0/guides/building-a-360-image-gallery.html b/docs/0.9.0/guides/building-a-360-image-gallery.html index 497f2c076..55c069a6f 100644 --- a/docs/0.9.0/guides/building-a-360-image-gallery.html +++ b/docs/0.9.0/guides/building-a-360-image-gallery.html @@ -1125,7 +1125,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene. We can also remix the Glitch.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/0.9.0/guides/building-a-basic-scene.html b/docs/0.9.0/guides/building-a-basic-scene.html index 1b1073482..d1e530b5a 100644 --- a/docs/0.9.0/guides/building-a-basic-scene.html +++ b/docs/0.9.0/guides/building-a-basic-scene.html @@ -1126,7 +1126,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/0.9.0/guides/building-a-minecraft-demo.html b/docs/0.9.0/guides/building-a-minecraft-demo.html index e2ac49322..55797588d 100644 --- a/docs/0.9.0/guides/building-a-minecraft-demo.html +++ b/docs/0.9.0/guides/building-a-minecraft-demo.html @@ -1119,7 +1119,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/0.9.0/introduction/entity-component-system.html b/docs/0.9.0/introduction/entity-component-system.html index c0658b6f3..234cad964 100644 --- a/docs/0.9.0/introduction/entity-component-system.html +++ b/docs/0.9.0/introduction/entity-component-system.html @@ -1142,7 +1142,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/0.9.0/introduction/faq.html b/docs/0.9.0/introduction/faq.html index c9bb1bc2b..56be5148f 100644 --- a/docs/0.9.0/introduction/faq.html +++ b/docs/0.9.0/introduction/faq.html @@ -1113,7 +1113,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/0.9.0/introduction/hosting-and-publishing.html b/docs/0.9.0/introduction/hosting-and-publishing.html index 03e7464c3..9a3832176 100644 --- a/docs/0.9.0/introduction/hosting-and-publishing.html +++ b/docs/0.9.0/introduction/hosting-and-publishing.html @@ -1115,7 +1115,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/0.9.0/introduction/html-and-primitives.html b/docs/0.9.0/introduction/html-and-primitives.html index 4706e89cb..01b7b1a1e 100644 --- a/docs/0.9.0/introduction/html-and-primitives.html +++ b/docs/0.9.0/introduction/html-and-primitives.html @@ -1117,7 +1117,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/0.9.0/introduction/installation.html b/docs/0.9.0/introduction/installation.html index f0ba69688..5465506d2 100644 --- a/docs/0.9.0/introduction/installation.html +++ b/docs/0.9.0/introduction/installation.html @@ -1116,7 +1116,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/0.9.0/introduction/interactions-and-controllers.html b/docs/0.9.0/introduction/interactions-and-controllers.html index 04723e2a1..ab1bc1559 100644 --- a/docs/0.9.0/introduction/interactions-and-controllers.html +++ b/docs/0.9.0/introduction/interactions-and-controllers.html @@ -1124,7 +1124,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/0.9.0/introduction/javascript-events-dom-apis.html b/docs/0.9.0/introduction/javascript-events-dom-apis.html index 2efef0387..c6f434224 100644 --- a/docs/0.9.0/introduction/javascript-events-dom-apis.html +++ b/docs/0.9.0/introduction/javascript-events-dom-apis.html @@ -1120,7 +1120,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/0.9.0/introduction/visual-inspector-and-dev-tools.html b/docs/0.9.0/introduction/visual-inspector-and-dev-tools.html index aa7fd0a91..1d88385cb 100644 --- a/docs/0.9.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/0.9.0/introduction/visual-inspector-and-dev-tools.html @@ -1128,7 +1128,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/0.9.0/introduction/vr-headsets-and-webvr-browsers.html b/docs/0.9.0/introduction/vr-headsets-and-webvr-browsers.html index 05cc1d81b..b88b3434f 100644 --- a/docs/0.9.0/introduction/vr-headsets-and-webvr-browsers.html +++ b/docs/0.9.0/introduction/vr-headsets-and-webvr-browsers.html @@ -1113,7 +1113,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/1.0.0/components/animation.html b/docs/1.0.0/components/animation.html index 2b56a3b33..be3752c9b 100644 --- a/docs/1.0.0/components/animation.html +++ b/docs/1.0.0/components/animation.html @@ -1139,7 +1139,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/1.0.0/components/geometry.html b/docs/1.0.0/components/geometry.html index 2c4f7b524..938902af5 100644 --- a/docs/1.0.0/components/geometry.html +++ b/docs/1.0.0/components/geometry.html @@ -1124,7 +1124,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/1.0.0/components/gltf-model.html b/docs/1.0.0/components/gltf-model.html index 0c641ecd8..34a56d03f 100644 --- a/docs/1.0.0/components/gltf-model.html +++ b/docs/1.0.0/components/gltf-model.html @@ -1132,7 +1132,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/1.0.0/components/light.html b/docs/1.0.0/components/light.html index 1b8d50681..13a338b04 100644 --- a/docs/1.0.0/components/light.html +++ b/docs/1.0.0/components/light.html @@ -1135,7 +1135,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/1.0.0/components/material.html b/docs/1.0.0/components/material.html index 583eb2715..c427600f7 100644 --- a/docs/1.0.0/components/material.html +++ b/docs/1.0.0/components/material.html @@ -1125,7 +1125,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/1.0.0/components/text.html b/docs/1.0.0/components/text.html index d08512187..f5f5ff02e 100644 --- a/docs/1.0.0/components/text.html +++ b/docs/1.0.0/components/text.html @@ -1122,7 +1122,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handles diff --git a/docs/1.0.0/core/asset-management-system.html b/docs/1.0.0/core/asset-management-system.html index 8354fcc16..edc93c294 100644 --- a/docs/1.0.0/core/asset-management-system.html +++ b/docs/1.0.0/core/asset-management-system.html @@ -1138,7 +1138,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/1.0.0/core/component.html b/docs/1.0.0/core/component.html index 563cb455a..739981e81 100644 --- a/docs/1.0.0/core/component.html +++ b/docs/1.0.0/core/component.html @@ -1134,7 +1134,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/1.0.0/core/entity.html b/docs/1.0.0/core/entity.html index b0144c4e4..8ca3c6a3e 100644 --- a/docs/1.0.0/core/entity.html +++ b/docs/1.0.0/core/entity.html @@ -1126,7 +1126,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/1.0.0/core/mixins.html b/docs/1.0.0/core/mixins.html index 53e30d9d7..984dcc7f4 100644 --- a/docs/1.0.0/core/mixins.html +++ b/docs/1.0.0/core/mixins.html @@ -1132,7 +1132,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/1.0.0/core/scene.html b/docs/1.0.0/core/scene.html index 00fdae9e3..1ccf81254 100644 --- a/docs/1.0.0/core/scene.html +++ b/docs/1.0.0/core/scene.html @@ -1133,7 +1133,7 @@

  • Set up webvr-polyfill, VREffect
  • Add UI to Enter VR that calls WebVR API
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/1.0.0/core/systems.html b/docs/1.0.0/core/systems.html index 589b19a4f..e097ef71e 100644 --- a/docs/1.0.0/core/systems.html +++ b/docs/1.0.0/core/systems.html @@ -1127,7 +1127,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/1.0.0/core/utils.html b/docs/1.0.0/core/utils.html index f9d8c397a..931dcecb9 100644 --- a/docs/1.0.0/core/utils.html +++ b/docs/1.0.0/core/utils.html @@ -1121,7 +1121,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/1.0.0/guides/building-a-360-image-gallery.html b/docs/1.0.0/guides/building-a-360-image-gallery.html index 740a7b790..9b2e42fcc 100644 --- a/docs/1.0.0/guides/building-a-360-image-gallery.html +++ b/docs/1.0.0/guides/building-a-360-image-gallery.html @@ -1132,7 +1132,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene. We can also remix the Glitch.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/1.0.0/guides/building-a-basic-scene.html b/docs/1.0.0/guides/building-a-basic-scene.html index 9541e6f3b..41206406e 100644 --- a/docs/1.0.0/guides/building-a-basic-scene.html +++ b/docs/1.0.0/guides/building-a-basic-scene.html @@ -1133,7 +1133,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/1.0.0/guides/building-a-minecraft-demo.html b/docs/1.0.0/guides/building-a-minecraft-demo.html index 89516d42f..9b17f7587 100644 --- a/docs/1.0.0/guides/building-a-minecraft-demo.html +++ b/docs/1.0.0/guides/building-a-minecraft-demo.html @@ -1126,7 +1126,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/1.0.0/introduction/entity-component-system.html b/docs/1.0.0/introduction/entity-component-system.html index c5ef6d431..ee96cb245 100644 --- a/docs/1.0.0/introduction/entity-component-system.html +++ b/docs/1.0.0/introduction/entity-component-system.html @@ -1149,7 +1149,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/1.0.0/introduction/faq.html b/docs/1.0.0/introduction/faq.html index 1f8a95c71..2a90c01fd 100644 --- a/docs/1.0.0/introduction/faq.html +++ b/docs/1.0.0/introduction/faq.html @@ -1120,7 +1120,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/1.0.0/introduction/hosting-and-publishing.html b/docs/1.0.0/introduction/hosting-and-publishing.html index 28ab27b2c..d00b95a21 100644 --- a/docs/1.0.0/introduction/hosting-and-publishing.html +++ b/docs/1.0.0/introduction/hosting-and-publishing.html @@ -1122,7 +1122,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/1.0.0/introduction/html-and-primitives.html b/docs/1.0.0/introduction/html-and-primitives.html index c43eb5b56..1e3718c31 100644 --- a/docs/1.0.0/introduction/html-and-primitives.html +++ b/docs/1.0.0/introduction/html-and-primitives.html @@ -1124,7 +1124,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/1.0.0/introduction/installation.html b/docs/1.0.0/introduction/installation.html index 39dcb0034..6ce20b6d1 100644 --- a/docs/1.0.0/introduction/installation.html +++ b/docs/1.0.0/introduction/installation.html @@ -1123,7 +1123,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/1.0.0/introduction/interactions-and-controllers.html b/docs/1.0.0/introduction/interactions-and-controllers.html index c0bdf1c15..cfb1fca9e 100644 --- a/docs/1.0.0/introduction/interactions-and-controllers.html +++ b/docs/1.0.0/introduction/interactions-and-controllers.html @@ -1131,7 +1131,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/1.0.0/introduction/javascript-events-dom-apis.html b/docs/1.0.0/introduction/javascript-events-dom-apis.html index e7d50b3d6..4a3222265 100644 --- a/docs/1.0.0/introduction/javascript-events-dom-apis.html +++ b/docs/1.0.0/introduction/javascript-events-dom-apis.html @@ -1127,7 +1127,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/1.0.0/introduction/visual-inspector-and-dev-tools.html b/docs/1.0.0/introduction/visual-inspector-and-dev-tools.html index f0d157b90..8a1a63e91 100644 --- a/docs/1.0.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/1.0.0/introduction/visual-inspector-and-dev-tools.html @@ -1135,7 +1135,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/1.0.0/introduction/vr-headsets-and-webvr-browsers.html b/docs/1.0.0/introduction/vr-headsets-and-webvr-browsers.html index 922ba01e7..8a65b2545 100644 --- a/docs/1.0.0/introduction/vr-headsets-and-webvr-browsers.html +++ b/docs/1.0.0/introduction/vr-headsets-and-webvr-browsers.html @@ -1120,7 +1120,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/1.1.0/components/animation.html b/docs/1.1.0/components/animation.html index ab9ad35c6..2d7054e90 100644 --- a/docs/1.1.0/components/animation.html +++ b/docs/1.1.0/components/animation.html @@ -1167,7 +1167,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/1.1.0/components/geometry.html b/docs/1.1.0/components/geometry.html index 03a8b0d81..8938fef88 100644 --- a/docs/1.1.0/components/geometry.html +++ b/docs/1.1.0/components/geometry.html @@ -1152,7 +1152,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/1.1.0/components/gltf-model.html b/docs/1.1.0/components/gltf-model.html index 850b00c20..1c782b73d 100644 --- a/docs/1.1.0/components/gltf-model.html +++ b/docs/1.1.0/components/gltf-model.html @@ -1160,7 +1160,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/1.1.0/components/light.html b/docs/1.1.0/components/light.html index b27824d18..f249072a1 100644 --- a/docs/1.1.0/components/light.html +++ b/docs/1.1.0/components/light.html @@ -1163,7 +1163,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/1.1.0/components/material.html b/docs/1.1.0/components/material.html index 086c83792..6791cedd7 100644 --- a/docs/1.1.0/components/material.html +++ b/docs/1.1.0/components/material.html @@ -1153,7 +1153,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/1.1.0/components/text.html b/docs/1.1.0/components/text.html index 0f94cee7b..1d0a04e0b 100644 --- a/docs/1.1.0/components/text.html +++ b/docs/1.1.0/components/text.html @@ -1150,7 +1150,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handle diff --git a/docs/1.1.0/core/asset-management-system.html b/docs/1.1.0/core/asset-management-system.html index 352d8fc4c..1f10030c3 100644 --- a/docs/1.1.0/core/asset-management-system.html +++ b/docs/1.1.0/core/asset-management-system.html @@ -1166,7 +1166,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/1.1.0/core/component.html b/docs/1.1.0/core/component.html index a5b15a7fc..c7216862a 100644 --- a/docs/1.1.0/core/component.html +++ b/docs/1.1.0/core/component.html @@ -1162,7 +1162,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/1.1.0/core/entity.html b/docs/1.1.0/core/entity.html index 90af2ee07..9a520cf7d 100644 --- a/docs/1.1.0/core/entity.html +++ b/docs/1.1.0/core/entity.html @@ -1154,7 +1154,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/1.1.0/core/mixins.html b/docs/1.1.0/core/mixins.html index 24624e864..38099d41e 100644 --- a/docs/1.1.0/core/mixins.html +++ b/docs/1.1.0/core/mixins.html @@ -1160,7 +1160,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/1.1.0/core/scene.html b/docs/1.1.0/core/scene.html index 6d18a01f9..9650cd0f7 100644 --- a/docs/1.1.0/core/scene.html +++ b/docs/1.1.0/core/scene.html @@ -1162,7 +1162,7 @@

  • Add UI to Enter VR that calls WebVR API
  • Configure WebXR devices through the webxr system
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/1.1.0/core/systems.html b/docs/1.1.0/core/systems.html index 2b06d32cf..d67a2329e 100644 --- a/docs/1.1.0/core/systems.html +++ b/docs/1.1.0/core/systems.html @@ -1155,7 +1155,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/1.1.0/core/utils.html b/docs/1.1.0/core/utils.html index 1cb415843..1ecd8de93 100644 --- a/docs/1.1.0/core/utils.html +++ b/docs/1.1.0/core/utils.html @@ -1149,7 +1149,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/1.1.0/guides/building-a-360-image-gallery.html b/docs/1.1.0/guides/building-a-360-image-gallery.html index b6142d530..bab37c53c 100644 --- a/docs/1.1.0/guides/building-a-360-image-gallery.html +++ b/docs/1.1.0/guides/building-a-360-image-gallery.html @@ -1160,7 +1160,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene. We can also remix the Glitch.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/1.1.0/guides/building-a-basic-scene.html b/docs/1.1.0/guides/building-a-basic-scene.html index 3a1e8781d..5377e4b2d 100644 --- a/docs/1.1.0/guides/building-a-basic-scene.html +++ b/docs/1.1.0/guides/building-a-basic-scene.html @@ -1161,7 +1161,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/1.1.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/1.1.0/guides/building-a-minecraft-demo.html b/docs/1.1.0/guides/building-a-minecraft-demo.html index 76ddb6e1b..1680eace7 100644 --- a/docs/1.1.0/guides/building-a-minecraft-demo.html +++ b/docs/1.1.0/guides/building-a-minecraft-demo.html @@ -1154,7 +1154,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/1.1.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/1.1.0/introduction/entity-component-system.html b/docs/1.1.0/introduction/entity-component-system.html index 5a80670e5..026507f0b 100644 --- a/docs/1.1.0/introduction/entity-component-system.html +++ b/docs/1.1.0/introduction/entity-component-system.html @@ -1177,7 +1177,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/1.1.0/introduction/faq.html b/docs/1.1.0/introduction/faq.html index 55cfdeda1..4926e3ba6 100644 --- a/docs/1.1.0/introduction/faq.html +++ b/docs/1.1.0/introduction/faq.html @@ -1148,7 +1148,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/1.1.0/introduction/hosting-and-publishing.html b/docs/1.1.0/introduction/hosting-and-publishing.html index dd0b8ec25..a85cd2d9b 100644 --- a/docs/1.1.0/introduction/hosting-and-publishing.html +++ b/docs/1.1.0/introduction/hosting-and-publishing.html @@ -1150,7 +1150,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/1.1.0/introduction/html-and-primitives.html b/docs/1.1.0/introduction/html-and-primitives.html index 46b8d1cea..5724a5989 100644 --- a/docs/1.1.0/introduction/html-and-primitives.html +++ b/docs/1.1.0/introduction/html-and-primitives.html @@ -1152,7 +1152,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/1.1.0/introduction/installation.html b/docs/1.1.0/introduction/installation.html index 389e3e016..f6f15fd51 100644 --- a/docs/1.1.0/introduction/installation.html +++ b/docs/1.1.0/introduction/installation.html @@ -1151,7 +1151,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/1.1.0/introduction/interactions-and-controllers.html b/docs/1.1.0/introduction/interactions-and-controllers.html index 1326f059d..a45bf5fa2 100644 --- a/docs/1.1.0/introduction/interactions-and-controllers.html +++ b/docs/1.1.0/introduction/interactions-and-controllers.html @@ -1159,7 +1159,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/1.1.0/introduction/javascript-events-dom-apis.html b/docs/1.1.0/introduction/javascript-events-dom-apis.html index 75c4ea8ba..057b07c4a 100644 --- a/docs/1.1.0/introduction/javascript-events-dom-apis.html +++ b/docs/1.1.0/introduction/javascript-events-dom-apis.html @@ -1155,7 +1155,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/1.1.0/introduction/visual-inspector-and-dev-tools.html b/docs/1.1.0/introduction/visual-inspector-and-dev-tools.html index c8b2016c1..580e041a0 100644 --- a/docs/1.1.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/1.1.0/introduction/visual-inspector-and-dev-tools.html @@ -1163,7 +1163,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/1.1.0/introduction/vr-headsets-and-webvr-browsers.html b/docs/1.1.0/introduction/vr-headsets-and-webvr-browsers.html index a3334470a..144422da7 100644 --- a/docs/1.1.0/introduction/vr-headsets-and-webvr-browsers.html +++ b/docs/1.1.0/introduction/vr-headsets-and-webvr-browsers.html @@ -1148,7 +1148,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/1.2.0/components/animation.html b/docs/1.2.0/components/animation.html index 9ec443558..b7510b2bd 100644 --- a/docs/1.2.0/components/animation.html +++ b/docs/1.2.0/components/animation.html @@ -1167,7 +1167,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/1.2.0/components/geometry.html b/docs/1.2.0/components/geometry.html index a17e35b59..81c7ceb82 100644 --- a/docs/1.2.0/components/geometry.html +++ b/docs/1.2.0/components/geometry.html @@ -1152,7 +1152,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide a appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/1.2.0/components/gltf-model.html b/docs/1.2.0/components/gltf-model.html index 79db08dfe..33faaec7d 100644 --- a/docs/1.2.0/components/gltf-model.html +++ b/docs/1.2.0/components/gltf-model.html @@ -1160,7 +1160,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/1.2.0/components/light.html b/docs/1.2.0/components/light.html index 87a9e4cb7..6fc3660e1 100644 --- a/docs/1.2.0/components/light.html +++ b/docs/1.2.0/components/light.html @@ -1163,7 +1163,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/1.2.0/components/material.html b/docs/1.2.0/components/material.html index 0d2cb644e..00050c961 100644 --- a/docs/1.2.0/components/material.html +++ b/docs/1.2.0/components/material.html @@ -1153,7 +1153,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/1.2.0/components/text.html b/docs/1.2.0/components/text.html index 1ff3b6de9..1eddb74e6 100644 --- a/docs/1.2.0/components/text.html +++ b/docs/1.2.0/components/text.html @@ -1150,7 +1150,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handle diff --git a/docs/1.2.0/core/asset-management-system.html b/docs/1.2.0/core/asset-management-system.html index 76978244a..f763a5c8c 100644 --- a/docs/1.2.0/core/asset-management-system.html +++ b/docs/1.2.0/core/asset-management-system.html @@ -1166,7 +1166,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/1.2.0/core/component.html b/docs/1.2.0/core/component.html index c49a4ba5d..5f63c4ab1 100644 --- a/docs/1.2.0/core/component.html +++ b/docs/1.2.0/core/component.html @@ -1162,7 +1162,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/1.2.0/core/entity.html b/docs/1.2.0/core/entity.html index 0b3abe78c..766af4646 100644 --- a/docs/1.2.0/core/entity.html +++ b/docs/1.2.0/core/entity.html @@ -1154,7 +1154,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/1.2.0/core/mixins.html b/docs/1.2.0/core/mixins.html index ab1a507a6..4ff1677fb 100644 --- a/docs/1.2.0/core/mixins.html +++ b/docs/1.2.0/core/mixins.html @@ -1160,7 +1160,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/1.2.0/core/scene.html b/docs/1.2.0/core/scene.html index a75f6b5bf..135197ab2 100644 --- a/docs/1.2.0/core/scene.html +++ b/docs/1.2.0/core/scene.html @@ -1162,7 +1162,7 @@

  • Add UI to Enter VR that calls WebVR API
  • Configure WebXR devices through the webxr system
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/1.2.0/core/systems.html b/docs/1.2.0/core/systems.html index 26acf0036..dda957b5b 100644 --- a/docs/1.2.0/core/systems.html +++ b/docs/1.2.0/core/systems.html @@ -1155,7 +1155,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/1.2.0/core/utils.html b/docs/1.2.0/core/utils.html index df1225f71..4559165a3 100644 --- a/docs/1.2.0/core/utils.html +++ b/docs/1.2.0/core/utils.html @@ -1149,7 +1149,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/1.2.0/guides/building-a-360-image-gallery.html b/docs/1.2.0/guides/building-a-360-image-gallery.html index dad10cb92..cee080317 100644 --- a/docs/1.2.0/guides/building-a-360-image-gallery.html +++ b/docs/1.2.0/guides/building-a-360-image-gallery.html @@ -1160,7 +1160,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene. We can also remix the Glitch.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/1.2.0/guides/building-a-basic-scene.html b/docs/1.2.0/guides/building-a-basic-scene.html index 2a8141288..e1e26bc49 100644 --- a/docs/1.2.0/guides/building-a-basic-scene.html +++ b/docs/1.2.0/guides/building-a-basic-scene.html @@ -1161,7 +1161,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/1.2.0/guides/building-a-minecraft-demo.html b/docs/1.2.0/guides/building-a-minecraft-demo.html index f5fd824c0..941694fad 100644 --- a/docs/1.2.0/guides/building-a-minecraft-demo.html +++ b/docs/1.2.0/guides/building-a-minecraft-demo.html @@ -1154,7 +1154,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/1.2.0/introduction/entity-component-system.html b/docs/1.2.0/introduction/entity-component-system.html index 46b9da6f6..f85efcfe6 100644 --- a/docs/1.2.0/introduction/entity-component-system.html +++ b/docs/1.2.0/introduction/entity-component-system.html @@ -1177,7 +1177,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/1.2.0/introduction/faq.html b/docs/1.2.0/introduction/faq.html index 901587a10..8ee3cc601 100644 --- a/docs/1.2.0/introduction/faq.html +++ b/docs/1.2.0/introduction/faq.html @@ -1148,7 +1148,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/1.2.0/introduction/hosting-and-publishing.html b/docs/1.2.0/introduction/hosting-and-publishing.html index a48dbe97a..4b2bdda6d 100644 --- a/docs/1.2.0/introduction/hosting-and-publishing.html +++ b/docs/1.2.0/introduction/hosting-and-publishing.html @@ -1150,7 +1150,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/1.2.0/introduction/html-and-primitives.html b/docs/1.2.0/introduction/html-and-primitives.html index 0d875107a..ed2759fdb 100644 --- a/docs/1.2.0/introduction/html-and-primitives.html +++ b/docs/1.2.0/introduction/html-and-primitives.html @@ -1152,7 +1152,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/1.2.0/introduction/installation.html b/docs/1.2.0/introduction/installation.html index e6212aad3..cf595352d 100644 --- a/docs/1.2.0/introduction/installation.html +++ b/docs/1.2.0/introduction/installation.html @@ -1151,7 +1151,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/1.2.0/introduction/interactions-and-controllers.html b/docs/1.2.0/introduction/interactions-and-controllers.html index 16717a43b..5470309ce 100644 --- a/docs/1.2.0/introduction/interactions-and-controllers.html +++ b/docs/1.2.0/introduction/interactions-and-controllers.html @@ -1159,7 +1159,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/1.2.0/introduction/javascript-events-dom-apis.html b/docs/1.2.0/introduction/javascript-events-dom-apis.html index 85317771c..2cc1d736a 100644 --- a/docs/1.2.0/introduction/javascript-events-dom-apis.html +++ b/docs/1.2.0/introduction/javascript-events-dom-apis.html @@ -1155,7 +1155,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/1.2.0/introduction/visual-inspector-and-dev-tools.html b/docs/1.2.0/introduction/visual-inspector-and-dev-tools.html index 52ff319d7..1ca7ab4df 100644 --- a/docs/1.2.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/1.2.0/introduction/visual-inspector-and-dev-tools.html @@ -1163,7 +1163,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/1.2.0/introduction/vr-headsets-and-webvr-browsers.html b/docs/1.2.0/introduction/vr-headsets-and-webvr-browsers.html index 12200ae3e..a63965949 100644 --- a/docs/1.2.0/introduction/vr-headsets-and-webvr-browsers.html +++ b/docs/1.2.0/introduction/vr-headsets-and-webvr-browsers.html @@ -1148,7 +1148,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/1.3.0/components/animation.html b/docs/1.3.0/components/animation.html index b3cec5989..9807c9545 100644 --- a/docs/1.3.0/components/animation.html +++ b/docs/1.3.0/components/animation.html @@ -1188,7 +1188,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/1.3.0/components/geometry.html b/docs/1.3.0/components/geometry.html index f8a5a21da..7d35e05ff 100644 --- a/docs/1.3.0/components/geometry.html +++ b/docs/1.3.0/components/geometry.html @@ -1173,7 +1173,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide an appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/1.3.0/components/gltf-model.html b/docs/1.3.0/components/gltf-model.html index 90f92b8df..f7e412a0b 100644 --- a/docs/1.3.0/components/gltf-model.html +++ b/docs/1.3.0/components/gltf-model.html @@ -1181,7 +1181,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/1.3.0/components/light.html b/docs/1.3.0/components/light.html index ef4e2b217..a123fcae5 100644 --- a/docs/1.3.0/components/light.html +++ b/docs/1.3.0/components/light.html @@ -1184,7 +1184,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/1.3.0/components/material.html b/docs/1.3.0/components/material.html index 6f08a7b33..587bc4a5c 100644 --- a/docs/1.3.0/components/material.html +++ b/docs/1.3.0/components/material.html @@ -1174,7 +1174,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/1.3.0/components/text.html b/docs/1.3.0/components/text.html index eb34a7c9e..d446f56ac 100644 --- a/docs/1.3.0/components/text.html +++ b/docs/1.3.0/components/text.html @@ -1171,7 +1171,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handle diff --git a/docs/1.3.0/core/asset-management-system.html b/docs/1.3.0/core/asset-management-system.html index b0d4c5fc8..5b02ad226 100644 --- a/docs/1.3.0/core/asset-management-system.html +++ b/docs/1.3.0/core/asset-management-system.html @@ -1187,7 +1187,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/1.3.0/core/component.html b/docs/1.3.0/core/component.html index 33768bf1d..73c425d33 100644 --- a/docs/1.3.0/core/component.html +++ b/docs/1.3.0/core/component.html @@ -1183,7 +1183,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/1.3.0/core/entity.html b/docs/1.3.0/core/entity.html index 3198cd75c..66a6e6943 100644 --- a/docs/1.3.0/core/entity.html +++ b/docs/1.3.0/core/entity.html @@ -1175,7 +1175,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/1.3.0/core/mixins.html b/docs/1.3.0/core/mixins.html index b793396c7..f846d9026 100644 --- a/docs/1.3.0/core/mixins.html +++ b/docs/1.3.0/core/mixins.html @@ -1181,7 +1181,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/1.3.0/core/scene.html b/docs/1.3.0/core/scene.html index 650a739a8..6f9258a9e 100644 --- a/docs/1.3.0/core/scene.html +++ b/docs/1.3.0/core/scene.html @@ -1183,7 +1183,7 @@

  • Add UI to Enter VR that calls WebVR API
  • Configure WebXR devices through the webxr system
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/1.3.0/core/systems.html b/docs/1.3.0/core/systems.html index 5003bf97d..061d0e691 100644 --- a/docs/1.3.0/core/systems.html +++ b/docs/1.3.0/core/systems.html @@ -1176,7 +1176,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/1.3.0/core/utils.html b/docs/1.3.0/core/utils.html index 6668071b5..97115f482 100644 --- a/docs/1.3.0/core/utils.html +++ b/docs/1.3.0/core/utils.html @@ -1170,7 +1170,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/1.3.0/guides/building-a-360-image-gallery.html b/docs/1.3.0/guides/building-a-360-image-gallery.html index 0f76eb598..f4322f4bf 100644 --- a/docs/1.3.0/guides/building-a-360-image-gallery.html +++ b/docs/1.3.0/guides/building-a-360-image-gallery.html @@ -1181,7 +1181,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene. We can also remix the Glitch.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/1.3.0/guides/building-a-basic-scene.html b/docs/1.3.0/guides/building-a-basic-scene.html index d44d53e76..bb37cd8c1 100644 --- a/docs/1.3.0/guides/building-a-basic-scene.html +++ b/docs/1.3.0/guides/building-a-basic-scene.html @@ -1182,7 +1182,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/1.3.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/1.3.0/guides/building-a-minecraft-demo.html b/docs/1.3.0/guides/building-a-minecraft-demo.html index 0ad74e417..d2fb8e26c 100644 --- a/docs/1.3.0/guides/building-a-minecraft-demo.html +++ b/docs/1.3.0/guides/building-a-minecraft-demo.html @@ -1175,7 +1175,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/1.3.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/1.3.0/introduction/entity-component-system.html b/docs/1.3.0/introduction/entity-component-system.html index f53d56d68..c1dc27b87 100644 --- a/docs/1.3.0/introduction/entity-component-system.html +++ b/docs/1.3.0/introduction/entity-component-system.html @@ -1198,7 +1198,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/1.3.0/introduction/faq.html b/docs/1.3.0/introduction/faq.html index 1f5032462..7e241f0ef 100644 --- a/docs/1.3.0/introduction/faq.html +++ b/docs/1.3.0/introduction/faq.html @@ -1169,7 +1169,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/1.3.0/introduction/hosting-and-publishing.html b/docs/1.3.0/introduction/hosting-and-publishing.html index e26b220e3..6d36a9934 100644 --- a/docs/1.3.0/introduction/hosting-and-publishing.html +++ b/docs/1.3.0/introduction/hosting-and-publishing.html @@ -1171,7 +1171,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/1.3.0/introduction/html-and-primitives.html b/docs/1.3.0/introduction/html-and-primitives.html index 64ad3be3f..2593d6397 100644 --- a/docs/1.3.0/introduction/html-and-primitives.html +++ b/docs/1.3.0/introduction/html-and-primitives.html @@ -1173,7 +1173,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/1.3.0/introduction/installation.html b/docs/1.3.0/introduction/installation.html index 000923dfb..0aa0c0b95 100644 --- a/docs/1.3.0/introduction/installation.html +++ b/docs/1.3.0/introduction/installation.html @@ -1172,7 +1172,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/1.3.0/introduction/interactions-and-controllers.html b/docs/1.3.0/introduction/interactions-and-controllers.html index c0e8a9ac7..883c96c7a 100644 --- a/docs/1.3.0/introduction/interactions-and-controllers.html +++ b/docs/1.3.0/introduction/interactions-and-controllers.html @@ -1180,7 +1180,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/1.3.0/introduction/javascript-events-dom-apis.html b/docs/1.3.0/introduction/javascript-events-dom-apis.html index 791032a28..a75dc8581 100644 --- a/docs/1.3.0/introduction/javascript-events-dom-apis.html +++ b/docs/1.3.0/introduction/javascript-events-dom-apis.html @@ -1176,7 +1176,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/1.3.0/introduction/visual-inspector-and-dev-tools.html b/docs/1.3.0/introduction/visual-inspector-and-dev-tools.html index 3d7db048f..276f851d9 100644 --- a/docs/1.3.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/1.3.0/introduction/visual-inspector-and-dev-tools.html @@ -1184,7 +1184,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/1.3.0/introduction/vr-headsets-and-webxr-browsers.html b/docs/1.3.0/introduction/vr-headsets-and-webxr-browsers.html index 2f68f8e17..c5d3cc051 100644 --- a/docs/1.3.0/introduction/vr-headsets-and-webxr-browsers.html +++ b/docs/1.3.0/introduction/vr-headsets-and-webxr-browsers.html @@ -1169,7 +1169,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/1.4.0/components/animation.html b/docs/1.4.0/components/animation.html index bf7656dbe..056b9dcd5 100644 --- a/docs/1.4.0/components/animation.html +++ b/docs/1.4.0/components/animation.html @@ -1188,7 +1188,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/1.4.0/components/geometry.html b/docs/1.4.0/components/geometry.html index 43b76cd32..dd686243a 100644 --- a/docs/1.4.0/components/geometry.html +++ b/docs/1.4.0/components/geometry.html @@ -1173,7 +1173,7 @@

    property defines the general shape. Geometric primitives, in computer graphics, are irreducible basic shapes. A material component is commonly defined to provide an appearance alongside the shape to create a complete mesh.

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/1.4.0/components/gltf-model.html b/docs/1.4.0/components/gltf-model.html index ae04dc22d..d06d6f71c 100644 --- a/docs/1.4.0/components/gltf-model.html +++ b/docs/1.4.0/components/gltf-model.html @@ -1181,7 +1181,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/1.4.0/components/light.html b/docs/1.4.0/components/light.html index f86214d50..9bb078793 100644 --- a/docs/1.4.0/components/light.html +++ b/docs/1.4.0/components/light.html @@ -1184,7 +1184,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/1.4.0/components/material.html b/docs/1.4.0/components/material.html index d6fd0b3fb..c0cfb6e77 100644 --- a/docs/1.4.0/components/material.html +++ b/docs/1.4.0/components/material.html @@ -1174,7 +1174,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/1.4.0/components/text.html b/docs/1.4.0/components/text.html index 1616231e0..dad6af7e3 100644 --- a/docs/1.4.0/components/text.html +++ b/docs/1.4.0/components/text.html @@ -1171,7 +1171,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handle diff --git a/docs/1.4.0/core/asset-management-system.html b/docs/1.4.0/core/asset-management-system.html index eb8a2bd64..0968941d3 100644 --- a/docs/1.4.0/core/asset-management-system.html +++ b/docs/1.4.0/core/asset-management-system.html @@ -1187,7 +1187,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/1.4.0/core/component.html b/docs/1.4.0/core/component.html index 8dcefafcf..1f3bd633d 100644 --- a/docs/1.4.0/core/component.html +++ b/docs/1.4.0/core/component.html @@ -1183,7 +1183,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/1.4.0/core/entity.html b/docs/1.4.0/core/entity.html index faef7ea42..e158adb04 100644 --- a/docs/1.4.0/core/entity.html +++ b/docs/1.4.0/core/entity.html @@ -1175,7 +1175,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/1.4.0/core/mixins.html b/docs/1.4.0/core/mixins.html index 8cb184a06..127a128e3 100644 --- a/docs/1.4.0/core/mixins.html +++ b/docs/1.4.0/core/mixins.html @@ -1181,7 +1181,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/1.4.0/core/scene.html b/docs/1.4.0/core/scene.html index fb4e4e94d..53a1e6772 100644 --- a/docs/1.4.0/core/scene.html +++ b/docs/1.4.0/core/scene.html @@ -1183,7 +1183,7 @@

  • Add UI to Enter VR that calls WebVR API
  • Configure WebXR devices through the webxr system
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/1.4.0/core/systems.html b/docs/1.4.0/core/systems.html index 56ae5e6d7..a485dc6dc 100644 --- a/docs/1.4.0/core/systems.html +++ b/docs/1.4.0/core/systems.html @@ -1176,7 +1176,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/1.4.0/core/utils.html b/docs/1.4.0/core/utils.html index 1722d27a4..4a105abdf 100644 --- a/docs/1.4.0/core/utils.html +++ b/docs/1.4.0/core/utils.html @@ -1170,7 +1170,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/1.4.0/guides/building-a-360-image-gallery.html b/docs/1.4.0/guides/building-a-360-image-gallery.html index 4557b086e..777f4b38e 100644 --- a/docs/1.4.0/guides/building-a-360-image-gallery.html +++ b/docs/1.4.0/guides/building-a-360-image-gallery.html @@ -1181,7 +1181,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene. We can also remix the Glitch.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/1.4.0/guides/building-a-basic-scene.html b/docs/1.4.0/guides/building-a-basic-scene.html index e60367afe..dc5687c6e 100644 --- a/docs/1.4.0/guides/building-a-basic-scene.html +++ b/docs/1.4.0/guides/building-a-basic-scene.html @@ -1182,7 +1182,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/1.4.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/1.4.0/guides/building-a-minecraft-demo.html b/docs/1.4.0/guides/building-a-minecraft-demo.html index b04b99eb8..89c4579bc 100644 --- a/docs/1.4.0/guides/building-a-minecraft-demo.html +++ b/docs/1.4.0/guides/building-a-minecraft-demo.html @@ -1175,7 +1175,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/1.4.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/1.4.0/introduction/entity-component-system.html b/docs/1.4.0/introduction/entity-component-system.html index 7002bcf84..f8075cbd5 100644 --- a/docs/1.4.0/introduction/entity-component-system.html +++ b/docs/1.4.0/introduction/entity-component-system.html @@ -1198,7 +1198,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/1.4.0/introduction/faq.html b/docs/1.4.0/introduction/faq.html index 8cb9bc9c9..e96bbdbfe 100644 --- a/docs/1.4.0/introduction/faq.html +++ b/docs/1.4.0/introduction/faq.html @@ -1169,7 +1169,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/1.4.0/introduction/hosting-and-publishing.html b/docs/1.4.0/introduction/hosting-and-publishing.html index 88f50c39f..de24b1198 100644 --- a/docs/1.4.0/introduction/hosting-and-publishing.html +++ b/docs/1.4.0/introduction/hosting-and-publishing.html @@ -1171,7 +1171,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/1.4.0/introduction/html-and-primitives.html b/docs/1.4.0/introduction/html-and-primitives.html index 09d3060c5..cc5defd87 100644 --- a/docs/1.4.0/introduction/html-and-primitives.html +++ b/docs/1.4.0/introduction/html-and-primitives.html @@ -1173,7 +1173,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/1.4.0/introduction/installation.html b/docs/1.4.0/introduction/installation.html index a7298c580..b0e8a725b 100644 --- a/docs/1.4.0/introduction/installation.html +++ b/docs/1.4.0/introduction/installation.html @@ -1172,7 +1172,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/1.4.0/introduction/interactions-and-controllers.html b/docs/1.4.0/introduction/interactions-and-controllers.html index 6712e042b..07be91417 100644 --- a/docs/1.4.0/introduction/interactions-and-controllers.html +++ b/docs/1.4.0/introduction/interactions-and-controllers.html @@ -1180,7 +1180,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/1.4.0/introduction/javascript-events-dom-apis.html b/docs/1.4.0/introduction/javascript-events-dom-apis.html index 591478a2a..8970ad034 100644 --- a/docs/1.4.0/introduction/javascript-events-dom-apis.html +++ b/docs/1.4.0/introduction/javascript-events-dom-apis.html @@ -1176,7 +1176,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/1.4.0/introduction/visual-inspector-and-dev-tools.html b/docs/1.4.0/introduction/visual-inspector-and-dev-tools.html index c0f84952e..b5f514c67 100644 --- a/docs/1.4.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/1.4.0/introduction/visual-inspector-and-dev-tools.html @@ -1184,7 +1184,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/1.4.0/introduction/vr-headsets-and-webxr-browsers.html b/docs/1.4.0/introduction/vr-headsets-and-webxr-browsers.html index fc2480df7..c6cfe47be 100644 --- a/docs/1.4.0/introduction/vr-headsets-and-webxr-browsers.html +++ b/docs/1.4.0/introduction/vr-headsets-and-webxr-browsers.html @@ -1169,7 +1169,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/1.5.0/components/animation.html b/docs/1.5.0/components/animation.html index fae60000a..2962bfb9e 100644 --- a/docs/1.5.0/components/animation.html +++ b/docs/1.5.0/components/animation.html @@ -1202,7 +1202,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/1.5.0/components/geometry.html b/docs/1.5.0/components/geometry.html index 17e70bb38..faffb3d4c 100644 --- a/docs/1.5.0/components/geometry.html +++ b/docs/1.5.0/components/geometry.html @@ -1189,7 +1189,7 @@

    provide an appearance alongside the shape to create a complete mesh.

    Overview of available geometries: all-available-a-frame-geometries

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/1.5.0/components/gltf-model.html b/docs/1.5.0/components/gltf-model.html index 64b9d4ca1..c6eac667b 100644 --- a/docs/1.5.0/components/gltf-model.html +++ b/docs/1.5.0/components/gltf-model.html @@ -1195,7 +1195,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/1.5.0/components/light.html b/docs/1.5.0/components/light.html index f6eb6e869..fc9fa4d47 100644 --- a/docs/1.5.0/components/light.html +++ b/docs/1.5.0/components/light.html @@ -1198,7 +1198,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/1.5.0/components/material.html b/docs/1.5.0/components/material.html index 5369cdbfe..56d46fdba 100644 --- a/docs/1.5.0/components/material.html +++ b/docs/1.5.0/components/material.html @@ -1188,7 +1188,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/1.5.0/components/text.html b/docs/1.5.0/components/text.html index b7215b0b8..bb87e973f 100644 --- a/docs/1.5.0/components/text.html +++ b/docs/1.5.0/components/text.html @@ -1185,7 +1185,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handle diff --git a/docs/1.5.0/core/asset-management-system.html b/docs/1.5.0/core/asset-management-system.html index 0ab82d22c..8c0046931 100644 --- a/docs/1.5.0/core/asset-management-system.html +++ b/docs/1.5.0/core/asset-management-system.html @@ -1201,7 +1201,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/1.5.0/core/component.html b/docs/1.5.0/core/component.html index 463cf13b9..e4fd7b414 100644 --- a/docs/1.5.0/core/component.html +++ b/docs/1.5.0/core/component.html @@ -1197,7 +1197,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/1.5.0/core/entity.html b/docs/1.5.0/core/entity.html index e7b43a63f..4c84ce019 100644 --- a/docs/1.5.0/core/entity.html +++ b/docs/1.5.0/core/entity.html @@ -1189,7 +1189,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/1.5.0/core/mixins.html b/docs/1.5.0/core/mixins.html index 36735c418..d00d1772e 100644 --- a/docs/1.5.0/core/mixins.html +++ b/docs/1.5.0/core/mixins.html @@ -1195,7 +1195,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/1.5.0/core/scene.html b/docs/1.5.0/core/scene.html index 8e88e6132..7d1c3246f 100644 --- a/docs/1.5.0/core/scene.html +++ b/docs/1.5.0/core/scene.html @@ -1197,7 +1197,7 @@

  • Add UI to Enter VR that calls WebVR API
  • Configure WebXR devices through the webxr system
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/1.5.0/core/systems.html b/docs/1.5.0/core/systems.html index 181bd0825..ef725d0d8 100644 --- a/docs/1.5.0/core/systems.html +++ b/docs/1.5.0/core/systems.html @@ -1190,7 +1190,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/1.5.0/core/utils.html b/docs/1.5.0/core/utils.html index 4ac521f01..7d2a93794 100644 --- a/docs/1.5.0/core/utils.html +++ b/docs/1.5.0/core/utils.html @@ -1184,7 +1184,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/1.5.0/guides/building-a-360-image-gallery.html b/docs/1.5.0/guides/building-a-360-image-gallery.html index ec2f1fc5d..53b725a6b 100644 --- a/docs/1.5.0/guides/building-a-360-image-gallery.html +++ b/docs/1.5.0/guides/building-a-360-image-gallery.html @@ -1195,7 +1195,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/1.5.0/guides/building-a-basic-scene.html b/docs/1.5.0/guides/building-a-basic-scene.html index 39ebb982b..b64e495c3 100644 --- a/docs/1.5.0/guides/building-a-basic-scene.html +++ b/docs/1.5.0/guides/building-a-basic-scene.html @@ -1196,7 +1196,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/1.5.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/1.5.0/guides/building-a-minecraft-demo.html b/docs/1.5.0/guides/building-a-minecraft-demo.html index 9a13a57ef..066628cc0 100644 --- a/docs/1.5.0/guides/building-a-minecraft-demo.html +++ b/docs/1.5.0/guides/building-a-minecraft-demo.html @@ -1189,7 +1189,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Quest, Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/1.5.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/1.5.0/introduction/entity-component-system.html b/docs/1.5.0/introduction/entity-component-system.html index 2da802463..926c0db8d 100644 --- a/docs/1.5.0/introduction/entity-component-system.html +++ b/docs/1.5.0/introduction/entity-component-system.html @@ -1212,7 +1212,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/1.5.0/introduction/faq.html b/docs/1.5.0/introduction/faq.html index 6f5580b60..41b0af79d 100644 --- a/docs/1.5.0/introduction/faq.html +++ b/docs/1.5.0/introduction/faq.html @@ -1183,7 +1183,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/1.5.0/introduction/hosting-and-publishing.html b/docs/1.5.0/introduction/hosting-and-publishing.html index c4fbf8959..6606d5e9c 100644 --- a/docs/1.5.0/introduction/hosting-and-publishing.html +++ b/docs/1.5.0/introduction/hosting-and-publishing.html @@ -1185,7 +1185,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/1.5.0/introduction/html-and-primitives.html b/docs/1.5.0/introduction/html-and-primitives.html index b63ef8fd4..34cd0ff1c 100644 --- a/docs/1.5.0/introduction/html-and-primitives.html +++ b/docs/1.5.0/introduction/html-and-primitives.html @@ -1187,7 +1187,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/1.5.0/introduction/installation.html b/docs/1.5.0/introduction/installation.html index 0ae0c551e..bfb5e20c5 100644 --- a/docs/1.5.0/introduction/installation.html +++ b/docs/1.5.0/introduction/installation.html @@ -1186,7 +1186,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/1.5.0/introduction/interactions-and-controllers.html b/docs/1.5.0/introduction/interactions-and-controllers.html index 114edde7c..f3425c8d2 100644 --- a/docs/1.5.0/introduction/interactions-and-controllers.html +++ b/docs/1.5.0/introduction/interactions-and-controllers.html @@ -1194,7 +1194,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/1.5.0/introduction/javascript-events-dom-apis.html b/docs/1.5.0/introduction/javascript-events-dom-apis.html index ea5532cf9..04357b7e2 100644 --- a/docs/1.5.0/introduction/javascript-events-dom-apis.html +++ b/docs/1.5.0/introduction/javascript-events-dom-apis.html @@ -1190,7 +1190,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/1.5.0/introduction/visual-inspector-and-dev-tools.html b/docs/1.5.0/introduction/visual-inspector-and-dev-tools.html index 511460e41..9c9553e05 100644 --- a/docs/1.5.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/1.5.0/introduction/visual-inspector-and-dev-tools.html @@ -1198,7 +1198,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/1.5.0/introduction/vr-headsets-and-webxr-browsers.html b/docs/1.5.0/introduction/vr-headsets-and-webxr-browsers.html index 32296f085..55c7e18fb 100644 --- a/docs/1.5.0/introduction/vr-headsets-and-webxr-browsers.html +++ b/docs/1.5.0/introduction/vr-headsets-and-webxr-browsers.html @@ -1183,7 +1183,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/1.6.0/components/animation.html b/docs/1.6.0/components/animation.html index aa93603a3..96f84e51b 100644 --- a/docs/1.6.0/components/animation.html +++ b/docs/1.6.0/components/animation.html @@ -1204,7 +1204,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/1.6.0/components/geometry.html b/docs/1.6.0/components/geometry.html index 4ce592953..8ec415d46 100644 --- a/docs/1.6.0/components/geometry.html +++ b/docs/1.6.0/components/geometry.html @@ -1191,7 +1191,7 @@

    provide an appearance alongside the shape to create a complete mesh.

    Overview of available geometries: all-available-a-frame-geometries

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/1.6.0/components/gltf-model.html b/docs/1.6.0/components/gltf-model.html index af7e07765..950ff0602 100644 --- a/docs/1.6.0/components/gltf-model.html +++ b/docs/1.6.0/components/gltf-model.html @@ -1197,7 +1197,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/1.6.0/components/light.html b/docs/1.6.0/components/light.html index 40c3d69e1..8384149f8 100644 --- a/docs/1.6.0/components/light.html +++ b/docs/1.6.0/components/light.html @@ -1200,7 +1200,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/1.6.0/components/material.html b/docs/1.6.0/components/material.html index 7fcc48292..b9d253e42 100644 --- a/docs/1.6.0/components/material.html +++ b/docs/1.6.0/components/material.html @@ -1190,7 +1190,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/1.6.0/components/text.html b/docs/1.6.0/components/text.html index 1fd38fa46..acb945ff0 100644 --- a/docs/1.6.0/components/text.html +++ b/docs/1.6.0/components/text.html @@ -1187,7 +1187,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handle diff --git a/docs/1.6.0/core/asset-management-system.html b/docs/1.6.0/core/asset-management-system.html index 7cd737108..1d62bd335 100644 --- a/docs/1.6.0/core/asset-management-system.html +++ b/docs/1.6.0/core/asset-management-system.html @@ -1203,7 +1203,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/1.6.0/core/component.html b/docs/1.6.0/core/component.html index a1321e1db..abcc68e18 100644 --- a/docs/1.6.0/core/component.html +++ b/docs/1.6.0/core/component.html @@ -1199,7 +1199,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/1.6.0/core/entity.html b/docs/1.6.0/core/entity.html index 6f0a8fa9c..81a2a41b2 100644 --- a/docs/1.6.0/core/entity.html +++ b/docs/1.6.0/core/entity.html @@ -1191,7 +1191,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/1.6.0/core/mixins.html b/docs/1.6.0/core/mixins.html index 561ef948a..852228343 100644 --- a/docs/1.6.0/core/mixins.html +++ b/docs/1.6.0/core/mixins.html @@ -1197,7 +1197,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/1.6.0/core/scene.html b/docs/1.6.0/core/scene.html index 22f3cca3d..938229bfd 100644 --- a/docs/1.6.0/core/scene.html +++ b/docs/1.6.0/core/scene.html @@ -1199,7 +1199,7 @@

  • Add UI to Enter VR that calls WebVR API
  • Configure WebXR devices through the webxr system
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/1.6.0/core/systems.html b/docs/1.6.0/core/systems.html index 977dac5b6..793bcfd35 100644 --- a/docs/1.6.0/core/systems.html +++ b/docs/1.6.0/core/systems.html @@ -1192,7 +1192,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/1.6.0/core/utils.html b/docs/1.6.0/core/utils.html index 36f0be98b..141019285 100644 --- a/docs/1.6.0/core/utils.html +++ b/docs/1.6.0/core/utils.html @@ -1186,7 +1186,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/1.6.0/guides/building-a-360-image-gallery.html b/docs/1.6.0/guides/building-a-360-image-gallery.html index f2d478641..dab2dd631 100644 --- a/docs/1.6.0/guides/building-a-360-image-gallery.html +++ b/docs/1.6.0/guides/building-a-360-image-gallery.html @@ -1197,7 +1197,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/1.6.0/guides/building-a-basic-scene.html b/docs/1.6.0/guides/building-a-basic-scene.html index be67d7ff6..110909277 100644 --- a/docs/1.6.0/guides/building-a-basic-scene.html +++ b/docs/1.6.0/guides/building-a-basic-scene.html @@ -1198,7 +1198,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/1.6.0/guides/building-a-minecraft-demo.html b/docs/1.6.0/guides/building-a-minecraft-demo.html index 846748b15..4f1dffa47 100644 --- a/docs/1.6.0/guides/building-a-minecraft-demo.html +++ b/docs/1.6.0/guides/building-a-minecraft-demo.html @@ -1191,7 +1191,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Quest, Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/1.6.0/introduction/entity-component-system.html b/docs/1.6.0/introduction/entity-component-system.html index 6170a830f..9e4b3cd14 100644 --- a/docs/1.6.0/introduction/entity-component-system.html +++ b/docs/1.6.0/introduction/entity-component-system.html @@ -1214,7 +1214,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/1.6.0/introduction/faq.html b/docs/1.6.0/introduction/faq.html index 0c07ab72b..c189ec683 100644 --- a/docs/1.6.0/introduction/faq.html +++ b/docs/1.6.0/introduction/faq.html @@ -1185,7 +1185,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/1.6.0/introduction/hosting-and-publishing.html b/docs/1.6.0/introduction/hosting-and-publishing.html index f009bce25..a1419af84 100644 --- a/docs/1.6.0/introduction/hosting-and-publishing.html +++ b/docs/1.6.0/introduction/hosting-and-publishing.html @@ -1187,7 +1187,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/1.6.0/introduction/html-and-primitives.html b/docs/1.6.0/introduction/html-and-primitives.html index 08d37086a..a2b160b18 100644 --- a/docs/1.6.0/introduction/html-and-primitives.html +++ b/docs/1.6.0/introduction/html-and-primitives.html @@ -1189,7 +1189,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/1.6.0/introduction/installation.html b/docs/1.6.0/introduction/installation.html index 1c3eeee6a..696277015 100644 --- a/docs/1.6.0/introduction/installation.html +++ b/docs/1.6.0/introduction/installation.html @@ -1188,7 +1188,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/1.6.0/introduction/interactions-and-controllers.html b/docs/1.6.0/introduction/interactions-and-controllers.html index e77851176..efaa225d9 100644 --- a/docs/1.6.0/introduction/interactions-and-controllers.html +++ b/docs/1.6.0/introduction/interactions-and-controllers.html @@ -1196,7 +1196,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/1.6.0/introduction/javascript-events-dom-apis.html b/docs/1.6.0/introduction/javascript-events-dom-apis.html index 27b55c800..b33c8fd10 100644 --- a/docs/1.6.0/introduction/javascript-events-dom-apis.html +++ b/docs/1.6.0/introduction/javascript-events-dom-apis.html @@ -1192,7 +1192,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/1.6.0/introduction/visual-inspector-and-dev-tools.html b/docs/1.6.0/introduction/visual-inspector-and-dev-tools.html index 3a763af16..19a30bb7e 100644 --- a/docs/1.6.0/introduction/visual-inspector-and-dev-tools.html +++ b/docs/1.6.0/introduction/visual-inspector-and-dev-tools.html @@ -1200,7 +1200,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/1.6.0/introduction/vr-headsets-and-webxr-browsers.html b/docs/1.6.0/introduction/vr-headsets-and-webxr-browsers.html index 53aad4e59..c441ec782 100644 --- a/docs/1.6.0/introduction/vr-headsets-and-webxr-browsers.html +++ b/docs/1.6.0/introduction/vr-headsets-and-webxr-browsers.html @@ -1185,7 +1185,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put diff --git a/docs/master/components/animation.html b/docs/master/components/animation.html index 7183bb721..4a9f93007 100644 --- a/docs/master/components/animation.html +++ b/docs/master/components/animation.html @@ -1209,7 +1209,7 @@

    Read more below for additional options and discovering how to properly animate different types of values.

    - +

    API

    Properties

    diff --git a/docs/master/components/geometry.html b/docs/master/components/geometry.html index 270be991e..33d41e8d4 100644 --- a/docs/master/components/geometry.html +++ b/docs/master/components/geometry.html @@ -1196,7 +1196,7 @@

    provide an appearance alongside the shape to create a complete mesh.

    Overview of available geometries: all-available-a-frame-geometries

    - +

    Base Properties

    Every geometry type will have these properties:

    diff --git a/docs/master/components/gltf-model.html b/docs/master/components/gltf-model.html index bc22047ff..30ab1ec5e 100644 --- a/docs/master/components/gltf-model.html +++ b/docs/master/components/gltf-model.html @@ -1202,7 +1202,7 @@

    NOTE: A-Frame supports glTF 2.0. For models using older versions of the glTF format, use gltf-model-legacy from donmccurdy/aframe-extras.

    - +

    Why use glTF?

    In comparison to the older OBJ format, which supports only vertices, normals, texture coordinates, and basic materials, glTF provides a diff --git a/docs/master/components/light.html b/docs/master/components/light.html index d9840bd78..55fd30602 100644 --- a/docs/master/components/light.html +++ b/docs/master/components/light.html @@ -1205,7 +1205,7 @@

    To manually disable the defaults, without adding other lights:

    <a-scene light="defaultLightsEnabled: false">
      <!-- ... -->
    </a-scene>
    - +

    Properties

    All light types support a few basic properties:

    diff --git a/docs/master/components/material.html b/docs/master/components/material.html index 53662ec6c..0aa42867e 100644 --- a/docs/master/components/material.html +++ b/docs/master/components/material.html @@ -1195,7 +1195,7 @@

    component which provides shape.

    We can register custom materials to extend the material component to provide a wide range of visual effects.

    - +

    Example

    Defining a red material using the default standard material:

    <a-entity geometry="primitive: box" material="color: red"></a-entity>
    diff --git a/docs/master/components/text.html b/docs/master/components/text.html index ce2e225b8..4f81b4654 100644 --- a/docs/master/components/text.html +++ b/docs/master/components/text.html @@ -1192,7 +1192,7 @@

    The text component renders signed distance field (SDF) font text.

    Example Image

    - +

    Introduction

    Note that rendering text in 3D is hard. In 2D web development, text is the most basic thing because the browser’s renderer and layout engine handle diff --git a/docs/master/core/asset-management-system.html b/docs/master/core/asset-management-system.html index e91c81151..7060770bf 100644 --- a/docs/master/core/asset-management-system.html +++ b/docs/master/core/asset-management-system.html @@ -1208,7 +1208,7 @@

    The scene won’t render or initialize until the browser fetches (or errors out) all the assets or the asset system reaches the timeout.

    - +

    Example

    We can define our assets in <a-assets> and point to those assets from our entities using selectors:

    diff --git a/docs/master/core/component.html b/docs/master/core/component.html index 21c3653c2..9baa51217 100644 --- a/docs/master/core/component.html +++ b/docs/master/core/component.html @@ -1204,7 +1204,7 @@

    Components are roughly analogous to CSS. Like how CSS rules modify the appearance of elements, component properties modify the appearance, behavior, and functionality of entities.

    - +

    Component HTML Form

    A component holds a bucket of data in the form of one or more component properties. Components use this data to modify entities. Consider an engine diff --git a/docs/master/core/entity.html b/docs/master/core/entity.html index 005259736..5c95b826f 100644 --- a/docs/master/core/entity.html +++ b/docs/master/core/entity.html @@ -1196,7 +1196,7 @@

    functionality.

    In A-Frame, entities are inherently attached with the position, rotation, and scale components.

    - +

    Example

    Consider the entity below. By itself, it has no appearance, behavior, or functionality. It does nothing:

    diff --git a/docs/master/core/mixins.html b/docs/master/core/mixins.html index d53266b0b..a245f2cfb 100644 --- a/docs/master/core/mixins.html +++ b/docs/master/core/mixins.html @@ -1202,7 +1202,7 @@

    the entities above expand to:

    <a-entity material="color: red" geometry="primitive: box"></a-entity>
    <a-entity material="color: blue" geometry="primitive: box"></a-entity>
    - +

    Merging Component Properties

    Properties of a multi-property component will merge if defined by multiple mixins and/or the entity. For example:

    <a-scene>
      <a-assets>
        <a-mixin id="box" geometry="primitive: box"></a-mixin>
        <a-mixin id="tall" geometry="height: 10"></a-mixin>
        <a-mixin id="wide" geometry="width: 10"></a-mixin>
      </a-assets>

      <a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
    </a-scene>
    diff --git a/docs/master/core/scene.html b/docs/master/core/scene.html index 8cb73e844..d5dc3ead7 100644 --- a/docs/master/core/scene.html +++ b/docs/master/core/scene.html @@ -1204,7 +1204,7 @@

  • Add UI to Enter VR that calls WebVR API
  • Configure WebXR devices through the webxr system
    • - +

    Example

    <a-scene>
      <a-assets>
        <img id="texture" src="texture.png">
      </a-assets>

      <a-box src="#texture"></a-box>
    </a-scene>
    diff --git a/docs/master/core/systems.html b/docs/master/core/systems.html index 9da1d68b7..2373d4ab2 100644 --- a/docs/master/core/systems.html +++ b/docs/master/core/systems.html @@ -1197,7 +1197,7 @@

    scene.

    For example, the camera system manages all entities with the camera component, controlling which camera is the active camera.

    - +

    Registering a System

    A system is registered similarly to a component.

    If the system name matches a component name, then the component will have a diff --git a/docs/master/core/utils.html b/docs/master/core/utils.html index 1dd3e82b5..4cfb08cfc 100644 --- a/docs/master/core/utils.html +++ b/docs/master/core/utils.html @@ -1191,7 +1191,7 @@

    A-Frame’s utility modules are public through AFRAME.utils.

    - +

    AFRAME.utils.coordinates

    Module for handling vec3 and vec4 types.

    .isCoordinates (value)

    Tests whether a string is a vec3 or vec4.

    diff --git a/docs/master/guides/building-a-360-image-gallery.html b/docs/master/guides/building-a-360-image-gallery.html index bd353c2fb..ea405da02 100644 --- a/docs/master/guides/building-a-360-image-gallery.html +++ b/docs/master/guides/building-a-360-image-gallery.html @@ -1202,7 +1202,7 @@

    Not to say 360° images are at all a focus use case of A-Frame, but it makes for an easy example that has a lot of demand as an early use case on the Web.

    - +

    Skeleton

    This is the starting point for our scene.

    <a-scene>
      <a-assets>
        <audio id="click-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"></audio>

        <!-- Images. -->
        <img id="city" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/city.jpg">
        <img id="city-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-city.jpg">
        <img id="cubes" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
        <img id="cubes-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
        <img id="sechelt" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
        <img id="sechelt-thumb" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-sechelt.jpg">
      </a-assets>

      <!-- 360-degree image. -->
      <a-sky id="image-360" radius="10" src="#city"></a-sky>

      <!-- Link template we will build. -->
      <a-entity class="link"></a-entity>

      <!-- Camera + Cursor. -->
      <a-camera>
        <a-cursor
          id="cursor"
          animation__click="property: scale; from: 0.1 0.1 0.1; to: 1 1 1; easing: easeInCubic; dur: 150; startEvents: click"
          animation__clickreset="property: scale; to: 0.1 0.1 0.1; dur: 1; startEvents: animationcomplete__click"
          animation__fusing="property: scale; from: 1 1 1; to: 0.1 0.1 0.1; easing: easeInCubic; dur: 150; startEvents: fusing"></a-cursor>
      </a-camera>
    </a-scene>
    diff --git a/docs/master/guides/building-a-basic-scene.html b/docs/master/guides/building-a-basic-scene.html index 66e8fdd4c..cc6887523 100644 --- a/docs/master/guides/building-a-basic-scene.html +++ b/docs/master/guides/building-a-basic-scene.html @@ -1203,7 +1203,7 @@

  • Add text

    • Remix the Basic Guide example on Glitch.

    - +

    Starting with HTML

    We start out with a minimal HTML structure:

    <html>
      <head>
        <script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script>
      </head>
      <body>
        <a-scene>
        </a-scene>
      </body>
    </html>
    diff --git a/docs/master/guides/building-a-minecraft-demo.html b/docs/master/guides/building-a-minecraft-demo.html index 5822ae0eb..93843abf8 100644 --- a/docs/master/guides/building-a-minecraft-demo.html +++ b/docs/master/guides/building-a-minecraft-demo.html @@ -1196,7 +1196,7 @@

    Let’s build a basic Minecraft (voxel builder) demo that targets room scale VR with controllers (e.g., Quest, Vive, Rift). The example will be minimally usable on mobile and desktop.

    - +

    Example Skeleton

    We’ll start off with this skeleton HTML:

    <script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script>

    <body>
      <a-scene>
      </a-scene>
    </body>
    diff --git a/docs/master/introduction/entity-component-system.html b/docs/master/introduction/entity-component-system.html index 37230a432..66e4aa410 100644 --- a/docs/master/introduction/entity-component-system.html +++ b/docs/master/introduction/entity-component-system.html @@ -1219,7 +1219,7 @@

    A well-known game engine implementing ECS is Unity. Although there are pain points in cross-entity communication, we’ll see how A-Frame, the DOM, and declarative HTML really make ECS shine.

    - +

    Concept

    ECS Minecraft

    A basic definition of ECS involves:

    diff --git a/docs/master/introduction/faq.html b/docs/master/introduction/faq.html index 90afae031..db8157658 100644 --- a/docs/master/introduction/faq.html +++ b/docs/master/introduction/faq.html @@ -1190,7 +1190,7 @@

    - +

    How is A-Frame’s performance?

    A-Frame can achieve native-like latency and framerate with proper browsers (e.g., Firefox with WebVR). For example, A-Painter is Tilt diff --git a/docs/master/introduction/hosting-and-publishing.html b/docs/master/introduction/hosting-and-publishing.html index 0e13671eb..7944b642d 100644 --- a/docs/master/introduction/hosting-and-publishing.html +++ b/docs/master/introduction/hosting-and-publishing.html @@ -1192,7 +1192,7 @@

    This section will show several ways to deploy, host, and publish an A-Frame site and its assets onto the Web for the world to see.

    - +

    Publishing a Site

    There are many free services to deploy and host a site. We’ll go over some of the more easy or popular options, but there are certainly other options such diff --git a/docs/master/introduction/html-and-primitives.html b/docs/master/introduction/html-and-primitives.html index 4b0d63d79..4c63e69e9 100644 --- a/docs/master/introduction/html-and-primitives.html +++ b/docs/master/introduction/html-and-primitives.html @@ -1194,7 +1194,7 @@

    their relation to the entity-component framework. If you’re looking for a guide on using HTML and primitives, check out the Building a Basic Scene guide.

    - +

    HTML

    A-Frame is based on top of HTML and the DOM using a polyfill for Custom Elements. HTML is the building block of the Web, providing one of the diff --git a/docs/master/introduction/installation.html b/docs/master/introduction/installation.html index 9b0ec4d29..9ae164a21 100644 --- a/docs/master/introduction/installation.html +++ b/docs/master/introduction/installation.html @@ -1193,7 +1193,7 @@

    This installation section offers several ways to get started with A-Frame, although most methods don’t require any actual installation since A-Frame is primarily HTML and JavaScript.

    - +

    Code Editors in the Browser

    The fastest way is to start playing from within the browser.

    Remix on Glitch

    Glitch

    diff --git a/docs/master/introduction/interactions-and-controllers.html b/docs/master/introduction/interactions-and-controllers.html index 96331b8a7..bb053b5fb 100644 --- a/docs/master/introduction/interactions-and-controllers.html +++ b/docs/master/introduction/interactions-and-controllers.html @@ -1201,7 +1201,7 @@

    interactions. And we can show how these input-based and interaction-based components are built in order to give us the knowledge to build our own interactions. In a sense, learn how to fish rather than being given a fish.

    - +

    Events

    In the 2D Web, input and interactions are handled through browser events (e.g., click, mouseenter, mouseleave, touchstart, diff --git a/docs/master/introduction/javascript-events-dom-apis.html b/docs/master/introduction/javascript-events-dom-apis.html index 84da1a261..2175e2a02 100644 --- a/docs/master/introduction/javascript-events-dom-apis.html +++ b/docs/master/introduction/javascript-events-dom-apis.html @@ -1197,7 +1197,7 @@

    Every element in the scene, even elements such as <a-box> or <a-sky>, are entities (represented as <a-entity>). A-Frame modifies the HTML element prototype to add some extra behavior for certain DOM APIs to tailor them to A-Frame. See the Entity API documentation for reference on most of the APIs discussed below.

    - +

    Where to Place JavaScript Code for A-Frame

    Important: Before we go over the different ways to use JavaScript and DOM APIs, we prescribe encapsulating your JavaScript code within A-Frame diff --git a/docs/master/introduction/visual-inspector-and-dev-tools.html b/docs/master/introduction/visual-inspector-and-dev-tools.html index ae9431777..223cc0add 100644 --- a/docs/master/introduction/visual-inspector-and-dev-tools.html +++ b/docs/master/introduction/visual-inspector-and-dev-tools.html @@ -1205,7 +1205,7 @@

    We’ll go over GUI tools built on top of A-Frame that can be used without code. And touch on other tools that can ease development across multiple machines.

    - +

    A-Frame Inspector

    The A-Frame Inspector is a visual tool for inspecting and tweaking scenes. With the Inspector, we can:

    diff --git a/docs/master/introduction/vr-headsets-and-webxr-browsers.html b/docs/master/introduction/vr-headsets-and-webxr-browsers.html index b297c1137..33616654b 100644 --- a/docs/master/introduction/vr-headsets-and-webxr-browsers.html +++ b/docs/master/introduction/vr-headsets-and-webxr-browsers.html @@ -1190,7 +1190,7 @@

    - +

    What is Virtual Reality?

    Virtual reality (VR) is a technology that uses head-mounted headsets with displays to generate the realistic images, sounds, and other sensations to put