Commit Needle production dist and nginx-only Docker image

- Track Needle/MenuScene/dist and Needle/SampleScene/dist for container deploys - Dockerfile copies pre-built dist (no npm in image); rebuild with npm run build before commit - Fix Needle .gitignore: /assets/ so dist/assets is not ignored - Git LFS: track *.wasm; relax .dockerignore so dist is sent as build context Made-with: Cursor
2026-04-19 23:39:59 +03:00
parent 98062ef858
commit 6947303755
169 changed files with 91778 additions and 31 deletions
--- a/Needle/SampleScene/dist/needle-app.js
+++ b/Needle/SampleScene/dist/needle-app.js
@@ -0,0 +1,102 @@
+
+
+// Needle Engine attributes we want to allow to be overriden
+const knownAttributes = [
+    "src",
+    "background-color", 
+    "background-image", 
+    "environment-image", 
+    "focus-rect",
+];
+
+const scriptUrl = new URL(import.meta.url);
+const componentName = scriptUrl.searchParams.get("component-name") || 'needle-app';
+
+
+if (!customElements.get(componentName)) {
+    console.debug(`Defining needle-app as <${componentName}>`);
+    customElements.define(componentName, class extends HTMLElement {
+
+        static get observedAttributes() {
+            return knownAttributes;
+        }
+
+        constructor() {
+            super();
+            this.attachShadow({ mode: 'open' });
+            const template = document.createElement('template');
+            template.innerHTML = `
+                <style>
+                    :host {
+                        position: relative;
+                        display: block;
+                        width: max(360px 100%);
+                        height: max(240px, 100%);
+                        margin: 0;
+                        padding: 0;
+                    }
+                    needle-engine {
+                        position: absolute;
+                        top: 0;
+                        left: 0;
+                        width: 100%;
+                        height: 100%;
+                    }
+                </style>
+            `;
+            this.shadowRoot.appendChild(template.content.cloneNode(true));
+
+            const script = document.createElement('script');
+            script.type = 'module';
+            const url = new URL('.', import.meta.url);
+            this.basePath = this.getAttribute('base-path') || `${url.protocol}//${url.host}${url.pathname}`;
+            while(this.basePath.endsWith('/')) {
+                this.basePath = this.basePath.slice(0, -1);
+            }
+            script.src = this.getAttribute('script-src') || `${this.basePath}/assets/index-Dng8tdEB.js`;
+            this.shadowRoot.appendChild(script);
+
+            this.needleEngine = document.createElement('needle-engine');
+            this.updateAttributes();
+            this.shadowRoot.appendChild(this.needleEngine);
+
+            console.debug(this.basePath, script.src, this.needleEngine.getAttribute("src"));
+        }
+
+        onConnectedCallback() {
+            console.debug('NeedleEmbed connected to the DOM');
+        }
+
+        disconnectedCallback() {
+            console.debug('NeedleEmbed disconnected from the DOM');
+        }
+        
+        attributeChangedCallback(name, oldValue, newValue) {
+            console.debug(`NeedleApp attribute changed: ${name} from ${oldValue} to ${newValue}`);
+            this.updateAttributes();
+        }
+
+        updateAttributes() {
+            console.debug("NeedleApp updating attributes");
+            
+            const src = this.getAttribute('src') || null;
+            if(src) this.needleEngine.setAttribute("src", src);
+            else this.needleEngine.removeAttribute("src");
+
+            for(const attr of knownAttributes) {
+                
+                if(attr === "src") continue; // already handled above
+
+                if(this.hasAttribute(attr)) {
+                    this.needleEngine.setAttribute(attr, this.getAttribute(attr));
+                }
+                else {
+                    this.needleEngine.removeAttribute(attr);    
+                }
+            }
+        }
+    });
+}
+else {
+    console.warn(`needle-app <${componentName}> already defined.`);
+}