npm - senangwebs-aframe-editor - Versions diffs - 1.6.5 - Mend

senangwebs-aframe-editor 1.6.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (104) hide show

package/.babelrc +3 -0
package/.editorconfig +12 -0
package/.eslintignore +2 -0
package/.eslintrc +40 -0
package/.github/workflows/ci.yml +39 -0
package/.husky/pre-commit +4 -0
package/.prettierignore +1 -0
package/.prettierrc.json +5 -0
package/.stylelintrc +12 -0
package/LICENSE +21 -0
package/README.md +75 -0
package/assets/gltf.svg +49 -0
package/dist/aframe-inspector.js +106250 -0
package/dist/aframe-inspector.js.map +1 -0
package/dist/aframe-inspector.min.js +29040 -0
package/dist/aframe-inspector.min.js.LICENSE.txt +56 -0
package/dist/aframe-inspector.min.js.map +1 -0
package/examples/360video.html +48 -0
package/examples/colors.html +18 -0
package/examples/controllers.html +60 -0
package/examples/embedded-zoom.html +78 -0
package/examples/embedded.html +79 -0
package/examples/empty.html +13 -0
package/examples/index-aframe.html +66 -0
package/examples/index.html +71 -0
package/examples/supercraft.html +6 -0
package/index.html +8 -0
package/package.json +84 -0
package/senangwebs-webverse-editor.png +0 -0
package/src/components/AwesomeIcon.js +53 -0
package/src/components/Collapsible.js +57 -0
package/src/components/EntityRepresentation.js +83 -0
package/src/components/Main.js +222 -0
package/src/components/__tests__/Collapsible.test.js +30 -0
package/src/components/components/AddComponent.js +104 -0
package/src/components/components/CommonComponents.js +160 -0
package/src/components/components/Component.js +151 -0
package/src/components/components/ComponentsContainer.js +52 -0
package/src/components/components/DefaultComponents.js +1 -0
package/src/components/components/Mixins.js +83 -0
package/src/components/components/PropertyRow.js +145 -0
package/src/components/components/Sidebar.js +51 -0
package/src/components/icons/BackViewIcon.js +27 -0
package/src/components/icons/BottomViewIcon.js +26 -0
package/src/components/icons/FrontViewIcon.js +23 -0
package/src/components/icons/LeftViewIcon.js +24 -0
package/src/components/icons/PerspectiveIcon.js +23 -0
package/src/components/icons/PrimitiveBoxIcon.js +143 -0
package/src/components/icons/PrimitiveConeIcon.js +44 -0
package/src/components/icons/PrimitiveCylinderIcon.js +51 -0
package/src/components/icons/PrimitiveEmptyEntityIcon.js +78 -0
package/src/components/icons/PrimitiveImageIcon.js +86 -0
package/src/components/icons/PrimitiveLightIcon.js +107 -0
package/src/components/icons/PrimitivePlaneIcon.js +87 -0
package/src/components/icons/PrimitiveSphereIcon.js +39 -0
package/src/components/icons/PrimitiveTextIcon.js +89 -0
package/src/components/icons/PrimitiveTorusIcon.js +31 -0
package/src/components/icons/RightViewIcon.js +24 -0
package/src/components/icons/TopViewIcon.js +24 -0
package/src/components/modals/Modal.js +107 -0
package/src/components/modals/ModalHelp.js +97 -0
package/src/components/modals/ModalPrimitive.js +114 -0
package/src/components/modals/ModalTextures.js +430 -0
package/src/components/scenegraph/Entity.js +142 -0
package/src/components/scenegraph/SceneGraph.js +337 -0
package/src/components/scenegraph/Toolbar.js +147 -0
package/src/components/viewport/CameraToolbar.js +122 -0
package/src/components/viewport/TransformToolbar.js +102 -0
package/src/components/viewport/ViewportHUD.js +33 -0
package/src/components/widgets/BooleanWidget.js +49 -0
package/src/components/widgets/ColorWidget.js +89 -0
package/src/components/widgets/InputWidget.js +42 -0
package/src/components/widgets/NumberWidget.js +179 -0
package/src/components/widgets/SelectWidget.js +58 -0
package/src/components/widgets/TextureWidget.js +252 -0
package/src/components/widgets/Vec2Widget.js +55 -0
package/src/components/widgets/Vec3Widget.js +58 -0
package/src/components/widgets/Vec4Widget.js +61 -0
package/src/components/widgets/index.js +9 -0
package/src/index.js +301 -0
package/src/lib/EditorControls.js +336 -0
package/src/lib/Events.js +6 -0
package/src/lib/TransformControls.js +1365 -0
package/src/lib/assetsLoader.js +43 -0
package/src/lib/assetsUtils.js +30 -0
package/src/lib/cameras.js +121 -0
package/src/lib/entity.js +556 -0
package/src/lib/history.js +30 -0
package/src/lib/raycaster.js +129 -0
package/src/lib/shortcuts.js +211 -0
package/src/lib/utils.js +118 -0
package/src/lib/viewport.js +268 -0
package/src/style/components.styl +275 -0
package/src/style/entity.styl +22 -0
package/src/style/help.styl +40 -0
package/src/style/index.styl +358 -0
package/src/style/lib.styl +41 -0
package/src/style/primitiveModal.styl +90 -0
package/src/style/scenegraph.styl +173 -0
package/src/style/select.styl +71 -0
package/src/style/textureModal.styl +220 -0
package/src/style/viewport.styl +168 -0
package/src/style/widgets.styl +71 -0
package/webpack.config.js +65 -0

