some error handling in viewer

This commit is contained in:
Robin Appelman 2024-09-02 15:01:07 +02:00
commit 5eeca75fb5
2 changed files with 10 additions and 4 deletions

View file

@ -56,18 +56,20 @@ dirLight.position.set(10, 10, 10);
scene.add(dirLight); scene.add(dirLight);
let map; let map;
let base_url = "";
const urlParams = new URLSearchParams(window.location.search); const urlParams = new URLSearchParams(window.location.search);
if (window.location.pathname.startsWith('/view/')) { if (window.location.pathname.startsWith('/view/')) {
map = window.location.pathname.substring('/view/'.length); map = window.location.pathname.substring('/view/'.length);
} else { } else {
map = urlParams.get('map'); map = urlParams.get('map');
base_url = "https://gltf.demos.tf"
} }
const textureScale = urlParams.get('texture_scale') || 0.25; const textureScale = urlParams.get('texture_scale') || 0.25;
const textures = urlParams.get('textures') || true; const textures = urlParams.get('textures') || true;
console.log(map); console.log(map);
loader.load(`/gltf/${map}.glb?texture_scale=${textureScale}&textures=${textures}`, (gltf) => { loader.load(`${base_url}/gltf/${map}.glb?texture_scale=${textureScale}&textures=${textures}`, (gltf) => {
document.body.classList.remove('loading'); document.body.classList.remove('loading');
gltf.scene.traverse(child => { gltf.scene.traverse(child => {
if ((child as THREE.Mesh).material) { if ((child as THREE.Mesh).material) {
@ -75,6 +77,9 @@ loader.load(`/gltf/${map}.glb?texture_scale=${textureScale}&textures=${textures}
} }
}); });
scene.add(gltf.scene) scene.add(gltf.scene)
}, () => {
}, (e) => {
(document.getElementById('loading') as HTMLElement).textContent = `Failed to load map: ${e}`;
}) })
const stats = new Stats() const stats = new Stats()

View file

@ -22,7 +22,7 @@ body.loading #loading {
#startButton { #startButton {
height: 100px; height: 100px;
width: 350px; width: 350px;
margin: -50px -125px; margin: -50px -175px;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
@ -31,10 +31,11 @@ body.loading #loading {
} }
#loading { #loading {
text-align: center;
display: none; display: none;
height: 100px; height: 100px;
width: 250px; width: 100vw;
margin: -50px -125px; margin: -50px -50vw;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;