diff --git a/arjs/index.html b/arjs/index.html
index 9b445caa561e0a681cd3510ac8aaf18da4bf2234..790eb8a6dc3664772545334fff6c13264897f1c3 100644
--- a/arjs/index.html
+++ b/arjs/index.html
@@ -1,28 +1,57 @@
-<!DOCTYPE html>
-<html>
- <script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
- <!-- we import arjs version without NFT but with marker + location based support -->
- <script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar.js"></script>
- <body style="margin: 0px; overflow: hidden">
- <a-scene
- embedded
- arjs="detectionMode: mono_and_matrix; matrixCodeType: 3x3;"
+<script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@1.3.0/dist/aframe-master.min.js"></script>
+
+<style>
+ .arjs-loader {
+ height: 100%;
+ width: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+ background-color: rgba(0, 0, 0, 0.8);
+ z-index: 9999;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+
+ .arjs-loader div {
+ text-align: center;
+ font-size: 1.25em;
+ color: white;
+ }
+</style>
+
+<!-- rawgithack development URL -->
+<!--<script src='https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar.js'></script>-->
+<script src="../../../../aframe/build/aframe-ar-nft.js"></script>
+
+<body style="margin: 0px; overflow: hidden">
+ <!-- minimal loader shown until image descriptors are loaded -->
+ <div class="arjs-loader">
+ <div>Loading, please wait...</div>
+ </div>
+ <a-scene
+ vr-mode-ui="enabled: false;"
+ renderer="logarithmicDepthBuffer: true; precision: medium;"
+ embedded
+ arjs="trackingMethod: best; sourceType: webcam; debugUIEnabled: false;"
+ >
+ <!-- use rawgithack to retrieve the correct url for nft marker (see 'pinball' below) -->
+ <a-nft
+ type="nft"
+ url="./pinball.jpg"
+ smooth="true"
+ smoothCount="10"
+ smoothTolerance="0.01"
+ smoothThreshold="5"
>
- <a-marker type="barcode" value="5">
- <!-- we use cors proxy to avoid cross-origin problems -->
- <!--
- ⚠️⚠️⚠️
- https://arjs-cors-proxy.herokuapp.com/ is now offline, Heroku has dismissed all his free plans from November 2022.
- You need to host your own proxy and use it instead. The proxy is based on CORS Anywhere (see https://github.com/Rob--W/cors-anywhere).
- ⚠️⚠️⚠️
- -->
- <a-entity
- position="0 0 0"
- scale="0.05 0.05 0.05"
- gltf-model="herisson/herisson.gltf"
- ></a-entity>
- </a-marker>
- <a-entity camera></a-entity>
- </a-scene>
- </body>
-</html>
+ <a-entity
+ gltf-model="./herisson/herisson.gltf"
+ scale="5 5 5"
+ position="150 300 -100"
+ >
+ </a-entity>
+ </a-nft>
+ <a-entity camera></a-entity>
+ </a-scene>
+</body>
diff --git a/arjs/pinball.jpg b/arjs/pinball.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..d1444adc669465d1911e56d8d7569606c794a38f
Binary files /dev/null and b/arjs/pinball.jpg differ