package/examples/360video.html ADDED Viewed

@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>360 Video</title>
+    <meta name="description" content="360 Video — A-Frame">
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@master/dist/aframe-master.min.js"></script>
+    <!--
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@master/examples/js/play-on-click.js"></script>
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@master/examples/js/hide-on-play.js"></script>
+    -->
+  </head>
+  <body>
+    <a-scene>
+      <a-assets>
+        <!--
+        SOURCE
+        Author: Bitmovin
+        URL:    https://bitmovin.com/demos/vr-360
+        -->
+        <video id="video"
+               loop
+               crossorigin="anonymous"
+               playsinline webkit-playsinline
+               src="https://bitmovin-a.akamaihd.net/content/playhouse-vr/progressive.mp4">
+        </video>
+      </a-assets>
+      <a-videosphere
+        rotation="0 -90 0" src="#video"
+        play-on-click>
+      </a-videosphere>
+      <a-camera>
+        <a-entity
+          position="0 0 -1.5"
+          text="align:center;
+                width:6;
+                wrapCount:100;
+                color: white;
+                value: Click or tap to start video"
+          hide-on-play="#video">
+        </a-entity>
+      </a-camera>
+    </a-scene>
+    <script src="../dist/aframe-inspector.js"></script>
+  </body>
+</html>

package/examples/colors.html ADDED Viewed

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Example Scene</title>
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe/dist/aframe-master.min.js"></script>
+  </head>
+  <body>
+    <a-scene debug="true">
+      <a-entity id="hsl-green" geometry="primitive: box" material="color:hsl(120, 100%, 75%)" position="-4 1 0"></a-entity>
+      <a-entity id="rgb-yellow" geometry="primitive: box" material="color:rgb(255, 255, 0)" position="-2 1 0"></a-entity>
+      <a-entity id="hex3-red" geometry="primitive: box" material="color:#f00" position="0 1 0"></a-entity>
+      <a-entity id="hex6-red" geometry="primitive: box" material="color:#ff0000" position="2 1 0"></a-entity>
+      <a-entity id="string-blue" geometry="primitive: box" material="color:blue" position="4 1 0"></a-entity>
+    </a-scene>
+    <script src="../dist/aframe-inspector.js"></script>
+  </body>
+</html>

