From 55383a6c37932fb4250c92eb67510e22f7b4ee45 Mon Sep 17 00:00:00 2001
From: Faizi <32fame1mpg@hft-stuttgart.de>
Date: Tue, 25 Jun 2024 10:18:41 +0000
Subject: [PATCH] Upload New File
---
public/1-Cube.html | 67 ++++++++++++++++++++++++++++++++++++++++++++++
1 file changed, 67 insertions(+)
create mode 100644 public/1-Cube.html
diff --git a/public/1-Cube.html b/public/1-Cube.html
new file mode 100644
index 0000000..41149c7
--- /dev/null
+++ b/public/1-Cube.html
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>AR.js Example</title>
+ <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
+ <script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.7.6/aframe/build/aframe-ar.js"></script>
+ <style>
+ body {
+ font-family: Arial, sans-serif;
+ text-align: center;
+ background-color: #f4f4f4;
+ margin: 0;
+ padding: 0;
+ }
+ .button {
+ background-color: #003366;
+ color: white;
+ padding: 15px 25px;
+ margin: 10px;
+ border: none;
+ border-radius: 4px;
+ cursor: pointer;
+ font-size: 16px;
+ }
+ .button:hover {
+ background-color: #0055aa;
+ }
+ .hidden {
+ display: none;
+ }
+ </style>
+</head>
+<body>
+ <button class="button" onclick="activateXR()">Start AR Scene</button>
+ <button class="button" onclick="captureScene()">Capture Scene</button>
+
+ <a-scene embedded arjs class="hidden">
+ <a-marker preset="hiro">
+ <a-box position="0 0.5 0" material="color: red" animation="property: rotation; to: 360 360 360; loop: true; dur: 10000"></a-box>
+ </a-marker>
+ <a-entity camera></a-entity>
+ </a-scene>
+
+ <script>
+ function activateXR() {
+ const scene = document.querySelector("a-scene");
+ scene.classList.remove("hidden");
+ }
+
+ function captureScene() {
+ const canvas = document.querySelector("canvas");
+ if (canvas) {
+ const dataURL = canvas.toDataURL("image/png");
+ const link = document.createElement("a");
+ link.href = dataURL;
+ link.download = "AR_Scene.png";
+ link.click();
+ } else {
+ alert("No AR scene to capture!");
+ }
+ }
+ </script>
+</body>
+</html>
+
--
GitLab