<script>
  document.addEventListener("DOMContentLoaded", () => {
    
  {% comment %} Login {% endcomment %}
  {% if template contains 'login' %}
    const loginBtn = document.querySelector(`form[action="/account/login"] input[type="submit"]`);
    if (loginBtn) {
      loginBtn.addEventListener("click", () => {
        const email = document.querySelector('input[name="customer[email]"]').value.toString();
        const password = document.querySelector('input[name="customer[password]"]').value.toString();
        if (email && password) {
          intempt.recordEvent('login', {
            email: email
          });
        }
      }, false);
    }
  {% endif %}
  {% comment %} Login - End {% endcomment %}

  {% comment %} Sign up {% endcomment %}
  {% if template contains 'register' %}
    const loginBtn = document.querySelector(`form[action="/account/"] input[type="submit"]`);
    if (loginBtn) {
      loginBtn.addEventListener("click", () => {
        const firstName = document.querySelector('input[name="customer[first_name]"]').value.toString();
        const lastName = document.querySelector('input[name="customer[last_name]"]').value.toString();
        const email = document.querySelector('input[name="customer[email]"]').value.toString();
        const password = document.querySelector('input[name="customer[password]"]').value.toString();
        if (firstName && lastName && email && password) {
          intempt.recordEvent('signed_up', {
            first_name: firstName,
            last_name: lastName,
            email: email 
          });
        }
      }, false);
    }
  {% endif %}
  {% comment %} Sign up - End {% endcomment %}

  {% comment %} Viewed product {% endcomment %}
  {% if template contains 'product' %}
    intempt.recordEvent('viewed_product', {
      product_id: `{{ product.id }}`, 
      sku: `{{ product.variants[0].sku | escape }}`, 
      title: `{{ product.title | escape }}`,
      price: {{ product.price | divided_by: 100.0 }},
      category: `{{ product.collections[0].title }}`,
      variant: `{{ product.variants[0].title }}`,
      discount: {% if product.compare_at_price > product.price %}{{ product.compare_at_price | minus: product.price | divided_by: 100.0 }}{% else %}0{% endif %},
      url: `https://{{ shop.domain }}{{ product.url }}`,
      image_url:  `https:{{ product.featured_image | img_url: 'master' }}`
    });
  {% endif %}
  {% comment %} Viewed product - End {% endcomment %}

  {% comment %} Viewed category {% endcomment %}
  {% if template contains 'collection' %}
    intempt.recordEvent('viewed_category', {
      category_name: `{{ collection.title }}`,
      url: `https://{{ shop.domain }}{{ collection.url }}`
    });
  {% endif %}
  {% comment %} Viewed category - End {% endcomment %}

  {% comment %} Added to cart {% endcomment %}
  {% if template contains 'product' %}
    var variantsJson = {{ product | json }};
    const addtocartForm = document.querySelector(`form[action="/cart/add"]`);
      if (addtocartForm) {
        addtocartForm.addEventListener("submit", (e) => {
          e.preventDefault();
          
          let variantId = document.querySelector(`form[action="/cart/add"] [name="id"]`).value;
          let quantity = 1;
          if (document.querySelector(`form[action="/cart/add"] [name="quantity"]`)) {
            quantity = document.querySelector(`form[action="/cart/add"] [name="quantity"]`).value;
          }
          let sku = '';
          let price = 0;
          let discount = 0;
          let variant = '';
          for (let i = 0; i < variantsJson.variants.length; i ++) {
            if (variantsJson.variants[i].id == variantId) {
              sku = variantsJson.variants[i].sku;
              price = parseFloat(variantsJson.variants[i].price) / 100.0;
              variant = variantsJson.variants[i].title;
              if (variantsJson.variants[i].compare_at_price != null && variantsJson.variants[i].compare_at_price > variantsJson.variants[i].price) {
                discount = parseFloat(variantsJson.variants[i].compare_at_price - variantsJson.variants[i].price) / 100.0;
              }
            }
          }
          intempt.recordEvent('added_to_cart', {
            product_id: `{{ product.id }}`,
            sku: sku,
            title: `{{ product.title }}`,
            price: price,
            category: `{{ product.collections[0].title }}`,
            variant: variant,
            discount: discount,
            url: `https://{{ shop.domain }}{{ product.url }}`,
            image_url: `https:{{ product.featured_image | img_url: 'master' }}`,
            item_count: quantity,
            product_url: `https://{{ shop.domain }}{{ product.url }}?variant=` + variantId.toString()
          });

          e.target.submit();
        }, false);
      }
  {% endif %}
  {% comment %} Added to cart - End {% endcomment %}

  {% comment %} Viewed checkout {% endcomment %}
  {% if template contains 'cart' %}
    intempt.recordEvent('viewed_checkout', {
      total_price: {{ cart.total_price | divided_by: 100.0 }},
      total_discount: {% if cart.total_discounts %}{{ cart.total_discounts }}{% else %}0{% endif %},
      items_count: {{ cart.item_count }},
      items: [
        {% for item in cart.items %}
          {
            title: `{{ item.product.title }}`,
            product_id: `{{ item.product.id }}`,
            sku: `{{ item.variant.sku }}`,
            price: {{ item.price | divided_by: 100.0 }},
            category: `{{ item.product.collections[0].title }}`,
            variant: `{{ item.variant.title }}`,
            quantity: {{ item.quantity }},
            product_brand: `{{ item.product.vendor }}`,
            url: `https://{{ shop.domain }}{{ item.product.url }}`,
            image_url: `https:{{ item.product.featured_image | img_url: 'master' }}`
          }{% unless forloop.last %},{% endunless %}
        {% endfor %}
      ]
      {% comment %}
      title: [
        {% for item in cart.items %}`{{ item.product.title }}`{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      product_id: [
        {% for item in cart.items %}`{{ item.product.id }}`{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      sku: [
        {% for item in cart.items %}`{{ item.variant.sku }}`{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      price: [
        {% for item in cart.items %}{{ item.price }}{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      category: [
        {% for item in cart.items %}`{{ item.product.collections[0].title }}`{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      variant: [
        {% for item in cart.items %}`{{ item.variant.title }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
      ],
      quantity: [
        {% for item in cart.items %}{{ item.quantity }}{% unless forloop.last %},{% endunless %}{% endfor %}        
      ],
      product_brand: [
        {% for item in cart.items %}`{{ item.product.vendor }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
      ],
      url: [
        {% for item in cart.items %}`{{ shop.domain }}{{ item.product.url }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
      ],
      image_url: [
        {% for item in cart.items %}`{{ item.product.featured_image | img_url: 'master' }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
      ]
      {% endcomment %}
    });
  {% endif %}
  {% comment %} Viewed checkout - End {% endcomment %}

  {% comment %} Item removed from cart {% endcomment %}
  {% if template contains 'cart' %}
    const removeBtns = document.querySelectorAll(`a[href^="/cart/change"]`);
    {% assign itemsJson = '[' %}
    {% for item in cart.items %}
      {% assign itemCategory = '"category": "' | append: item.product.collections[0].title | append: '","id"' %}
      {% assign itemJson = item | json | replace: '"id"', itemCategory %}
      {% assign itemsJson = itemsJson | append: ',' | append: itemJson %}
    {% endfor %}
    {% assign itemsJson = itemsJson | replace: '[,', '[' | append: ']' %}
    var itemsJson = {{ itemsJson }};
    console.log(itemsJson);
    for (let i = 0; i < removeBtns.length; i ++) {
      const removeBtn = removeBtns[i];
      removeBtn.addEventListener("click", (e) => {
        e.preventDefault();
        
        const lineId = e.target.getAttribute('href').split('line=')[1].split('&')[0] - 1;
        intempt.recordEvent('item_removed_from_cart', {
          title: itemsJson[lineId].title,
          product_id: itemsJson[lineId].id.toString(),
          sku: itemsJson[lineId].sku,
          price: itemsJson[lineId].price / 100.0,
          category: itemsJson[lineId].category,
          variant: itemsJson[lineId].variant_title,
          quantity: itemsJson[lineId].quantity,
          product_brand: itemsJson[lineId].vendor,
          url: `https://{{ shop.domain }}` + itemsJson[lineId].url,
          image_url: `https:` + itemsJson[lineId].image
        });
        
        window.location.href = e.target.getAttribute('href');
      }, false);
    }
  {% endif %}
  {% comment %} Item removed from cart - End {% endcomment %}

  {% comment %} Search {% endcomment %}
  const searchForms = document.querySelectorAll(`form[action="/search"]`);
  for (let i = 0; i < searchForms.length; i ++) {
    const searchForm = searchForms[i];
    searchForm.addEventListener("submit", (e) => {
      e.preventDefault();

      const term = e.target.querySelector('[name="q"]').value;
      intempt.recordEvent('search', {
        search_term: term,
        url: window.location.href
      });
      
      e.target.submit();
    }, false);
  }
  {% comment %} Search - End {% endcomment %}

  {% comment %} Started checkout {% endcomment %}
  {% if template contains 'cart' %}
    const checkoutBtn = document.querySelector(`form[action="/cart"] input[type="submit"][name="checkout"]`);
    checkoutBtn.addEventListener("click", (e) => {
      e.preventDefault();
      
      intempt.recordEvent('started_checkout', {
        total_price: {{ cart.total_price | divided_by: 100.0 }},
        total_discount: {% if cart.total_discounts %}{{ cart.total_discounts | divided_by: 100.0 }}{% else %}0{% endif %},
        items_count: {{ cart.item_count }},
        items: [
          {% for item in cart.items %}
            {
              title: `{{ item.product.title }}`,
              product_id: `{{ item.product.id }}`,
              sku: `{{ item.variant.sku }}`,
              price: {{ item.price | divided_by: 100.0 }},
              category: `{{ item.product.collections[0].title }}`,
              product_variant: `{{ item.variant.title }}`,
              quantity: {{ item.quantity }},
              product_brand: `{{ item.product.vendor }}`,
              url: `https://{{ shop.domain }}{{ item.product.url }}`,
              image_url: `https:{{ item.product.featured_image | img_url: 'master' }}`
            }{% unless forloop.last %},{% endunless %}
          {% endfor %}
        ]
        {% comment %}
        title: [
          {% for item in cart.items %}`{{ item.product.title }}`{% unless forloop.last %},{% endunless %}{% endfor %}
        ],
        product_id: [
          {% for item in cart.items %}`{{ item.product.id }}`{% unless forloop.last %},{% endunless %}{% endfor %}
        ],
        sku: [
          {% for item in cart.items %}`{{ item.variant.sku }}`{% unless forloop.last %},{% endunless %}{% endfor %}
        ],
        price: [
          {% for item in cart.items %}{{ item.price }}{% unless forloop.last %},{% endunless %}{% endfor %}
        ],
        category: [
          {% for item in cart.items %}`{{ item.product.collections[0].title }}`{% unless forloop.last %},{% endunless %}{% endfor %}
        ],
        variant: [
          {% for item in cart.items %}`{{ item.variant.title }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
        ],
        quantity: [
          {% for item in cart.items %}{{ item.quantity }}{% unless forloop.last %},{% endunless %}{% endfor %}        
        ],
        product_brand: [
          {% for item in cart.items %}`{{ item.product.vendor }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
        ],
        url: [
          {% for item in cart.items %}`{{ shop.domain }}{{ item.product.url }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
        ],
        image_url: [
          {% for item in cart.items %}`{{ item.product.featured_image | img_url: 'master' }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
        ]
        {% endcomment %}
      });
      
      window.location.href = '/checkout';
    }, false);
  {% endif %}
  {% comment %} Started checkout - End {% endcomment %}
  });
</script>
{% comment %}
<script>
  document.addEventListener("DOMContentLoaded", () => {
    
  {% comment %} Purchase {% endcomment %}
  {% if first_time_accessed %}
    intempt.recordEvent('purchase', {
      total_price: {{ checkout.total_price | divided_by: 100.0 }},
      shipping_cost: {{ checkout.shipping_price | divided_by: 100.0 }},
      tax: {{ checkout.tax_price | divided_by: 100.0 }},
      shipping_method: `{{ checkout.shipping_methods[0].title }}`,
      payment_method: `{{ checkout.transactions[0].gateway_display_name }}`,
      discount_code: `{% if checkout.discount_applications %}{{ checkout.discount_applications[0].title }}{% endif %}`,
      accepts_marketing: {{ checkout.customer.accepts_marketing }},
      shipping_address: `{{ checkout.shipping_address.summary }}`,
      country: `{{ checkout.shipping_address.country }}`,
      state: `{{ checkout.shipping_address.province }}`,
      email: `{{ checkout.customer.email }}`,
      first_name: `{{ checkout.customer.first_name }}`,
      last_name: `{{ checkout.customer.last_name }}`,
      total_discount: {{ checkout.total_discounts | divided_by: 100.0 }},
      items_count: {{ checkout.item_count }},
      items: [
        {% for item in checkout.line_items %}
          {
            title: `{{ item.product.title }}`,
            product_id: `{{ item.product.id }}`,
            sku: `{{ item.variant.sku }}`,
            price: {{ item.price | divided_by: 100.0 }},
            category: `{{ item.product.collections[0].title }}`,
            product_variant: `{{ item.variant.title }}`,
            quantity: {{ item.quantity }},
            product_brand: `{{ item.product.vendor }}`,
            url: `https://{{ shop.domain }}{{ item.product.url }}`,
            image_url: `https:{{ item.product.featured_image | img_url: 'master' }}`
          }{% unless forloop.last %},{% endunless %}
        {% endfor %}
      ]
      {% comment %}
      title: [
        {% for item in checkout.line_items %}`{{ item.product.title }}`{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      product_id: [
        {% for item in checkout.line_items %}`{{ item.product.id }}`{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      sku: [
        {% for item in checkout.line_items %}`{{ item.variant.sku }}`{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      price: [
        {% for item in checkout.line_items %}{{ item.price }}{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      category: [
        {% for item in checkout.line_items %}`{{ item.product.collections[0].title }}`{% unless forloop.last %},{% endunless %}{% endfor %}
      ],
      product_variant: [
        {% for item in checkout.line_items %}`{{ item.variant.title }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
      ],
      quantity: [
        {% for item in checkout.line_items %}{{ item.quantity }}{% unless forloop.last %},{% endunless %}{% endfor %}        
      ],
      product_brand: [
        {% for item in checkout.line_items %}`{{ item.product.vendor }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
      ],
      url: [
        {% for item in checkout.line_items %}`{{ shop.domain }}{{ item.product.url }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
      ],
      image_url: [
        {% for item in checkout.line_items %}`{{ item.product.featured_image | img_url: 'master' }}`{% unless forloop.last %},{% endunless %}{% endfor %}        
      ]
      {% endcomment %}
    });
  {% endif %}
  {% comment %} Purchase - End {% endcomment %}
  
  });
</script>
{% endcomment %}