cartmagician-mobile.js

function add_cartmagician(product_id, usdz_path) {
  jQuery(document).ready(function ($) {
    // iOS Safari
    if (navigator.userAgent.match(/(\(iPod|\(iPhone|\(iPad)/)) {
      var ua = window.navigator.userAgent;
      var iOSSafari = ((!!ua.match(/iPad/i)) || (!!ua.match(/iPhone/i))) && ((!!ua.match(/WebKit/i)) && (!!ua.match(/CriOS/i) != true));

      // Var to know when the arview is open
      var arView = false;

      // Add arkit object icon
      $('#product-' + product_id).each(function (i) {
        var product_picture = '';

        // Add ARKit icon
        $(this).find('.woocommerce-product-gallery').prepend('<img class="woocommerce-product-cartmagician-icon" src="/wp-content/plugins/cartmagician/assets/img/arkit-mobile-icon.png">');

        // Hide icon if user is on iOS Safari
        if (iOSSafari)
          $(this).find('.woocommerce-product-cartmagician-icon').attr('style', 'display: none;');

        // Remove zoom icon (if present)
        if ($(this).find('.woocommerce-product-gallery__trigger').length)
          $(this).find('.woocommerce-product-gallery__trigger').remove()

        // Check if WooCommerce is using a placeholder
        if ($(this).find('.woocommerce-product-gallery__image--placeholder').length) {
          // Get product picture
          product_picture = $(this).find('.woocommerce-product-gallery__image--placeholder').find('img').attr('src');

          // Remove default WooCommerce viewer
          $(this).find('.woocommerce-product-gallery__image--placeholder').remove();
        } else {
          // Get product picture
          product_picture = $(this).find('.woocommerce-product-gallery__image').find('a').attr('href');

          // Remove default WooCommerce viewer
          $(this).find('.woocommerce-product-gallery__image').remove();
        }

        // Add arkit viewer
        $(this).find('.woocommerce-product-gallery').find('figure').append('<a class="cartmagician-product-object-viewer" href="' + usdz_path + '" rel="ar"><img src="' + product_picture + '" width="400" height="400"></a>');

        // Add loading animation if not on iOS Safari
        $(this).find('a[href="' + usdz_path + '"]').click(function () {
          if (iOSSafari) { }
          else {
            $(this).find('.woocommerce-product-cartmagician-icon').attr('src', '/wp-content/plugins/cartmagician/assets/img/cartmagician-loading.svg');
            arView = true;
          }
        });

        // Stop animation when leaving page - AR view is triggered when visibility change
        document.addEventListener("visibilitychange", function () {
          if (iOSSafari) { }
          else if (arView) {
            $('.woocommerce-product-cartmagician-icon').attr('src', '/wp-content/plugins/cartmagician/assets/img/arkit-mobile-icon.png');
            arView = false;
          }
        });
      });
    }
  });
}