Skip to content
- Choosing a selection results in a full page refresh.
- Opens in a new window.
/* TRIUMPH SHIPPING WIDGET */
document.addEventListener('DOMContentLoaded', function() {
const wrapper = document.querySelector('.triumph-wrapper');
if (!wrapper) return;
const buttons = wrapper.querySelectorAll('.triumph-btn');
const addons = wrapper.querySelector('.triumph-addons');
const addressOptions = wrapper.querySelector('.triumph-address-options');
const pickupDropdown = wrapper.querySelector('.triumph-pickup-dropdown');
const pickupSelect = wrapper.querySelector('#triumph-pickup-location');
const addonButtons = wrapper.querySelectorAll('.triumph-addon-btn');
const completeMessage = wrapper.querySelector('.triumph-complete');
const priceEl = document.querySelector('.price__regular .price-item--regular') ||
document.querySelector('.product__price') ||
document.querySelector('[data-product-price]');
const buttonPriceEl = document.querySelector('.product-form__submit [id^="BuyButtonPrice"]') ||
document.querySelector('.product-form__submit .price');
const basePrice = parseFloat(wrapper.dataset.basePrice) || 0;
const deliveryRate = parseFloat(wrapper.dataset.deliveryRate) || 0;
const residentialFee = parseFloat(wrapper.dataset.residentialFee) || 0;
const limitedAccessFee = parseFloat(wrapper.dataset.limitedAccessFee) || 0;
function toVariantId(raw) {
if (!raw) return null;
const str = String(raw).trim();
const match = str.match(/(\d+)\s*$/);
return match ? parseInt(match[1], 10) : null;
}
const residentialVariantId = toVariantId(wrapper.dataset.residentialVariantId);
const limitedAccessVariantId = toVariantId(wrapper.dataset.limitedAccessVariantId);
let isDelivery = null;
let isTerminal = null;
let isResidential = null;
let isLimitedAccess = null;
let selectedPickup = null;
let pickupSurcharge = 0;
const productForm = document.querySelector('form[action="/cart/add"]') ||
document.querySelector('product-form form') ||
document.querySelector('.product-form form');
const addToCartBtn = document.querySelector('.product-form__submit') ||
(productForm ? productForm.querySelector('button[type="submit"]') : null);
if (addToCartBtn) {
addToCartBtn.style.opacity = '0.5';
addToCartBtn.style.pointerEvents = 'none';
}
function checkCompletion() {
let isComplete = false;
if (isDelivery === true) {
if (isTerminal === true) isComplete = true;
else if (isTerminal === false) isComplete = isResidential !== null && isLimitedAccess !== null;
} else if (isDelivery === false) {
isComplete = pickupSelect && pickupSelect.value !== '';
}
if (addToCartBtn) {
addToCartBtn.style.opacity = isComplete ? '1' : '0.5';
addToCartBtn.style.pointerEvents = isComplete ? 'auto' : 'none';
}
if (completeMessage) completeMessage.style.display = isComplete ? 'flex' : 'none';
return isComplete;
}
function updatePrice() {
let total = basePrice;
if (isDelivery === true) {
total += deliveryRate;
if (isTerminal === false) {
if (isResidential === true) total += residentialFee;
if (isLimitedAccess === true) total += limitedAccessFee;
}
}
if (isDelivery === false) {
total += pickupSurcharge;
}
const formattedPrice = '$' + total.toLocaleString('en-US', {minimumFractionDigits: 2, maximumFractionDigits: 2});
if (priceEl) priceEl.textContent = formattedPrice;
if (buttonPriceEl) buttonPriceEl.innerHTML = ' - ' + formattedPrice;
}
function updateVisibility() {
if (addons) addons.style.display = isDelivery === true ? 'block' : 'none';
if (pickupDropdown) pickupDropdown.style.display = isDelivery === false ? 'block' : 'none';
if (addressOptions) addressOptions.style.display = isTerminal === false ? 'block' : 'none';
}
function resetAddons() {
isTerminal = null;
isResidential = null;
isLimitedAccess = null;
selectedPickup = null;
pickupSurcharge = 0;
addonButtons.forEach(function(btn) { btn.classList.remove('selected'); });
if (pickupSelect) pickupSelect.value = '';
}
buttons.forEach(function(btn) {
btn.addEventListener('click', function() {
buttons.forEach(function(b) { b.classList.remove('selected'); });
this.classList.add('selected');
isDelivery = this.dataset.option === 'delivery';
resetAddons();
updateVisibility();
updatePrice();
checkCompletion();
});
});
addonButtons.forEach(function(btn) {
btn.addEventListener('click', function() {
const addon = this.dataset.addon;
const value = this.dataset.value;
wrapper.querySelectorAll('.triumph-addon-btn[data-addon="' + addon + '"]').forEach(function(b) {
b.classList.remove('selected');
});
this.classList.add('selected');
if (addon === 'terminal') {
isTerminal = value === 'yes';
if (isTerminal) {
isResidential = null;
isLimitedAccess = null;
wrapper.querySelectorAll('.triumph-addon-btn[data-addon="residential"], .triumph-addon-btn[data-addon="limited"]').forEach(function(b) {
b.classList.remove('selected');
});
}
} else if (addon === 'residential') {
isResidential = value === 'yes';
} else if (addon === 'limited') {
isLimitedAccess = value === 'yes';
}
updateVisibility();
updatePrice();
checkCompletion();
});
});
if (pickupSelect) {
pickupSelect.addEventListener('change', function() {
selectedPickup = this.value;
const selectedOption = this.options[this.selectedIndex];
pickupSurcharge = parseFloat(selectedOption.dataset.fee) || 0;
updatePrice();
checkCompletion();
});
}
if (addToCartBtn) {
addToCartBtn.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
e.stopImmediatePropagation();
if (!checkCompletion()) {
alert('Please complete all delivery options before adding to cart.');
return;
}
const mainVariantInput = productForm.querySelector('input[name="id"]') ||
productForm.querySelector('select[name="id"]');
const mainVariantId = toVariantId(mainVariantInput ? mainVariantInput.value : null);
if (!mainVariantId) {
alert('Error: Could not find product variant.');
return;
}
const quantityInput = document.querySelector('input[name="quantity"]') ||
document.querySelector('.quantity-input input') ||
document.querySelector('.quantity__input');
const quantity = quantityInput ? parseInt(quantityInput.value, 10) || 1 : 1;
const items = [];
// === STANDARDIZED PROPERTIES ===
let shippingType = 'Delivery';
if (!isDelivery) shippingType = 'Pickup';
else if (isTerminal) shippingType = 'Terminal Pickup';
const mainItem = {
id: mainVariantId,
quantity: quantity,
properties: {
'Shipping Type': shippingType
}
};
if (isDelivery && !isTerminal) {
if (isResidential) mainItem.properties['Residential Fee'] = 'Yes';
if (isLimitedAccess) mainItem.properties['Limited Access Fee'] = 'Yes';
}
if (!isDelivery && selectedPickup) {
mainItem.properties['Pickup Location'] = selectedPickup;
if (pickupSurcharge > 0) {
mainItem.properties['Pickup Surcharge'] = '$' + pickupSurcharge.toFixed(2);
}
} else if (isTerminal) {
mainItem.properties['Pickup Location'] = 'Nearest freight terminal';
}
items.push(mainItem);
if (isDelivery && !isTerminal) {
if (isResidential && residentialVariantId) {
items.push({ id: residentialVariantId, quantity: 1 });
}
if (isLimitedAccess && limitedAccessVariantId) {
items.push({ id: limitedAccessVariantId, quantity: 1 });
}
}
fetch('/cart/add.js', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ items: items })
})
.then(response => {
if (!response.ok) {
return response.json().then(data => {
throw new Error(data.description || 'Cart add failed');
});
}
return response.json();
})
.then(() => {
document.dispatchEvent(new CustomEvent('cart:refresh'));
document.dispatchEvent(new CustomEvent('cart:open'));
const cartIcon = document.querySelector('[data-cart-toggle], .cart-icon, .header__cart, a[href="/cart"]');
if (cartIcon) cartIcon.click();
else window.location.href = '/cart';
})
.catch(error => {
console.error('Error adding to cart:', error);
alert('Error adding to cart: ' + error.message);
});
}, true);
}
updateVisibility();
updatePrice();
checkCompletion();
});
