Jump to content

Test: Difference between revisions

← Older editNewer edit →
VisualWikitext
No edit summary
No edit summary
Line 62: Line 62:


<script>
<script>
// Ensure everything is in global scope for MediaWiki
const modelViewer = document.getElementById('bearModel');
window.bearTextures = {
const loadingStatus = document.getElementById('loadingStatus');
const controlsInfo = document.getElementById('controlsInfo');
 
// Define texture URLs
const textures = {
     brown: 'https://survivalcraft.wiki/content/Textures/Creatures/Bear_Brown.png',
     brown: 'https://survivalcraft.wiki/content/Textures/Creatures/Bear_Brown.png',
     black: 'https://survivalcraft.wiki/content/Textures/Creatures/Bear_Black.png'
     black: 'https://survivalcraft.wiki/content/Textures/Creatures/Bear_Black.png'
};
};


window.changeBearTexture = function() {
// Track loading state
modelViewer.addEventListener('load', () => {
    console.log('Model loaded successfully');
    loadingStatus.textContent = 'Model loaded successfully!';
    controlsInfo.style.display = 'block';
   
    // Apply initial texture
    setTimeout(() => {
        changeBearTexture();
    }, 100);
});
 
modelViewer.addEventListener('error', (event) => {
    console.error('Model loading error:', event);
    loadingStatus.textContent = 'Error loading model. Check browser console.';
    loadingStatus.style.color = '#d63031';
});
 
modelViewer.addEventListener('progress', (event) => {
    const progress = event.detail.totalProgress;
    loadingStatus.textContent = `Loading model... ${Math.round(progress * 100)}%`;
});
 
function changeBearTexture() {
     const selector = document.getElementById('bearTexture');
     const selector = document.getElementById('bearTexture');
     const selectedTexture = selector.value;
     const selectedTexture = selector.value;
      
      
     console.log('Attempting to change texture to:', selectedTexture);
     console.log('Attempting to change texture to:', selectedTexture);
   
    const modelViewer = document.getElementById('bearModel');
      
      
     // Wait for model to be fully loaded
     // Wait for model to be fully loaded
     if (modelViewer && modelViewer.loaded) {
     if (modelViewer.loaded) {
         try {
         try {
             // Try to access the model's materials
             // Try to access the model's materials
Line 104: Line 129:
                         };
                         };
                         img.onerror = () => {
                         img.onerror = () => {
                             console.error('Failed to load texture:', window.bearTextures[selectedTexture]);
                             console.error('Failed to load texture:', textures[selectedTexture]);
                         };
                         };
                         img.src = window.bearTextures[selectedTexture];
                         img.src = textures[selectedTexture];
                     }
                     }
                 });
                 });
Line 116: Line 141:
         console.log('Model not yet loaded, will apply texture after load');
         console.log('Model not yet loaded, will apply texture after load');
     }
     }
};
}
 
// Initialize when DOM is ready
function initBearModel() {
    const modelViewer = document.getElementById('bearModel');
    const loadingStatus = document.getElementById('loadingStatus');
    const controlsInfo = document.getElementById('controlsInfo');
    const textureSelector = document.getElementById('bearTexture');
   
    if (!modelViewer) {
        console.error('Model viewer element not found');
        return;
    }
   
    // Add event listener to texture selector
    if (textureSelector) {
        textureSelector.addEventListener('change', window.changeBearTexture);
    }
 
    // Track loading state
    modelViewer.addEventListener('load', () => {
        console.log('Model loaded successfully');
        if (loadingStatus) loadingStatus.textContent = 'Model loaded successfully!';
        if (controlsInfo) controlsInfo.style.display = 'block';
       
        // Apply initial texture
        setTimeout(() => {
            window.changeBearTexture();
        }, 100);
    });
 
    modelViewer.addEventListener('error', (event) => {
        console.error('Model loading error:', event);
        if (loadingStatus) {
            loadingStatus.textContent = 'Error loading model. Check browser console.';
            loadingStatus.style.color = '#d63031';
        }
    });


    modelViewer.addEventListener('progress', (event) => {
// Debug: Log when everything is ready
        const progress = event.detail.totalProgress;
document.addEventListener('DOMContentLoaded', () => {
        if (loadingStatus) {
     console.log('DOM loaded, model-viewer should initialize');
            loadingStatus.textContent = `Loading model... ${Math.round(progress * 100)}%`;
        }
    });
 
    // Debug: Log when everything is ready
     console.log('Bear model initialized, model-viewer should load');
      
      
     // Check if model-viewer is defined
     // Check if model-viewer is defined
     if (typeof customElements.get('model-viewer') === 'undefined') {
     if (typeof customElements.get('model-viewer') === 'undefined') {
         console.error('model-viewer component not loaded');
         console.error('model-viewer component not loaded');
         if (loadingStatus) {
         loadingStatus.textContent = 'Error: model-viewer component failed to load';
            loadingStatus.textContent = 'Error: model-viewer component failed to load';
        loadingStatus.style.color = '#d63031';
            loadingStatus.style.color = '#d63031';
        }
     }
     }
}
});
 
// Initialize when DOM is ready
if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', initBearModel);
} else {
    initBearModel();
}
</script>
</script>
</html>
</html>
Retrieved from "https://survivalcraft.wiki/Test"