package/examples/controllers.html ADDED Viewed

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Controllers</title>
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe/dist/aframe-master.min.js"></script>
+    <script src="https://unpkg.com/aframe-environment-component@1.3.7/dist/aframe-environment-component.min.js"></script>
+    <script src="https://unpkg.com/aframe-teleport-controls@0.2.0/dist/aframe-teleport-controls.min.js"></script>
+    <script src="https://unpkg.com/aframe-event-set-component@3.0.3/dist/aframe-event-set-component.min.js"></script>
+  </head>
+  <body>
+    <a-scene>
+      <a-assets>
+        <a-mixin id="blue" material="color: #4CC3D9"></a-mixin>
+        <a-mixin id="box" geometry="primitive: box; depth: 1; height: 1; width: 1"></a-mixin>
+        <a-mixin id="cylinder" geometry="primitive: cylinder; height: 0.3; radius: 0.75; segmentsRadial: 6"></a-mixin>
+        <a-mixin id="green" material="color: #7BC8A4"></a-mixin>
+        <a-mixin id="orange" material="color: #F16745"></a-mixin>
+        <a-mixin id="purple" material="color: #93648D"></a-mixin>
+        <a-mixin id="short" scale="1 0.5 1"></a-mixin>
+        <a-mixin id="yellow" material="color: #FFC65D"></a-mixin>
+        <a-mixin id="interactable"
+          event-set__mouseenter="_event: mouseenter; material.opacity: 0.75"
+          event-set__mouseleave="_event: mouseleave; material.opacity: 1"
+          event-set__click="_event: click; scale: 1.1 1.1 1.1"></a-mixin>
+        <img id="crateImg" src="https://aframe.io/sample-assets/assets/images/wood/crate.gif" crossOrigin="true">
+        <img id="floorImg" src="https://aframe.io/sample-assets/assets/images/terrain/grasslight-big.jpg" crossOrigin="true">
+      </a-assets>
+      <a-entity id="environment" environment="preset: forest; fog: 0"></a-entity>
+      <!-- Meshes. -->
+      <a-entity position="0 0 -8">
+        <a-entity id="blueBox" mixin="interactable" geometry="primitive: box; depth: 2; height: 5; width: 1" material="color: #4CC3D9" position="0 8 0"></a-entity>
+        <a-entity id="shortOrangeBox" mixin="interactable short orange box" position="-5 2 0"></a-entity>
+        <a-entity id="shortYellowBox" mixin="interactable short yellow box" position="5 2 0"></a-entity>
+        <a-entity id="redBox" mixin="interactable" geometry="primitive: box" material="color: #F00" position="-4 1 0">
+          <a-animation attribute="rotation" to="0 360 0" repeat="indefinite" easing="linear" dur="9600"></a-animation>
+        </a-entity>
+        <a-entity id="yellowSphere" mixin="interactable" geometry="primitive: sphere" material="color:#ff0; metalness:0.0; roughness:1.0" position="-2 2 -2"></a-entity>
+        <a-box id="brickBox" mixin="interactable" src="https://aframe.io/sample-assets/assets/images/bricks/brick_bump.jpg" position="-5 5 -2" width="1" color="#F16745"></a-box>
+        <a-box id="box" mixin="interactable" position="0 2 0" height="2" color="#FFC65D"></a-box>
+        <!-- Models. -->
+        <a-entity mixin="interactable" class="boxClass" geometry="primitive: box" material="src: #crateImg" position="3 4 0"></a-entity>
+        <a-entity mixin="interactable" class="boxClass" geometry="primitive: box" material="color: #0f0" position="4 2 4"></a-entity>
+      </a-entity>
+      <!-- Lights. -->
+      <a-entity id="pointLight" light="type: point; intensity: 0.25" position="0 3 3"></a-entity>
+      <!-- Hands. -->
+      <a-entity id="rightHand" laser-controls="hand: right"></a-entity>
+      <a-entity id="leftHand" hand-controls="left" teleport-controls></a-entity>
+    </a-scene>
+    <script src="../dist/aframe-inspector.js"></script>
+  </body>
+</html>

package/examples/embedded-zoom.html ADDED Viewed

