templates/api/model-viewer.html.twig line 1

Open in your IDE?
  1. {% extends 'layout/master-service.html.twig' %}
  3. {% block ogtags %}
  4. {% if title is defined %}
  5. <meta property="og:title" content="{{ title }}" />
  6. {% endif %}
  7. {% if modelThumb is defined %}
  8.         <meta property="og:image" content="{{ modelThumb }}" />
  9. {% endif %}
  10. {% endblock %}
  12. {% block styles %}
  14.     {{ encore_entry_link_tags('modelViewer') }}
  16. {% endblock %}
  18. {% block content %}
  20.     <div id="serviceError">
  21.         <div id="serviceErrorMessage"></div>
  22.     </div>
  23.     <div id="modelViewerLogo"></div>
  24.     <div id="modelViewerContainer"></div>
  26. {% endblock %}
  28. {% block javascripts %}
  30.     <script>
  32.         const viewerContainer = document.getElementById('modelViewerContainer');
  33.         const errorContainer =  document.getElementById('serviceError');
  34.         const errorMessage =  document.getElementById('serviceErrorMessage');
  35.         const logo = document.getElementById('modelViewerLogo');
  37.         {% if error is defined %}
  39.             viewerContainer.style.display = 'none';
  40.             let errorMessageText = document.createTextNode("{{ error }}");
  41.             errorMessage.appendChild(errorMessageText);
  44.         {% else %}
  47.             let modelConfig = {{ modelConfig|raw }};
  48.             let viewerConfig = {{ viewerConfig|raw  }};
  49.             let uiConfig = {{ uiConfig|raw  }};
  51.             let shouldDisplay = true;
  53.             // check if subscription expired
  54.             {% if expired is defined and expired == true %}
  55.                 viewerContainer.style.display = 'none';
  56.                 let errorMessageText = document.createTextNode("Subscription Has Expired.");
  57.                 errorMessage.appendChild(errorMessageText);
  58.                 shouldDisplay = false;
  59.             {% endif %}
  62.             // check if domain is entered
  63.             let userDomains = {{ domains|raw }};
  64.             if (userDomains.length === 0){
  65.                 viewerContainer.style.display = 'none';
  66.                 let errorMessageText = document.createTextNode(" Service Not Active. Please Add Domain To Your Account.");
  67.                 errorMessage.appendChild(errorMessageText);
  68.                 shouldDisplay = false;
  69.             }
  71.             const localhostDomains = [
  72.                 'localhost',
  73.                 '127.0.0.1',
  74.                 'llink.to',
  75.                 'myshopify',
  76.                 'shopifypreview'
  77.             ];
  79.             const allowedDomains = localhostDomains.concat(userDomains);
  81.             // get parent origin domain
  82.             let originFullDomain;
  83.             if (typeof location.ancestorOrigins !== 'undefined'){
  84.                 originFullDomain = location.ancestorOrigins[0]
  85.             } else if (typeof document.referrer !== 'undefined'){
  86.                 originFullDomain = document.referrer;
  87.             } else {
  88.                 originFullDomain = null;
  89.             }
  91.             if (originFullDomain !== null && typeof originFullDomain !== 'undefined' && originFullDomain !== '') {
  93.                 const originDomain = getDomain(originFullDomain);
  94.                 let accessAllowed = false;
  96.                 allowedDomains.forEach(domain => {
  97.                     if (originDomain.includes(domain)){
  98.                         accessAllowed = true;
  99.                     }
  100.                 });
  102.                 if (originDomain.startsWith('192.')) {
  103.                     accessAllowed = true;
  104.                 }
  106.                 if (!accessAllowed){
  107.                     viewerContainer.style.display = 'none';
  108.                     let errorMessageText = document.createTextNode(" Domain isn’t correct. Please Validate Your Domain Name.");
  109.                     errorMessage.appendChild(errorMessageText);
  110.                     shouldDisplay = false;
  111.                 }
  112.             }
  115.             if (shouldDisplay){
  117.                 // check hide logo
  118.                 {% if hideLogo is defined and hideLogo == true %}
  119.                 logo.style.display = 'none';
  120.                 {% endif %}
  122.                 errorContainer.style.display = 'none';
  123.             }
  125.         {% endif %}
  128.         function getDomain(input){
  130.             let output = input.replace(/(^\w+:|^)\/\//, '').replaceAll('/','');
  131.             if (output.indexOf(':') !== -1){
  132.                 let domainParts = output.split(':');
  133.                 output = domainParts[0];
  134.             }
  135.             if (output.indexOf('?') !== -1){
  136.                 let domainParts = output.split('?');
  137.                 output = domainParts[0];
  138.             }
  140.             return output;
  141.         }
  143.     </script>
  145.     {% if error is not defined %}
  147.     {# 
  148.         TODO 
  149.         Viewer crashes webpack build if unminfied, when minified it does not iniialize.
  150.         This is temparary replacement until the issue is fixed.
  151.         Vanja 07.09.2023
  152.     #}
  154. {#     {{ encore_entry_script_tags('modelViewer') }}#}
  156.     <script src="{{ asset('presentation/model-viewer.iife.js') }}"></script>
  158.     <script>
  159.         let modelViewer = new ModelViewer(viewerConfig, uiConfig);
  161.         modelViewer.loadModelConfig(modelConfig, () => {
  162.           console.log('======== Model loaded ==========')
  163.         })
  164.     </script>
  167.     {% endif %}
  169. {% endblock %}