<script async type="module"> document.addEventListener('DOMContentLoaded', (event) => { const modelViewer = document.querySelector('#main-viewer'); const sliders = document.querySelector('#slider-model-viewer'); const arBtn = document.querySelector('#ar-button'); const arPrompt = document.querySelector('#ar-prompt'); const arFailure = document.querySelector('#ar-failure'); modelViewer.append(arBtn); modelViewer.append(arPrompt); modelViewer.append(arFailure); modelViewer.append(sliders); const sources = '{{ ProductVRSources }}'.split(',').filter((item) => item != ''); const iosSources = '{{ ProductVRSourcesIos }}'.split(',').filter((item) => item != ''); const posters = '{{ ProductVRPosters }}'.split(',').filter((item) => item != ''); window.switchSrc = (element, pos) => { const position = pos - 1; modelViewer.src = sources[position]; modelViewer.poster = posters[position]; modelViewer.iosSrc = iosSources[position]; modelViewer.alt = alts[position]; const slides = document.querySelectorAll('#main-viewer .slide'); slides.forEach((element) => { element.classList.remove('selected'); }); element.classList.add('selected'); }; modelViewer.addEventListener('load', (event) => { document.querySelector('.slider').addEventListener('beforexrselect', (ev) => { // Keep slider interactions from affecting the XR scene. ev.preventDefault(); }); }); }); </script>