@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Inspector Test - Embedded (Bad)</title>
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe/dist/aframe-master.min.js"></script>
+    <style>
+      html,
+      body {
+        background: #111;
+        height: 100%;
+        width: 100%;
+      }
+      body {
+        align-items: center;
+        display: flex;
+        justify-content: center;
+      }
+    </style>
+  </head>
+  <body>
+    <div style="bottom: 0; left: 0; margin: 0 auto; right: 0; position: absolute; top: 0; width: 960px; zoom: 1.1">
+      <div style="height: 480px; width: 640px">
+        <a-scene embedded inspector="url: ../dist/aframe-inspector.js">
+          <a-assets>
+            <a-mixin id="blue" material="color: #4CC3D9"></a-mixin>
+            <a-mixin id="blueBox" geometry="primitive: box; depth: 2; height: 5; width: 1" material="color: #4CC3D9"></a-mixin>
+            <a-mixin id="box" geometry="primitive: box; depth: 1; height: 1; width: 1"></a-mixin>
+            <a-mixin id="cylinder" geometry="primitive: cylinder; height: 0.3; radius: 0.75; segmentsRadial: 6"></a-mixin>
+            <a-mixin id="green" material="color: #7BC8A4"></a-mixin>
+            <a-mixin id="orange" material="color: #F16745"></a-mixin>
+            <a-mixin id="purple" material="color: #93648D"></a-mixin>
+            <a-mixin id="short" scale="1 0.5 1"></a-mixin>
+            <a-mixin id="yellow" material="color: #FFC65D"></a-mixin>
+            <img id="crateImg" src="assets/textures/crate.gif">
+            <img id="floorImg" src="assets/textures/grasslight-big.jpg">
+          </a-assets>
+          <!-- Meshes. -->
+          <a-entity id="blueBox" mixin="blueBox" position="0 8 0"></a-entity>
+          <a-entity id="shortOrangeBox" mixin="short orange box" position="-5 2 0"></a-entity>
+          <a-entity id="shortYellowBox" mixin="short yellow box" position="5 2 0"></a-entity>
+          <a-entity id="redBox" geometry="primitive: box" material="color:#f00" position="-4 1 0">
+            <a-animation attribute="rotation" to="0 360 0" repeat="indefinite" easing="linear" dur="9600"></a-animation>
+          </a-entity>
+          <a-entity id="yellowSphere" geometry="primitive: sphere" material="color:#ff0; metalness:0.0; roughness:1.0" position="-2 2 -2"></a-entity>
+          <a-box src="assets/textures/brick_bump.jpg" position="-5 5 -2" width="1" color="#F16745"></a-box>
+          <a-box id="box" position="0 2 0" height="2" color="#FFC65D"></a-box>
+          <!-- Models. -->
+          <a-entity id="crate" geometry="primitive: box" material="src: #crateImg" position="3 4 0"></a-entity>
+          <a-entity id="greenBox" geometry="primitive: box" material="color: #0f0" position="4 2 4"></a-entity>
+          <!-- Floor. -->
+          <a-entity id="floor" geometry="primitive: cylinder; height: .2; radius: 12"
+                    material="src: #floorImg; color: #fafafa; metalness: .2; repeat: 50 20; roughness: .1"></a-entity>
+          <!-- Lights. -->
+          <a-entity id="pointLight" light="type: point" position="0 3 3"></a-entity>
+          <!-- Camera. -->
+          <a-entity id="cameraWrapper" position="0 1 8">
+            <a-entity id="camera" camera look-controls wasd-controls>
+              <!-- Cursor. -->
+              <a-entity id="cursor" position="0 0 -2"
+                        geometry="primitive: ring; radiusOuter: 0.016; radiusInner: 0.01"
+                        material="color: #ff9; shader: flat; transparent: true; opacity: 0.5"
+                        scale="2 2 2" raycaster>
+              </a-entity>
+            </a-entity>
+          </a-entity>
+          <a-sky color="#333"></a-sky>
+        </a-scene>
+      </div>
+    </div>
+  </body>
+</html>

package/examples/embedded.html ADDED Viewed

