Recent Changes

Differences

This shows you the differences between two versions of the page.

--- dev:viewer:sdk:examples_js:autologin_cloud [2020/10/09 12:47]
pieter
+++ dev:viewer:sdk:examples_js:autologin_cloud [2023/10/02 18:42]
pieter
@@ Line 1: / Line 1: @@
-====== Example loginOptions 3DM Cloud ======
+====== Example: Autologin to 3DM Cloud as Guest ======
 <html>
-  <script>
+<script>
-    let exampleUrl = "https://cdn.3dmapping.cloud/20.5.0/javascript_examples/example01.html";
+    let exampleUrl = "https://cdn.3dmapping.cloud/stable/javascript_examples/example11.html";
-  </script>
+</script>
-  <span>
-    <iframe src="https://cdn.3dmapping.cloud/20.5.0/javascript_examples/example01.html" width="800" height="600" style="border:none;">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.2.1/styles/default.min.css"
-    </iframe>
+    integrity="sha512-kZqGbhf9JTB4bVJ0G8HCkqmaPcRgo88F0dneK30yku5Y/dep7CZfCnNml2Je/sY4lBoqoksXz4PtVXS4GHSUzQ=="
-    <br/>
+    crossorigin="anonymous" />
-    <a class="button" onClick="javascript:window.location='view-source:'+exampleUrl">View Source</a>
-  </span>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.2.1/highlight.min.js"
+    integrity="sha512-Ypjm0o7jOxAd4hpdoppSEN0TQOC19UtPAqD+4s5AlXmUvbmmS/YMxYqAqarQYyxTnB6/rqip9qcxlNB/3U9Wdg=="
+    crossorigin="anonymous"></script>
+<span id="example"></span>
+<br />
+<br />
+<input type="button" value="Show Source" onclick="toggleShowSource()"></input>
+<span id="showsource"></span>
+<script>
+    let toggleShowSource = () => {
+        let element = document.getElementById("showsource");
+        element.style.display = element.style.display == 'none' ? 'block' : 'none';
+    }
+    fetch(exampleUrl)
+        .then(response => response.text())
+        .then(text => {
+            try {
+                // add example in iframe
+                let frame = document.createElement("iframe");
+                frame.style.border = 'none';
+                frame.style.overflow = 'auto';
+                frame.width = 950;
+                frame.height = 420;
+                frame.srcdoc = text;
+                document.getElementById("example").appendChild(frame);
+                // add 'showsource' section
+                let pre = document.createElement("pre");
+                pre.classList.add("code");
+                pre.classList.add("html4strict");
+                pre.textContent = text;
+                document.getElementById("showsource").style.display = 'none';
+                document.getElementById("showsource").style.fontSize = '12px';
+                document.getElementById("showsource").appendChild(pre);
+                // highlight
+                hljs.highlightBlock(pre);
+            } catch (error) { console.error(error); }
+        });
+</script>
 </html>

Last modified:: 2023/10/04 12:42