3d-viewer test

snippets/shx-3d-render-input.liquid

@@ -17,8 +17,6 @@
 <shx-input-forms>
 </shx-input-forms>
 
-<iframe src="https://3d-viewer.shinnex.de/" class="shx-threejs-renderer" width="100%" height="500px"></iframe>
-
 {% elsif content_type == 'init' %}
 
 <style>
@@ -34,6 +32,7 @@
         margin-top: 1rem;
         border-radius: 10px;
         border: 0;
+        width: 100%;
     }
 </style>
 
@@ -102,7 +101,10 @@
         connectedCallback() {
             this.innerHTML = '<div class="shx-input-forms-container"></div>';
             this.container = this.querySelector('.shx-input-forms-container');
-            let container = this.container;
+
+            this.3dViewer = document.createElement('iframe');
+            this.3dViewer.src = "https://3d-viewer.shinnex.de/";
+            this.3dViewer.classList.add('shx-threejs-renderer');
         }
 
         initCurrentVariant(id) {
@@ -145,12 +147,7 @@
                 }
             }
 
-            if(!container) {
-                console.error('container not found');
-                return;
-            }
-
-
+            this.appendChild(this.3dViewer);
 
             console.log('reloadCurrentVariant', id, openAnimation);