@@ -0,0 +1,79 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Inspector Test - Embedded</title>
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe/dist/aframe-master.min.js"></script>
+    <style>
+      html,
+      body {
+        background: #111;
+        height: 100%;
+        width: 100%;
+      }
+      body {
+        align-items: center;
+        display: flex;
+        justify-content: center;
+      }
+      a-scene {
+        display: block;
+        height: 480px;
+        width: 640px;
+      }
+    </style>
+  </head>
+  <body>
+    <a-scene embedded inspector="url: ../dist/aframe-inspector.js">
+      <a-assets>
+        <a-mixin id="blue" material="color: #4CC3D9"></a-mixin>
+        <a-mixin id="blueBox" geometry="primitive: box; depth: 2; height: 5; width: 1" material="color: #4CC3D9"></a-mixin>
+        <a-mixin id="box" geometry="primitive: box; depth: 1; height: 1; width: 1"></a-mixin>
+        <a-mixin id="cylinder" geometry="primitive: cylinder; height: 0.3; radius: 0.75; segmentsRadial: 6"></a-mixin>
+        <a-mixin id="green" material="color: #7BC8A4"></a-mixin>
+        <a-mixin id="orange" material="color: #F16745"></a-mixin>
+        <a-mixin id="purple" material="color: #93648D"></a-mixin>
+        <a-mixin id="short" scale="1 0.5 1"></a-mixin>
+        <a-mixin id="yellow" material="color: #FFC65D"></a-mixin>
+        <img id="crateImg" src="assets/textures/crate.gif">
+        <img id="floorImg" src="assets/textures/grasslight-big.jpg">
+      </a-assets>
+      <!-- Meshes. -->
+      <a-entity id="blueBox" mixin="blueBox" position="0 8 0"></a-entity>
+      <a-entity id="shortOrangeBox" mixin="short orange box" position="-5 2 0"></a-entity>
+      <a-entity id="shortYellowBox" mixin="short yellow box" position="5 2 0"></a-entity>
+      <a-entity id="redBox" geometry="primitive: box" material="color:#f00" position="-4 1 0">
+        <a-animation attribute="rotation" to="0 360 0" repeat="indefinite" easing="linear" dur="9600"></a-animation>
+      </a-entity>
+      <a-entity id="yellowSphere" geometry="primitive: sphere" material="color:#ff0; metalness:0.0; roughness:1.0" position="-2 2 -2"></a-entity>
+      <a-box src="assets/textures/brick_bump.jpg" position="-5 5 -2" width="1" color="#F16745"></a-box>
+      <a-box id="box" position="0 2 0" height="2" color="#FFC65D"></a-box>
+      <!-- Models. -->
+      <a-entity id="crate" geometry="primitive: box" material="src: #crateImg" position="3 4 0"></a-entity>
+      <a-entity id="greenBox" geometry="primitive: box" material="color: #0f0" position="4 2 4"></a-entity>
+      <!-- Floor. -->
+      <a-entity id="floor" geometry="primitive: cylinder; height: .2; radius: 12"
+                material="src: #floorImg; color: #fafafa; metalness: .2; repeat: 50 20; roughness: .1"></a-entity>
+      <!-- Lights. -->
+      <a-entity id="pointLight" light="type: point" position="0 3 3"></a-entity>
+      <!-- Camera. -->
+      <a-entity id="cameraWrapper" position="0 1 8">
+        <a-entity id="camera" camera look-controls wasd-controls>
+          <!-- Cursor. -->
+          <a-entity id="cursor" position="0 0 -2"
+                    geometry="primitive: ring; radiusOuter: 0.016; radiusInner: 0.01"
+                    material="color: #ff9; shader: flat; transparent: true; opacity: 0.5"
+                    scale="2 2 2" raycaster>
+          </a-entity>
+        </a-entity>
+      </a-entity>
+      <a-sky color="#333"></a-sky>
+    </a-scene>
+  </body>
+</html>

package/examples/empty.html ADDED Viewed

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Example Scene</title>
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe/dist/aframe-master.min.js"></script>
+  </head>
+  <body>
+    <a-scene stats>
+    </a-scene>
+    <script src="http://localhost:3333/dist/aframe-inspector.js"></script>
+  </body>
+</html>

package/examples/index-aframe.html ADDED Viewed

