Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
19 commits
Select commit Hold shift + click to select a range
0ab5c81
Replace THREE.Math with THREE.MathUtils
Elettrotecnica Mar 22, 2024
eeaa83e
Replace local blink-control component with better working one from CDN
Elettrotecnica Mar 22, 2024
121134f
Use latest A-Frame build from CDN
Elettrotecnica Mar 22, 2024
7cd47ed
Replace PlaneBufferGeometry with PlaneGeometry
Elettrotecnica Mar 22, 2024
ed878c4
Replace non-existing THREE.VertexColors with "true", as we want to co…
Elettrotecnica Mar 22, 2024
0ebbfeb
Address THREE reform of update ranges in r159
Elettrotecnica Mar 22, 2024
1d48368
Use existing primitives instead of generic entities, where applicable
Elettrotecnica Mar 22, 2024
076e0b0
Add crossorigin attribute to assets from CDN
Elettrotecnica Mar 22, 2024
21bcb84
Use aframe version including https://github.com/aframevr/aframe/pull/…
Elettrotecnica Mar 24, 2024
d367344
Add quest-touch-plus offset to brush-tip
Elettrotecnica Mar 24, 2024
352f1ff
Implement an approach to compute the stroke pointer position that doe…
Elettrotecnica Mar 25, 2024
6a6599a
Implement an approach to ensure tooltips are dynamically pointed to t…
Elettrotecnica Mar 25, 2024
d34b903
Replace THREE.XHRLoader with THREE.FileLoader
Elettrotecnica Mar 25, 2024
745fbb3
Update aframe-orbit-controls CDN URL
Elettrotecnica Mar 25, 2024
94464c9
Move tooltip logics into the system, fix tooltip lines not disappeari…
Elettrotecnica Mar 28, 2024
4d5e4bd
Update aframe and clipboard releases
Elettrotecnica Aug 3, 2025
e8d681e
Non breaking dependency updates via "npm audit fix"
Elettrotecnica Aug 3, 2025
1033f6b
Update Cliboard constructor on newer release
Elettrotecnica Aug 3, 2025
12b4f49
Update build
Elettrotecnica Aug 3, 2025
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion build.js

Large diffs are not rendered by default.

101 changes: 62 additions & 39 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,14 @@
<title>A-Painter</title>
<link rel="icon" href="img/icon-256.png">
<meta name="description" content="Paint in VR in your browser. Powered by A-Frame.">
<script src="vendor/aframe-master.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/aframe@1.7.1/dist/aframe-master.min.js"></script>
<script src="vendor/aframe-input-mapping-component.js"></script>
<script src="build.js"></script>
<script src="https://cdn.jsdelivr.net/npm/clipboard@1.5.12/dist/clipboard.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/aframe-gltf-exporter-component@0.1.0/dist/aframe-gltf-exporter-component.min.js"></script>
<script src="vendor/aframe-blink-controls.js"></script>
<script src="https://cdn.jsdelivr.net/npm/aframe-blink-controls@0.4.3/dist/aframe-blink-controls.min.js"></script>
<script src="vendor/aframe-tooltip-component.js"></script>
<script src="https://cdn.jsdelivr.net/npm/aframe-orbit-controls@1.3.0/dist/aframe-orbit-controls.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/aframe-orbit-controls@1.3.2/dist/aframe-orbit-controls.min.js"></script>
<link rel="stylesheet" href="css/main.css">
<link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="favicon-16x16.png" sizes="16x16">
Expand All @@ -29,34 +29,47 @@
<a-asset-item id="uiobj" src="assets/models/ui.obj"></a-asset-item>
<a-asset-item id="hitEntityObj" src="assets/models/teleportHitEntity.obj"></a-asset-item>
<a-asset-item id="tipObj" src="assets/models/controller-tip.glb"></a-asset-item>
<audio id="ui_click0" src="https://cdn.aframe.io/a-painter/sounds/ui_click0.ogg">
<audio id="ui_click1" src="https://cdn.aframe.io/a-painter/sounds/ui_click1.ogg">
<audio id="ui_menu" src="https://cdn.aframe.io/a-painter/sounds/ui_menu.ogg">
<audio id="ui_undo" src="https://cdn.aframe.io/a-painter/sounds/ui_undo.ogg">
<audio id="ui_tick" src="https://cdn.aframe.io/a-painter/sounds/ui_tick.ogg">
<audio id="ui_paint" src="https://cdn.aframe.io/a-painter/sounds/ui_paint.ogg">
<audio crossorigin id="ui_click0" src="https://cdn.aframe.io/a-painter/sounds/ui_click0.ogg">
<audio crossorigin id="ui_click1" src="https://cdn.aframe.io/a-painter/sounds/ui_click1.ogg">
<audio crossorigin id="ui_menu" src="https://cdn.aframe.io/a-painter/sounds/ui_menu.ogg">
<audio crossorigin id="ui_undo" src="https://cdn.aframe.io/a-painter/sounds/ui_undo.ogg">
<audio crossorigin id="ui_tick" src="https://cdn.aframe.io/a-painter/sounds/ui_tick.ogg">
<audio crossorigin id="ui_paint" src="https://cdn.aframe.io/a-painter/sounds/ui_paint.ogg">
</a-assets>
<a-light type="point" light="color: #fff; intensity:0.6" position="3 10 1"></a-light>
<a-light type="point" light="color: #fff; intensity:0.2" position="-3 -10 0"></a-light>
<a-light type="hemisphere" groundColor="#888" intensity="0.8"></a-light>
<a-entity id="logo" logo-model
animation="dur: 4000; property: logo-model.opacity; from: 1; to: 0; startEvents: painting-started"></a-entity>
<a-entity id="ground"
geometry="primitive: box; width: 12; height: 0.01; depth: 12"
material="shader: flat; src: #floor">
</a-entity>
<a-entity id="sky" geometry="primitive:sphere; radius:30; phiLength:360; phiStart:0; thetaLength:90" material="shader:flat; side:back; height:2048; src:#skymap; width:2048"></a-entity>
<a-box id="ground"
width="12"
height="0.01"
depth="12"
material="shader:flat"
src="#floor">
</a-box>
<a-sky id="sky"
radius="30"
theta-length="90"
src="#skymap">
</a-sky>

