';
} else {
pdpTemplate += '
";
pdpTemplate += '
';
pdpTemplate += '
';
pdpTemplate += '
';
if (recurpay.checkout == "shopify") {
pdpTemplate += '
';
}
pdpTemplate = pdpTemplate
.split("[[SAVING_AMOUNT]]")
.join("
");
pdpTemplate = pdpTemplate
.split("[[DISCOUNT_PERCENTAGE]]")
.join("
");
return pdpTemplate;
}
function updateGeneralSettings(primary_background,primary_foreground,secondary_background) {
let settings_url=recurpay.generalURL+'/storefront/api/2024-07/widgets/configurations?'+recurpay.urlParam;
$.ajax( {
url:settings_url,type:"POST",data: {
subscription_brand_color:primary_background,subscription_button_color:primary_background,subscription_button_text_color:primary_foreground,subscription_secondary_color:secondary_background,cart_upsell_brand_color:primary_background,cart_upsell_button_color:primary_background,cart_upsell_button_text_color:primary_foreground,cart_upsell_secondary_color:secondary_background
},
success:function(response) {
console.log(response);
},
error:function(error) {
console.log(error);
}
});
}
function renderRecurpayAppBlockWidget($appBlock) {
if ($appBlock.find('.recurpay-pdp-widget').length) return;
let $productContainer = $appBlock.closest(productContainerSelector);
let $form = $productContainer.find(atcFormSelector).first();
if (!$form.length) {
$form = $productContainer.find('form').filter(function() {
return $(this).find('input[name="id"], input[ref="variantId"]').length > 0;
}).first();
}
let product_id = $form.find('input[name="product-id"]').val() || $appBlock.closest('[data-product-id]').attr('data-product-id') || recurpay.product.id;
let default_variant_id = $form.find('input[name="id"], select[name="id"], input[ref="variantId"]').val();
$appBlock.append(`
`);
var pid = String(product_id);
var plans = recurpay.globalPlanObjectMap && recurpay.globalPlanObjectMap[pid];
if (plans && plans.length) {
$appBlock.find('.recurpay-pdp-widget').html(recurPDP({ id: pid, plans: plans }));
recurpay.settings && recurpay.settings.sell_only_as_subscription === true
? updateSelectors(true)
: updateSelectors();
var v = default_variant_id || recurpay.product.availableVariant;
if (v) {
recurDiscountedPrice(v);
recurpay.handlePlanOnVariant(v);
}
}
}
if ($(document).find(appBlockSelector).length > 0) {
var recurpayReinjectTimer = null;
var run = function () {
$(appBlockSelector).each(function () {
renderRecurpayAppBlockWidget($(this));
});
};
run();
new MutationObserver(function () {
clearTimeout(recurpayReinjectTimer);
recurpayReinjectTimer = setTimeout(run, 50);
}).observe(document.body, { childList: true, subtree: true });
}
else if($(pdpSelector).length <= 0) {
if(window.location.href.indexOf("/products/") > -1 && $(document).find(appBlockSelector).length <= 0) {
if($(atcFormSelector).find(atcSelector).filter(':visible').length) {
if($(atcFormSelector).find(atcSelector).filter(':visible').first().parent().css('display') == 'flex' && $(atcFormSelector).find(atcSelector).filter(':visible').first().parent().css('flex-direction') == 'row') {
$(atcFormSelector).find(atcSelector).filter(':visible').first().parent().before('
');
}
else if($(atcFormSelector).find(atcSelector).filter(':visible').first().parent().css('display') == 'grid' || $(atcFormSelector).find(atcSelector).filter(':visible').first().parent().css('display') == 'inline-grid') {
$(atcFormSelector).find(atcSelector).filter(':visible').first().parent().before('
');
}
else {
if($(atcFormSelector).parents('.product__info-container').find(atcSelector).length) {
$(atcFormSelector).parents('.product__info-container').find(atcSelector).filter(':visible').first().before('
');
}
else {
$(atcFormSelector).find(atcSelector).filter(':visible').first().before('
');
}
}
if($(pdpSelector).parent().css('position') == 'fixed' || $(pdpSelector).parent().css('position') == 'sticky' || $(pdpSelector).parent().css('position') == 'absolute' ) {
$(pdpSelector).parent().addClass("recurpay-z-index");
}
}
else if($(atcFormSelector).find(atcSelector).length) {
if($(atcFormSelector).find(atcSelector).first().parent().css('display') == 'flex' && $(atcFormSelector).find(atcSelector).filter(':visible').first().parent().css('flex-direction') == 'row') {
$(atcFormSelector).find(atcSelector).first().parent().before('
');
}
else {
$(atcFormSelector).find(atcSelector).first().before('
');
}
if($(pdpSelector).parent().css('position') == 'fixed' || $(pdpSelector).parent().css('position') == 'sticky' || $(pdpSelector).parent().css('position') == 'absolute' ) {
$(pdpSelector).parent().addClass("recurpay-z-index");
}
}
else {
$(atcFormSelector).append('
')
}
}
}
if($(pdpSelector).length) {
recurpay.allProducts = [];
for(i=0;i<$(pdpSelector).length; i++) {
if($(pdpSelector).eq(i).attr("data-product-id") != undefined && $(pdpSelector).eq(i).attr("data-product-available") != undefined ) {
recurpay.allProducts.push($(pdpSelector).eq(i).attr("data-product-id"));
}
}
$.ajax({
url: recurpay.pdpAPI,
type: 'POST',
async: true,
contentType: 'application/json',
data: JSON.stringify({
products: recurpay.allProducts.map(id => ({ id: parseInt(id) }))
}),
success: function(response) {
const payload = response?.data || {};
const rawProducts = Array.isArray(payload.products) ? payload.products : [];
const settings = payload.configurations || {};
const store = payload.store || {};
const productMap = {};
rawProducts.forEach(function(product) {
if (!product || !product.id) return;
const productId = String(product.id);
if (!productMap[productId]) {
productMap[productId] = {
...product,
plans: Array.isArray(product.plans) ? [...product.plans] : [],
variants: Array.isArray(product.variants) ? [...product.variants] : []
};
} else {
const existing = productMap[productId];
if (Array.isArray(product.plans)) {
existing.plans = existing.plans.concat(product.plans);
}
if ((!existing.variants || !existing.variants.length) && Array.isArray(product.variants)) {
existing.variants = product.variants;
}
}
});
const normalizedProducts = Object.values(productMap).map(function(product) {
return {
...product,
plans: normalizeProductPlans(product)
};
});
if (!normalizedProducts.length) {
console.log("No products found in widget response", response);
return;
}
const productsWithPlans = normalizedProducts.filter(function(product) {
return Array.isArray(product.plans) && product.plans.length;
});
if (!productsWithPlans.length) {
console.log("No product/plans found in widget response", response);
return;
}
recurpay.productDatas = normalizedProducts.map(function(product) {
return { product: product };
});
if (settings.is_one_time_purchase_default === true) {
recurpay.subscriptionFirst = false;
} else {
recurpay.subscriptionFirst = true;
}
if (settings.is_one_time_purchase_first === true) {
recurpay.oneTimePurchaseFirst = true;
} else {
recurpay.oneTimePurchaseFirst = false;
}
recurpay.multiply_price_with_quantity = !!settings.is_price_multiplied_by_quantity;
recurpay.show_price_in_freq_dropdown = !!settings.is_price_shown_in_frequency;
if (settings.default_purchase_redirection !== undefined) {
recurpay.action = settings.default_purchase_redirection;
}
if (settings.is_manual_payment_subscription !== undefined) {
recurpay.manualPaymentSubscription = !!settings.is_manual_payment_subscription;
}
if (settings.translations && !$.isEmptyObject(settings.translations)) {
recurpay.settings = settings;
recurpay.hasScript = !!settings.has_scripts;
let brandPrimaryBg = recurpay.shop_brand_primary_background_color;
let brandPrimaryFg = recurpay.shop_brand_primary_foreground_color;
let brandSecondaryBg = recurpay.shop_brand_secondary_background_color;
if (
settings.snippet_color_codes &&
settings.snippet_color_codes.is_default_widget_configuration &&
(brandPrimaryBg || brandSecondaryBg)
) {
document.documentElement.style.setProperty('--recurpay_primary_color', brandPrimaryBg);
document.documentElement.style.setProperty('--recurpay_secondary_color', brandSecondaryBg);
document.documentElement.style.setProperty('--recurpay_button_text_color', brandPrimaryFg);
document.documentElement.style.setProperty('--recurpay_button_bg_color', brandPrimaryBg);
document.documentElement.style.setProperty('--recurpay_savings_bg_color', recurpay.hexToRgbA(brandPrimaryBg));
updateGeneralSettings(brandPrimaryBg, brandPrimaryFg, brandSecondaryBg);
} else if (settings.snippet_color_codes) {
document.documentElement.style.setProperty('--recurpay_primary_color', settings.snippet_color_codes.subscription_brand_color);
document.documentElement.style.setProperty('--recurpay_secondary_color', settings.snippet_color_codes.subscription_secondary_color);
document.documentElement.style.setProperty('--recurpay_button_text_color', settings.snippet_color_codes.subscription_button_text_color);
document.documentElement.style.setProperty('--recurpay_button_bg_color', settings.snippet_color_codes.subscription_button_color);
document.documentElement.style.setProperty('--recurpay_savings_bg_color', recurpay.hexToRgbA(settings.snippet_color_codes.subscription_brand_color));
}
}
recurpay.globalPlanObjectMap = recurpay.globalPlanObjectMap || {};
normalizedProducts.forEach(function(product) {
const normalizedProduct = {
id: parseInt(product.id, 10),
plans: Array.isArray(product.plans) ? product.plans : [],
variants: Array.isArray(product.variants) ? product.variants : []
};
if (!normalizedProduct.plans.length) return;
recurpay.globalPlanObjectMap[String(normalizedProduct.id)] = normalizedProduct.plans;
const pdpHTML = recurPDP(normalizedProduct);
const getElem = $('.recurpay-pdp-widget[data-product-id="' + normalizedProduct.id + '"]');
if ($(getElem).length && $(getElem).attr("data-product-available") == "true") {
$(getElem).html(pdpHTML);
}
if (normalizedProduct.variants.length) {
const variantId = recurpay.product.availableVariant || normalizedProduct.variants[0].id;
recurDiscountedPrice(variantId);
recurpay.handlePlanOnVariant(variantId);
}
});
recurpay.hasScript = settings.has_scripts || false;
if (
recurpay.product.availableVariant !== "" &&
recurpay.product.availableVariant !== undefined
) {
recurpay.product.selectedVariant = recurpay.product.availableVariant;
recurDiscountedPrice(recurpay.product.availableVariant);
recurpay.handlePlanOnVariant(recurpay.product.availableVariant);
} else {
const firstProductWithVariants = normalizedProducts.find(function(product) {
return Array.isArray(product.variants) && product.variants.length;
});
}
if (settings.sell_only_as_subscription === true) {
updateSelectors(true);
} else {
updateSelectors();
}
if (store.created_at) {
const createdDate = new Date(store.created_at);
const releaseDate = new Date('2024-07-16T00:00:00.000Z');
if (createdDate.toISOString().split('T')[0] < releaseDate.toISOString().split('T')[0]) {
$(footerManageSubcriptionSelector).hide();
}
}
fetchVariants();
},
error: function(xhr) {
console.log("PDP widget load failed", xhr);
}
});
}
else {
if((window.location.href.indexOf("/products/") > -1) && (window.location.href.indexOf("recurpay_preview=true") > -1)) {
var domain_array = recurpay.shopDomainURL.split('.');
var domain_string = domain_array[0];
var recurpay_domain = 'https://' + domain_string + '.recurpay.com';
var modalHTML = "";
modalHTML += '
'
modalHTML += '
'
modalHTML += '
'
modalHTML += '
'
modalHTML += ''
modalHTML += '
'
modalHTML += '
'
modalHTML += '
Looks like the subscription option is not visible on your store due to some conflict with theme. Talk to us on Live Chat to get it resolved instantly '
modalHTML += '
'
modalHTML += '
'
if($('[data-recurpay-visibility-modal]').length <= 0) {
if($('body').length) {
$('body').append(modalHTML);
}
else if($('html').length) {
$('html').append(modalHTML);
}
}
}
if((window.location.href.indexOf("/products/") > -1)) {
recurpay.logEvent("product_widget","Failed to show product snippet", "critical");
}
}
function recurProperties(e){var a=$(e).parents(pdpSelector);if($(a).find("[name='recurpay__group_main'][value='subscription']").is(":checked")){var r=$(a).find('[name="recurpay-input"] option:selected').attr("data-plan-name"),t=$(a).find('[name="recurpay-input"] option:selected').attr("data-plan"),o=e.closest(appBlockSelector).length>0?e.closest(appBlockSelector).parents(appBlockParentSelector).find(atcFormSelector):$(a),i=function(c,n,v){o.find(c).length<=0?o.append(`
`):o.find(c).attr("name",n).val(v)};e.closest(appBlockSelector).length>0?(i(".recurpay_plan_name","properties[_Plan]",r),i(".recurpay_plan_id","properties[_PlanId]",t)):($(a).find(".recurpay_plan_name").attr("name","properties[_Plan]").val(r),$(a).find(".recurpay_plan_id").attr("name","properties[_PlanId]").val(t));if(recurpay.checkout=="shopify"&&recurpay.manualPaymentSubscription)e.closest(appBlockSelector).length>0?(i(".recurpay_manual_plan_id","properties[_RecurpayPlanId]",t),i(".recurpay_manual_payment","properties[_RecurpayManualPaymentSubscription]","1")):($(a).find(".recurpay_manual_plan_id").length<=0?$(a).append(`
`):$(a).find(".recurpay_manual_plan_id").attr("name","properties[_RecurpayPlanId]").val(t),$(a).find(".recurpay_manual_payment").length<=0?$(a).append(`
`):$(a).find(".recurpay_manual_payment").attr("name","properties[_RecurpayManualPaymentSubscription]").val("1"));parseInt(recurpay.subscriptionInfluence&&recurpay.subscriptionInfluenceCount)>=1&&(e.closest(appBlockSelector).length>0?i(".recurpay_purchase_data","properties[_PurchaseData]",recurpay.subscriptionInfluenceCount):$(a).find(".recurpay_purchase_data").attr("name","properties[_PurchaseData]").val(recurpay.subscriptionInfluenceCount));$(a).find(".recurpay__description[data-description-id]").hide();$(a).find('.recurpay__description[data-description-id="'+t+'"]').show();if(recurpay.checkout=="shopify"&&!recurpay.manualPaymentSubscription){var n=$(a).find('[name="recurpay-input"] option:selected').attr("data-selling-plan");e.closest(appBlockSelector).length>0?i(".recurpay_selling_plan_id","selling_plan",n):$(a).find(".recurpay_selling_plan_id").attr("name","selling_plan").val(n);window._RestockRocket&&typeof window._RestockRocket.getSellingPlan=="function"&&($('.restock-rocket-form-input[name="selling_plan"]').attr("name",""),$(".restock-rocket-preorder-description").hide())}else recurpay.checkout=="shopify"&&recurpay.manualPaymentSubscription&&(e.closest(appBlockSelector).length>0?o.find(".recurpay_selling_plan_id").attr("name","").val(""):$(a).find(".recurpay_selling_plan_id").attr("name","").val(""))}else{var o=e.closest(appBlockSelector).length>0?e.closest(appBlockSelector).parents(appBlockParentSelector).find(atcFormSelector):$(a);o.find(".recurpay_plan_name").attr("name","");o.find(".recurpay_plan_id").attr("name","");o.find(".recurpay_purchase_data").attr("name","");o.find(".recurpay_manual_plan_id").attr("name","").val("");o.find(".recurpay_manual_payment").attr("name","").val("");if(recurpay.checkout=="shopify"){o.find(".recurpay_selling_plan_id").attr("name","");window._RestockRocket&&typeof window._RestockRocket.getSellingPlan=="function"&&(p=window._RestockRocket.getSellingPlan(),$(".restock-rocket-form-input").attr("name","selling_plan"),$(".restock-rocket-form-input").val(p.shopify_selling_plan_id),$(".restock-rocket-preorder-description").show())}}offerSavings(a)}
function addSubscription(btn) {
let $appBlock = $(btn).closest(appBlockSelector);
let isInsideAppBlock = $appBlock.length > 0 && $(pdpSelector).closest(appBlockSelector).length > 0;
let $form = null;
if ($appBlock.parents(appBlockParentSelector).length && $appBlock.parents(appBlockParentSelector).find(atcSelector).length) {
$form = isInsideAppBlock ? $appBlock.parents(appBlockParentSelector).find(atcSelector).parents(atcFormSelector) : $(btn).parents(atcFormSelector);
} else if ($appBlock.closest(".product-grid__item").length && $appBlock.closest(".product-grid__item").find(atcSelector).length) {
$form = isInsideAppBlock ? $appBlock.closest(".product-grid__item").find(atcSelector).parents(atcFormSelector) : $(btn).parents(atcFormSelector);
} else {
$form = isInsideAppBlock ? $(atcSelector).parents(atcFormSelector) : $(btn).parents(atcFormSelector);
}
let $variantSelector = $form.find('[name="id"]');
let $quantitySelector = $form.find('[name="quantity"]');
let $inputSelect = isInsideAppBlock ? $appBlock.find(pdpSelector).find('[name="recurpay-input"] option:selected') : $form.find(pdpSelector).find('[name="recurpay-input"] option:selected');
let subscriptionPlanId = $inputSelect.attr('data-plan') || '';
let subscriptionPlanName = $inputSelect.attr('data-plan-name') || '';
let subscriptionPlanType = $inputSelect.attr('data-plan-type') || '';
let planVariant = $variantSelector.length > 0 ? parseInt($variantSelector.val()) : parseInt(recurpay.product.availableVariant);
let planQuantity = $quantitySelector.length > 0 ? parseInt($quantitySelector.val()) : 1;
recurProperties($(btn).closest(pdpSelector).find('[name="recurpay__group_main"]'));
let planParams = {};
if (recurpay.checkout == "shopify") {
let sellingPlanId = isInsideAppBlock
? $appBlock.find(pdpSelector).find('[name="recurpay-input"] option:selected').attr('data-selling-plan')
: $form.find(pdpSelector).find('[name="recurpay-input"] option:selected').attr('data-selling-plan');
planParams = {
id: planVariant,
quantity: planQuantity,
properties: {
'_Plan': subscriptionPlanName,
'_PlanId': subscriptionPlanId
}
};
if (!recurpay.manualPaymentSubscription) {
if (!sellingPlanId || sellingPlanId === 'undefined' || sellingPlanId === 'null') {
console.warn('[Recurpay] selling_plan ID is missing — cannot add subscription to cart.');
return;
}
planParams.selling_plan = sellingPlanId;
}
if (recurpay.manualPaymentSubscription) {
planParams.properties['_RecurpayPlanId'] = subscriptionPlanId;
planParams.properties['_RecurpayManualPaymentSubscription'] = 1;
}
} else {
planParams = {
id: planVariant,
quantity: planQuantity,
properties: {
'_Plan': subscriptionPlanName,
'_PlanId': subscriptionPlanId
}
};
}
if (recurpay.checkout == "recurpay" && !recurpay.prepaidMixedCart && subscriptionPlanType == "prepaid") {
$.getJSON('/cart', function(response) {
response.items = [];
response.items.push(planParams);
recurpay.recurCart(response);
});
} else {
if (recurpay.action === "default" && $(atcFormSelector).find(atcSelector).length) {
if ($form.data("recurpaySubmitting")) return;
$form.data("recurpaySubmitting", true);
try {
if ($form[0].requestSubmit) {
$form[0].requestSubmit();
} else {
$form[0].submit();
}
} finally {
setTimeout(function () {
$form.removeData("recurpaySubmitting");
}, 500);
}
return;
} else {
$.ajax({
type: 'POST',
url: '/cart/add.js',
dataType: 'json',
data: planParams,
success: function() {
if (recurpay.checkout == "recurpay" && recurpay.action == "checkout") {
$.getJSON('/cart', function(response) {
recurpay.recurCart(response);
});
} else if (recurpay.action == "cart") {
document.location.href = '/cart';
} else {
document.location.href = '/checkout';
}
},
error: function(xhr) {
var err = eval("(" + xhr.responseText + ")");
$('[data-recurpay-error]').html(err.description).show().delay(3000).fadeOut();
}
});
}
}
}
function loadRecurpayScripts() {
$.ajax( {
url:recurpay.scriptsAPI,type:'GET',async:true,success:function(htmlContent) {
if(!$.trim(htmlContent))return;
var $tempDiv=$('
').html(htmlContent);
$tempDiv.find('style').each(function() {
$('head').append($('