@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Example Scene</title>
+    <!--<script>window.AFRAME_SAMPLE_ASSETS_ROOT = "./sample-assets/";</script>-->
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@1.7.0/dist/aframe-master.min.js"></script>
+    <script src="https://unpkg.com/aframe-environment-component@1.3.7/dist/aframe-environment-component.min.js"></script>
+  </head>
+  <body>
+    <a-scene debug="true">
+      <a-assets>
+        <a-mixin id="blue" material="color: #4CC3D9"></a-mixin>
+        <a-mixin id="blueBox" geometry="primitive: box; depth: 2; height: 5; width: 1" material="color: #4CC3D9"></a-mixin>
+        <a-mixin id="box" geometry="primitive: box; depth: 1; height: 1; width: 1"></a-mixin>
+        <a-mixin id="cylinder" geometry="primitive: cylinder; height: 0.3; radius: 0.75; segmentsRadial: 6"></a-mixin>
+        <a-mixin id="green" material="color: #7BC8A4"></a-mixin>
+        <a-mixin id="orange" material="color: #F16745"></a-mixin>
+        <a-mixin id="purple" material="color: #93648D"></a-mixin>
+        <a-mixin id="short" scale="1 0.5 1"></a-mixin>
+        <a-mixin id="yellow" material="color: #FFC65D"></a-mixin>
+        <img id="crateImg" src="https://aframe.io/sample-assets/assets/images/wood/crate.gif" crossOrigin="true">
+        <img id="floorImg" src="https://aframe.io/sample-assets/assets/images/terrain/grasslight-big.jpg" crossOrigin="true">
+      </a-assets>
+      <a-entity id="environment" environment="preset: forest; fog: 0"></a-entity>
+      <!-- Meshes. -->
+      <a-entity id="blueBox" mixin="blueBox" position="0 8 0"></a-entity>
+      <a-entity id="shortOrangeBox" mixin="short orange box" position="-5 2 0"></a-entity>
+      <a-entity id="shortYellowBox" mixin="short yellow box" position="5 2 0"></a-entity>
+      <a-entity id="redBox" geometry="primitive: box" material="color:#f00" position="-4 1 0" animation="property: object3D.rotation.y; to: 360; loop: true; easing: linear; dur: 9600"></a-entity>
+      <a-entity id="yellowSphere" geometry="primitive: sphere" material="color:#ff0; metalness:0.0; roughness:1.0" position="-2 2 -2"></a-entity>
+      <a-box src="https://aframe.io/sample-assets/assets/images/bricks/brick_bump.jpg" position="-5 5 -2" width="1" color="#F16745"></a-box>
+      <a-box id="box" position="0 2 0" height="2" color="#FFC65D"></a-box>
+      <!-- Models. -->
+      <a-entity class="boxClass" geometry="primitive: box" material="src: #crateImg" position="3 4 0"></a-entity>
+      <a-entity class="boxClass" geometry="primitive: box" material="color: #0f0" position="4 2 4"></a-entity>
+      <!-- Floor. -->
+      <a-entity id="floor" geometry="primitive: box; height: .2; depth: 24; width: 24"
+                material="src: #floorImg; color: #fafafa; metalness: .1; repeat: 50 20; roughness: 1"></a-entity>
+      <!-- Lights. -->
+      <a-entity id="pointLight" light="type: point; intensity: 0.25" position="0 3 3"></a-entity>
+      <!-- Camera. -->
+      <a-entity id="cameraWrapper" position="0 1.6 8">
+        <a-entity id="camera" camera look-controls wasd-controls>
+          <!-- Cursor. -->
+          <a-entity id="cursor" position="0 0 -2"
+                    geometry="primitive: ring; radiusOuter: 0.016; radiusInner: 0.01"
+                    material="color: #ff9; shader: flat; transparent: true; opacity: 0.5"
+                    scale="2 2 2" raycaster>
+          </a-entity>
+        </a-entity>
+      </a-entity>
+      <a-entity id="leftHand" laser-controls="hand: left"></a-entity>
+      <a-entity id="rightHand" laser-controls="hand: right"></a-entity>
+    </a-scene>
+    <script src="../dist/aframe-inspector.js"></script>
+  </body>
+</html>

package/examples/index.html ADDED Viewed

