Create base templates to test mind ar and ar-js

pablodiegoss · pablodiegoss · commit 0420aa987650 · 2025-02-16T15:58:18.000Z
diff --git a/src/core/jinja2/core/ar-js.jinja2 b/src/core/jinja2/core/ar-js.jinja2
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+  <script src="https://aframe.io/releases/1.6.0/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/3.4.7/aframe/build/aframe-ar.js"></script>
+  <body style="margin : 0px; overflow: hidden;">
+    <a-scene embedded arjs>
+      <a-assets>
+        <video id="gif-video" src="http://localhost:9000/jandig-cdn/media/public/objects/temaki.webm" autoplay loop="true" crossorigin="anonymous"></video>
+      </a-assets>
+      <a-marker type='pattern' url='http://localhost:9000/jandig-cdn/media/public/patts/IMG_20250209_173553.jpg.patt'>
+        <a-plane
+          position="0 0 0"
+          rotation="-90 0 0"
+          width="1"
+          height="1"
+          material="src: #gif-video; transparent: true;"
+        ></a-plane>
+        <a-entity
+          position="0 0 0"
+          scale="0.05 0.05 0.05"
+          gltf-model="https://raw.githack.com/AR-js-org/AR.js/master/aframe/examples/image-tracking/nft/trex/scene.gltf"
+        ></a-entity>
+      </a-marker>
+      <a-entity camera></a-entity>
+    </a-scene>
+  </body>
+</html>
diff --git a/src/core/jinja2/core/mind-ar-js.jinja2 b/src/core/jinja2/core/mind-ar-js.jinja2
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+   <head>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    {# <script src="https://cdn.jsdelivr.net/npm/mind-ar@1.2.5/dist/mindar-image.prod.js"></script> #}
+    <script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/mind-ar@1.2.5/dist/mindar-image-aframe.prod.js"></script>
+  </head>
+  <body>
+    <a-scene mindar-image="imageTargetSrc: http://localhost:9000/jandig-cdn/media/public/patts/glenda2-scale5.mind;" vr-mode-ui="enabled: true" device-orientation-permission-ui="enabled: false">
+      <a-assets>
+        <video id="gif-video" src="http://localhost:9000/jandig-cdn/media/public/objects/temaki.webm" autoplay loop="true" crossorigin="anonymous"></video>
+      </a-assets>
+      <a-camera position="0 0 0" look-controls="enabled: false"></a-camera>
+      <a-entity mindar-image="warmupTolerance: 1; filterMinCF:0.1; filterBeta: 10" mindar-image-target="targetIndex: 0">
+        <a-plane
+          position="0 0 0"
+          rotation="-90 0 0"
+          width="1"
+          height="1"
+          material="src: #gif-video; transparent: true;"
+        ></a-plane>
+      </a-entity>
+    </a-scene>
+  </body>
+</html>
diff --git a/src/core/urls.py b/src/core/urls.py
@@ -10,6 +10,8 @@
     home,
     marker_generator,
     robots_txt,
+    ar_js,
+    mind_ar,
 )
 from core.views.views import (
     artwork_preview,
@@ -47,6 +49,8 @@
     path("sw.js", service_worker, name="sw"),
     path("manifest.json", manifest, name="manifest"),
     path("i18n/", include("django.conf.urls.i18n")),
+    path("ar-js/", ar_js, name="ar-js"),
+    path("mind-ar/", mind_ar, name="mind-ar"),
     re_path(
         r"^see_all(?:/(?P<which>[a-zA-Z]+))?(?:/(?P<page>\d+))?/$",
         see_all,
diff --git a/src/core/views/static_views.py b/src/core/views/static_views.py
@@ -37,3 +37,10 @@ def robots_txt(request):
         "Disallow: ",
     ]
     return HttpResponse("\n".join(lines), content_type="text/plain")
+
+def ar_js(request):
+    return render(request, "core/ar-js.jinja2")
+
+
+def mind_ar(request):
+    return render(request, "core/mind-ar-js.jinja2")
