Add file type support for and in HTML input, enforce stricter validation in with supported formats list, warn on unsupported files, restrict processing to validated files.

index.html

@@ -26,7 +26,7 @@
   <canvas id="canvas" tabindex="0"></canvas>
   <div id="main-gui"></div>
   <div id="second-gui"></div>
-  <input id="file-input" type="file" accept=".ply,.spz,.splat,.ksplat,.zip" multiple="true" style="display: none;" />
+  <input id="file-input" type="file" accept=".ply,.spz,.splat,.ksplat,.zip,.sog,application/octet-stream" multiple="true" style="display: none;" />
 
   <script type="module" src="js/app.js"></script>
 </body>

js/app.js

@@ -75,7 +75,17 @@ orbitControls.maxDistance = 10;
 
 const fileInput = document.querySelector("#file-input");
 fileInput.onchange = (event) => {
-  loadFiles([...event.target.files]);
+  const allFiles = [...event.target.files];
+  const validFiles = allFiles.filter(f => /\.(ply|spz|splat|ksplat|zip|sog)$/i.test(f.name));
+  
+  if (validFiles.length !== allFiles.length) {
+    const invalidCount = allFiles.length - validFiles.length;
+    alert(`${invalidCount} file(s) skipped. Only .ply, .spz, .splat, .ksplat, .zip, and .sog files are supported.`);
+  }
+  
+  if (validFiles.length > 0) {
+    loadFiles(validFiles);
+  }
 };
 
 const guiOptions = {