@@ -0,0 +1,71 @@
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Example Scene</title>
+    <!--<script>window.AFRAME_SAMPLE_ASSETS_ROOT = "./sample-assets/";</script>-->
+    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@1.7.0/dist/aframe-master.min.js"></script>
+    <script src="https://unpkg.com/aframe-environment-component@1.3.7/dist/aframe-environment-component.min.js"></script>
+  </head>
+  <body>
+    <a-scene debug="true">
+      <a-text
+        position="0 3 -3"
+        value="Hello, XR World!"
+        align="center"
+        text=""
+      ></a-text>
+      <a-image
+        width="2"
+        height="2"
+        position="0 2 -4"
+        src="https://cdn.glitch.global/a9a8a483-3c49-449a-89e6-870645a2773a/product-logo.png?v=1729405883005"
+        material=""
+        geometry=""
+      ></a-image>
+      <a-cone
+        position="0 .5 -2.5"
+        color="green"
+        radius-bottom=".5"
+        radius-top="0"
+        material=""
+        geometry=""
+      ></a-cone>
+      <a-box
+        position="1 .5 -3"
+        rotation="0 45 0"
+        color="blue"
+        material=""
+        geometry=""
+      ></a-box>
+      <a-sphere
+        position="-1 .5 -3"
+        color="yellow"
+        radius=".6"
+        material=""
+        geometry=""
+      ></a-sphere>
+      <a-plane
+        position="0 0 0"
+        rotation="-90 0 0"
+        width="100"
+        height="100"
+        repeat="50 50"
+        transparent="true"
+        src="https://cdn.glitch.global/a9a8a483-3c49-449a-89e6-870645a2773a/wireframe.png?v=1725555289564"
+        material=""
+        geometry=""
+      ></a-plane>
+      <a-sky
+        color="#18181B"
+        repeat="20 10"
+        src="https://cdn.glitch.global/a9a8a483-3c49-449a-89e6-870645a2773a/wireframe.png?v=1725555289564"
+        material=""
+        geometry=""
+        scale=""
+      ></a-sky>
+    </a-scene>
+    <script src="../dist/aframe-inspector.js"></script>
+  </body>
+</html>

package/examples/supercraft.html ADDED Viewed

@@ -0,0 +1,6 @@
+<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
+<script src="https://unpkg.com/aframe-supercraft-loader@3.0.0/dist/aframe-supercraft-loader.min.js"></script>
+<a-scene>
+  <a-entity id="aframe" supercraft-loader="name: clear-bead"></a-entity>
+</a-scene>
+<script src="../dist/aframe-inspector.js"></script>

package/index.html ADDED Viewed

@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="refresh" content="0; url=examples/">
+  </head>
+  <body></body>
+</html>

package/package.json ADDED Viewed

@@ -0,0 +1,84 @@
+{
+  "name": "senangwebs-aframe-editor",
+  "version": "1.6.5",
+  "description": "A fork of A-Frame Inspector designed to be use as visual editor used in SenangWebs.",
+  "main": "dist/aframe-inspector.min.js",
+  "scripts": {
+    "build": "webpack --progress",
+    "deploy": "npm run ghpages",
+    "dist": "npm run dist:max && npm run dist:min",
+    "dist:max": "npm run build",
+    "dist:min": "cross-env MINIFY=true npm run build",
+    "ghpages": "npm run preghpages && ghpages -p gh-pages",
+    "lint": "npm run lintfile src/",
+    "lint:css": "stylelint src/css/main.css",
+    "lintfile": "eslint",
+    "preghpages": "npm run dist && shx rm -rf gh-pages && shx mkdir gh-pages && shx cp -r assets dist examples index.html gh-pages && shx sed -i http://localhost:3333 .. gh-pages/examples/index.html",
+    "prepare": "husky install",
+    "prepublish": "npm run dist",
+    "prettier": "prettier --write 'src/**/*.js'",
+    "start": "webpack serve --progress -d eval-source-map",
+    "test": "jest --watch",
+    "test:ci": "jest"
+  },
+  "repository": "aframevr/aframe-inspector",
+  "license": "MIT",
+  "dependencies": {
+    "@fortawesome/free-solid-svg-icons": "^6.5.1",
+    "clipboard-copy": "^4.0.1",
+    "clsx": "^2.1.0",
+    "lodash.debounce": "^4.0.8",
+    "prop-types": "^15.8.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-select": "^5.8.0",
+    "three": "0.168.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.24.0",
+    "@babel/eslint-parser": "^7.23.10",
+    "@babel/preset-env": "^7.24.0",
+    "@babel/preset-react": "^7.23.3",
+    "autoprefixer": "^10.4.17",
+    "babel-jest": "^29.7.0",
+    "babel-loader": "^9.1.3",
+    "cross-env": "^7.0.3",
+    "css-loader": "^6.10.0",
+    "eslint": "^8.57.0",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-plugin-react": "^7.33.2",
+    "ghpages": "0.0.10",
+    "husky": "^8.0.1",
+    "jest": "^29.7.0",
+    "lint-staged": "^13.0.3",
+    "postcss-loader": "^8.1.1",
+    "prettier": "^3.2.5",
+    "react-test-renderer": "^18.2.0",
+    "shx": "^0.3.4",
+    "style-loader": "^3.3.4",
+    "stylelint": "^16.2.1",
+    "stylelint-config-standard": "^36.0.0",
+    "stylelint-order": "^6.0.4",
+    "stylus": "^0.62.0",
+    "stylus-loader": "^8.1.0",
+    "webpack": "^5.91.0",
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^5.0.4"
+  },
+  "keywords": [
+    "3d",
+    "aframe",
+    "editor",
+    "inspector",
+    "three.js",
+    "tool",
+    "unity",
+    "vr",
+    "virtualreality",
+    "webvr",
+    "wysiwyg"
+  ],
+  "lint-staged": {
+    "*.js": "prettier --write"
+  }
+}

