Jump to content

Test: Difference between revisions

From Survivalcraft Wiki
No edit summary
No edit summary
Line 17: Line 17:


<html>
<html>
<script type="module" src="https://cdn.jsdelivr.net/npm/@google/model-viewer@3.4.0/dist/model-viewer.min.js"></script>
<div style="margin-bottom: 10px; font-family: sans-serif;">
    <label for="bearTexture" style="font-weight: bold; margin-right: 10px;">Bear Type:</label>
    <select id="bearTexture" style="padding: 5px; border: 1px solid #ccc; border-radius: 4px;">
        <option value="brown">Brown Bear</option>
        <option value="black">Black Bear</option>
    </select>
</div>
<model-viewer
    id="bearModelViewer"
    src="https://survivalcraft.wiki/content/Models/Bear.glb"
    alt="3D Bear Model from Survivalcraft"
    auto-rotate
    camera-controls
    background-color="#f0f0f0"
    shadow-intensity="1"
    environment-image="neutral"
    exposure="1"
    style="width: 400px; height: 400px; border: 1px solid #ccc; border-radius: 8px;"
    loading="eager"
>
    <div slot="error" style="display: flex; align-items: center; justify-content: center; height: 100%; background: #ffe6e6; color: #d63031; font-family: sans-serif; text-align: center;">
        <p>⚠️ Unable to load 3D model.<br><small>Check your browser console for details.</small></p>
    </div>
</model-viewer>
<div id="statusMessage" style="margin-top: 10px; font-size: 12px; color: #666; font-family: sans-serif;">
    Loading model...
</div>
<div id="controlsInfo" style="margin-top: 10px; font-size: 12px; color: #666; font-family: sans-serif; display: none;">
    <strong>Controls:</strong> Click and drag to rotate • Scroll to zoom • Right-click and drag to pan
</div>
<script type="module">
<script type="module">
<nowiki>
     const modelViewer = document.getElementById('bearModelViewer');
     const modelViewer = document.getElementById('bearModelViewer');
     const bearTextureSelector = document.getElementById('bearTexture');
     const bearTextureSelector = document.getElementById('bearTexture');
Line 77: Line 42:
         // Attempt to get the first material from the loaded model.
         // Attempt to get the first material from the loaded model.
         // Most simple GLB models have a single primary material.
         // Most simple GLB models have a single primary material.
         if (modelViewer.model && modelViewer.model.materials.length > 0) {
         if (modelViewer.model && modelViewer.model.materials.length > 0) { // THIS LINE IS NOW PROTECTED
             mainModelMaterial = modelViewer.model.materials[0];
             mainModelMaterial = modelViewer.model.materials[0];
             console.log('Identified main model material:', mainModelMaterial);
             console.log('Identified main model material:', mainModelMaterial);
Line 154: Line 119:
         }
         }
     });
     });
</nowiki>
</script>
</script>
</html>
</html>

Revision as of 18:11, 28 July 2025


Cell 1 Cell 2
Cell 3 Cell 4