<a-entity id="hitEntityLeft" material="shader:flat; color: #ff3468" obj-model="obj: #hitEntityObj"></a-entity>
<a-entity id="hitEntityRight" material="shader:flat; color: #ff3468" obj-model="obj: #hitEntityObj"></a-entity>
<a-obj-model id="hitEntityLeft"
material="shader:flat; color: #ff3468"
src="#hitEntityObj">
</a-obj-model>
<a-obj-model id="hitEntityRight"
material="shader:flat; color: #ff3468"
src="#hitEntityObj">
</a-obj-model>
<a-entity id="cameraRig">
<!-- camera -->
<a-entity id="acamera" camera></a-entity>
<!-- hand controls -->
<a-entity id="left-hand"
brush
paint-controls="hand: left"
blink-controls="cameraRig: #cameraRig; startEvents: aim; endEvents: teleport; hitCylinderColor: #ff3468; curveHitColor: #ff3468; curveMissColor: #333333; curveLineWidth: 0.01; hitEntity: #hitEntityLeft"
blink-controls="teleportOrigin: #acamera; cameraRig: #cameraRig; startEvents: aim; endEvents: teleport; hitCylinderColor: #ff3468; curveHitColor: #ff3468; curveMissColor: #333333; curveLineWidth: 0.01; hitEntity: #hitEntityLeft"
ui>
<a-entity class="vive-tooltips" visible="false">
<a-entity tooltip="text: Brush size\n(slide up/down); width: 0.1; height: 0.04; targetPosition: 0 0.016 0.0073; src: assets/images/tooltip.png"
Expand All @@ -77,20 +90,25 @@
</a-entity>
</a-entity>
<a-entity class="oculus-tooltips" visible="false">
<a-entity tooltip="text: Main Menu; width: 0.07; height: 0.03; targetPosition: 0.011 0.005 0.045; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.12 0.016 0.06">
<a-entity data-tooltip="menu"
tooltip="text: Main Menu; width: 0.07; height: 0.03; targetPosition: 0.011 0.005 0.045; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.12 0.016 0.06">
</a-entity>
<a-entity tooltip="text: Teleport; width: 0.06; height: 0.03; targetPosition: 0.015 0 0.035; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.08 0.035 -0.02">
<a-entity data-tooltip="teleport"
tooltip="text: Teleport; width: 0.06; height: 0.03; targetPosition: 0.015 0 0.035; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.08 0.035 -0.02">
</a-entity>
<a-entity tooltip="text: Brush size\n(slide up/down); width: 0.09; height: 0.04; targetPosition: 0 0.01 0.03; lineHorizontalAlign: center; lineVerticalAlign: top; rotation: -90 0 0; src: assets/images/tooltip.png"
position="-0.07 0.01 0.093">
<a-entity data-tooltip="brush-size"
tooltip="text: Brush size\n(slide up/down); width: 0.09; height: 0.04; targetPosition: 0 0.01 0.03; lineHorizontalAlign: center; lineVerticalAlign: top; rotation: -90 0 0; src: assets/images/tooltip.png"
position="-0.07 0.01 0.093">
</a-entity>
<a-entity tooltip="text: Press to paint!\n(pressure sensitive); width: 0.11; height: 0.04; targetPosition: 0.022 -0.023 0.02; lineHorizontalAlign: right; rotation: -90 0 0; src: assets/images/tooltip.png"
position="-0.09 0.020 -0.067">
<a-entity data-tooltip="paint"
tooltip="text: Press to paint!\n(pressure sensitive); width: 0.11; height: 0.04; targetPosition: 0.022 -0.023 0.02; lineHorizontalAlign: right; rotation: -90 0 0; src: assets/images/tooltip.png"
position="-0.09 0.020 -0.067">
</a-entity>
<a-entity tooltip="text: Undo; width: 0.05; height: 0.03; targetPosition: 0.01 -0.03 0.047; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.07 -0.01 0.088">
<a-entity data-tooltip="undo"
tooltip="text: Undo; width: 0.05; height: 0.03; targetPosition: 0.01 -0.03 0.047; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.07 -0.01 0.088">
</a-entity>
</a-entity>
<a-entity class="windows-motion-samsung-tooltips" visible="false">
Expand Down Expand Up @@ -133,7 +151,7 @@
<a-entity id="right-hand"
brush
paint-controls="hand: right"
blink-controls="cameraRig: #cameraRig; startEvents: aim; endEvents: teleport; hitCylinderColor: #ff3468; curveHitColor: #ff3468; curveMissColor: #333333; curveLineWidth: 0.01; hitEntity: #hitEntityRight"
blink-controls="teleportOrigin: #acamera; cameraRig: #cameraRig; startEvents: aim; endEvents: teleport; hitCylinderColor: #ff3468; curveHitColor: #ff3468; curveMissColor: #333333; curveLineWidth: 0.01; hitEntity: #hitEntityRight"
ui>
<a-entity class="vive-tooltips" visible="false">
<a-entity tooltip="text: Brush size\n(slide up/down); width: 0.1; height: 0.04; targetPosition: 0 0.016 0.0073; src: assets/images/tooltip.png"
Expand All @@ -154,20 +172,25 @@
</a-entity>
</a-entity>
<a-entity class="oculus-tooltips" visible="false">
<a-entity tooltip="text: Main Menu; width: 0.07; height: 0.03; targetPosition: -0.011 0.005 0.045; rotation: -90 0 0; lineHorizontalAlign: right; src: assets/images/tooltip.png"
position="-0.12 0.016 0.06">
<a-entity data-tooltip="menu"
tooltip="text: Main Menu; width: 0.07; height: 0.03; targetPosition: -0.011 0.005 0.045; rotation: -90 0 0; lineHorizontalAlign: right; src: assets/images/tooltip.png"
position="-0.12 0.016 0.06">
</a-entity>
<a-entity tooltip="text: Teleport; width: 0.06; height: 0.03; targetPosition: -0.015 0 0.035; rotation: -90 0 0; lineHorizontalAlign: right; src: assets/images/tooltip.png"
position="-0.08 0.035 -0.02">
<a-entity data-tooltip="teleport"
tooltip="text: Teleport; width: 0.06; height: 0.03; targetPosition: -0.015 0 0.035; rotation: -90 0 0; lineHorizontalAlign: right; src: assets/images/tooltip.png"
position="-0.08 0.035 -0.02">
</a-entity>
<a-entity tooltip="text: Brush size\n(slide up/down); width: 0.09; height: 0.04; targetPosition: 0 0.01 0.03; lineHorizontalAlign: center; lineVerticalAlign: top; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.07 0.01 0.093">
<a-entity data-tooltip="brush-size"
tooltip="text: Brush size\n(slide up/down); width: 0.09; height: 0.04; targetPosition: 0 0.01 0.03; lineHorizontalAlign: center; lineVerticalAlign: top; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.07 0.01 0.093">
</a-entity>
<a-entity tooltip="text: Press to paint!\n(pressure sensitive); width: 0.11; height: 0.04; targetPosition: -0.022 -0.023 0.02; lineHorizontalAlign: left; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.09 0.020 -0.067">
<a-entity data-tooltip="paint"
tooltip="text: Press to paint!\n(pressure sensitive); width: 0.11; height: 0.04; targetPosition: -0.022 -0.023 0.02; lineHorizontalAlign: left; rotation: -90 0 0; src: assets/images/tooltip.png"
position="0.09 0.020 -0.067">
</a-entity>
<a-entity tooltip="text: Undo; width: 0.05; height: 0.03; targetPosition: -0.01 -0.03 0.047; rotation: -90 0 0; lineHorizontalAlign: right; src: assets/images/tooltip.png"
position="-0.07 -0.01 0.088">
<a-entity data-tooltip="undo"
tooltip="text: Undo; width: 0.05; height: 0.03; targetPosition: -0.01 -0.03 0.047; rotation: -90 0 0; lineHorizontalAlign: right; src: assets/images/tooltip.png"
position="-0.07 -0.01 0.088">
</a-entity>
</a-entity>
<a-entity class="windows-motion-samsung-tooltips" visible="false">
Expand Down
Loading