package/senangwebs-webverse-editor.png ADDED Viewed

Binary file

package/src/components/AwesomeIcon.js ADDED Viewed

@@ -0,0 +1,53 @@
+/*
+  Use <AwesomeIcon icon={faEye} /> instead of <FontAwesomeIcon icon={faEye} /> from @fortawesome/react-fontawesome
+  Using FontAwesomeIcon component adds 66 kB minified to the bundle.
+  Our AwesomeIcon does the same but less than 2 kB minified.
+  svg-inline--fa class has been added to lib.styl
+*/
+import React from 'react';
+import PropTypes from 'prop-types';
+function asIcon(icon) {
+  const width = icon[0];
+  const height = icon[1];
+  const vectorData = icon[4];
+  let element;
+  if (Array.isArray(vectorData)) {
+    element = (
+      <g>
+        {vectorData.map((pathData, index) => (
+          <path key={index} fill="currentColor" d={pathData} />
+        ))}
+      </g>
+    );
+  } else {
+    element = <path fill="currentColor" d={vectorData} />;
+  }
+  return {
+    width: width,
+    height: height,
+    icon: element
+  };
+}
+export class AwesomeIcon extends React.Component {
+  static propTypes = {
+    icon: PropTypes.object.isRequired
+  };
+  render() {
+    const { width, height, icon } = asIcon(this.props.icon.icon);
+    return (
+      <svg
+        role="img"
+        className={`svg-inline--fa fa-${this.props.icon.iconName}`}
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox={`0 0 ${width} ${height}`}
+      >
+        {icon}
+      </svg>
+    );
+  }
+}

package/src/components/Collapsible.js ADDED Viewed

@@ -0,0 +1,57 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+export default class Collapsible extends React.Component {
+  static propTypes = {
+    className: PropTypes.string,
+    collapsed: PropTypes.bool,
+    children: PropTypes.oneOfType([PropTypes.array, PropTypes.element])
+      .isRequired,
+    id: PropTypes.string
+  };
+  static defaultProps = {
+    collapsed: false
+  };
+  constructor(props) {
+    super(props);
+    this.state = {
+      collapsed: this.props.collapsed
+    };
+  }
+  toggleVisibility = (event) => {
+    // Don't collapse if we click on actions like clipboard
+    if (event.target.nodeName === 'A') return;
+    this.setState({ collapsed: !this.state.collapsed });
+  };
+  render() {
+    const rootClassNames = {
+      collapsible: true,
+      component: true,
+      collapsed: this.state.collapsed
+    };
+    if (this.props.className) {
+      rootClassNames[this.props.className] = true;
+    }
+    const rootClasses = clsx(rootClassNames);
+    const contentClasses = clsx({
+      content: true,
+      hide: this.state.collapsed
+    });
+    return (
+      <div id={this.props.id} className={rootClasses}>
+        <div className="static" onClick={this.toggleVisibility}>
+          <div className="collapse-button" />
+          {this.props.children[0]}
+        </div>
+        <div className={contentClasses}>{this.props.children[1]}</div>
+      </div>
+    );
+  }
+}