Skip to content

Commit

Permalink
options fix
Browse files Browse the repository at this point in the history
  • Loading branch information
vradulescu-bd committed Sep 26, 2024
1 parent a896f5b commit 2be8c7c
Show file tree
Hide file tree
Showing 5 changed files with 71 additions and 43 deletions.
30 changes: 16 additions & 14 deletions _src/blocks/new-prod-boxes/new-prod-boxes.js
Original file line number Diff line number Diff line change
Expand Up @@ -81,20 +81,6 @@ async function updateProductPrice(prodName, prodUsers, prodYears, saveText, pid
let updatedBuyLinkSelector = buyLinkSelector;
if (updatedBuyLinkSelector) {
updatedBuyLinkSelector.href = dynamicBuyLink(updatedBuyLinkSelector, prodName, prodUsers, prodYears, pid);

const dataInfo = {
productId: prodName,
variation: {
price: discount
? +newPrice : +oldPrice,
discounted_price: discount.discounted_price,
variation_name: variant,
currency_label: currencyLabel,
region_id: product.region_id,
},
};

setDataOnBuyLinks(updatedBuyLinkSelector, dataInfo);
}
let priceElement = document.createElement('div');
priceElement.classList.add('hero-aem__prices__box');
Expand Down Expand Up @@ -130,6 +116,22 @@ async function updateProductPrice(prodName, prodUsers, prodYears, saveText, pid
newPriceListed = formatPrice(newPrice, product.currency_iso, product.region_id);
}

const dataInfo = {
productId: prodName,
variation: {
price: newPrice,
oldPrice,
variation_name: variant,
currency_label: currencyLabel,
region_id: product.region_id,
},
};

setDataOnBuyLinks(updatedBuyLinkSelector, dataInfo);

// const currentDomain = getDomain();
// const formattedPriceParams = [mv.model.currency_iso, null, currentDomain];

priceElement.innerHTML = `
<div class="hero-aem__price mt-3">
<div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -62,9 +62,8 @@ createNanoBlock('priceComparison', (code, variant, label, block, productIndex, c
const dataInfo = {
productId: currentProduct.code,
variation: {
price: currentProduct.product.discount
? +currentProduct.product.discount.discounted_price : +currentProduct.product.price,
discounted_price: currentProduct.product.discount?.discounted_price,
price: discounted,
oldPrice: price,
variation_name: currentProduct.variant,
currency_label: currentProduct.product.currency_label,
region_id: currentProduct.product.region_id,
Expand Down
5 changes: 3 additions & 2 deletions _src/blocks/products-sideview/products-sideview.js
Original file line number Diff line number Diff line change
Expand Up @@ -151,9 +151,9 @@ function updateBuyLink(block) {
const dataInfo = {
productId: productCode,
variation: {
price: state.currentProduct.discount
price: state.currentProduct.discount?.discounted_price,
oldPrice: state.currentProduct.discount
? +state.currentProduct.discount.discounted_price : +state.currentProduct.price,
discounted_price: state.currentProduct.discount?.discounted_price,
variation_name: state.currentProduct.variation.variation_name,
currency_label: state.currentProduct.currency_label,
region_id: state.currentProduct.region_id,
Expand All @@ -179,6 +179,7 @@ function updatePrice(block) {

const formattedPrice = formatPrice(resp.price, resp.currency_iso, null, getDomain());

priceEl.dataset.price = resp.price;
priceEl.textContent = `${formattedPrice}`;
})();
}
Expand Down
69 changes: 47 additions & 22 deletions _src/blocks/products/products.js
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,6 @@ function customRound(value) {
* @returns a model
*/
function toModel(productCode, variantId, v) {
const currentDomain = getDomain();
const formattedPriceParams = [v.currency_iso, null, currentDomain];
return {
productCode,
variantId,
Expand All @@ -55,22 +53,24 @@ function toModel(productCode, variantId, v) {
devices: +v.variation.dimension_value,
subscription: v.variation.years * 12,
version: v.variation.years ? 'yearly' : 'monthly',
basePrice: formatPrice(+v.price, ...formattedPriceParams),
basePrice: +v.price,
// eslint-disable-next-line max-len
actualPrice: formatPrice(v.discount ? +v.discount.discounted_price : +v.price, ...formattedPriceParams),
monthlyBasePrice: formatPrice(customRound(v.price / 12), ...formattedPriceParams),
discountedPrice: formatPrice(v.discount?.discounted_price, ...formattedPriceParams),
discountedMonthlyPrice: formatPrice(v.discount
? customRound(v.discount.discounted_price / 12)
: 0, ...formattedPriceParams),
discount: formatPrice(v.discount
actualPrice: v.discount ? +v.discount.discounted_price : +v.price,
monthlyBasePrice: customRound(v.price / 12),
discountedPrice: v.discount?.discounted_price,
discountedMonthlyPrice: v.discount
? v.discount.discounted_price / 12
: 0,
discount: v.discount
? customRound((v.price - v.discount.discounted_price) * 100) / 100
: 0, ...formattedPriceParams),
: 0,
discountRate: v.discount
? Math.floor(((v.price - v.discount.discounted_price) / v.price) * 100)
: 0,
currency: v.currency_label,
currency_iso: v.currency_iso,
url: generateProductBuyLink(v, productCode),
test: {},
};
}

Expand Down Expand Up @@ -186,14 +186,25 @@ function renderOldPrice(mv, text = '', monthly = '') {
const oldPriceElt = root.querySelector('span');

mv.subscribe(() => {
const currentDomain = getDomain();
const formattedPriceParams = [mv.model.currency_iso, null, currentDomain];

let oldPrice = 0;

if (mv.model.discountedPrice) {
oldPriceElt.innerHTML = monthly.toLowerCase() === 'monthly'
? `${text} <del>${mv.model.monthlyBasePrice} <sup>/mo</sup></del>`
: `${text} <del>${mv.model.basePrice}</del>`;
if (monthly.toLowerCase() === 'monthly') {
oldPrice = mv.model.monthlyBasePrice;
oldPriceElt.innerHTML = `${text} <del>${formatPrice(mv.model.monthlyBasePrice, ...formattedPriceParams)} <sup>/mo</sup></del>`;
} else {
oldPrice = mv.model.basePrice;
oldPriceElt.innerHTML = `${text} <del>${formatPrice(mv.model.basePrice, ...formattedPriceParams)}</del>`;
}
oldPriceElt.style.visibility = 'visible';
} else {
oldPriceElt.style.visibility = 'hidden';
}

mv.model.test.oldPrice = oldPrice;
});

return root;
Expand All @@ -219,18 +230,28 @@ function renderPrice(mv, text = '', monthly = '', monthTranslation = 'mo') {
const priceElt = root.querySelector('strong');

mv.subscribe(() => {
const currentDomain = getDomain();
const formattedPriceParams = [mv.model.currency_iso, null, currentDomain];

let price;
if (monthly.toLowerCase() === 'monthly') {
if (mv.model.discountedPrice) {
priceElt.innerHTML = `${text} ${mv.model.discountedMonthlyPrice} <sup>/${monthTranslation}</sup>`;
price = mv.model.discountedMonthlyPrice;
priceElt.innerHTML = `${text} ${formatPrice(mv.model.discountedMonthlyPrice, ...formattedPriceParams)} <sup>/${monthTranslation}</sup>`;
} else {
priceElt.innerHTML = `${text} ${mv.model.monthlyBasePrice} <sup>/${monthTranslation}</sup>`;
price = mv.model.monthlyBasePrice;
priceElt.innerHTML = `${text} ${formatPrice(mv.model.monthlyBasePrice, ...formattedPriceParams)} <sup>/${monthTranslation}</sup>`;
}
} else if (mv.model.discountedPrice) {
priceElt.innerHTML = `${text} ${mv.model.discountedPrice}`;
price = mv.model.discountedPrice;
priceElt.innerHTML = `${text} ${formatPrice(mv.model.discountedPrice, ...formattedPriceParams)}`;
} else {
priceElt.innerHTML = `${text} ${mv.model.basePrice}`;
price = mv.model.basePrice;
priceElt.innerHTML = `${text} ${formatPrice(mv.model.basePrice, ...formattedPriceParams)}`;
}

mv.model.test.price = price;

trackProduct(mv.model);
});

Expand Down Expand Up @@ -375,11 +396,13 @@ function renderFeaturedSavings(mv, text = 'Save', percent = '') {
*/
function renderLowestPrice(code, variant, monthly = '', text = '') {
const root = document.createElement('p');

fetchProduct(code, variant).then((product) => {
const currentDomain = getDomain();
const formattedPriceParams = [product.currency_iso, null, currentDomain];
const m = toModel(code, variant, product);
const isMonthly = monthly.toLowerCase() === 'monthly';
const price = isMonthly ? customRound(m.actualPrice / 12) : m.actualPrice;
// eslint-disable-next-line max-len
const price = formatPrice(isMonthly ? customRound(m.actualPrice / 12) : m.actualPrice, ...formattedPriceParams);
root.innerHTML = `${text.replace('0', `${price}`)}`;
});

Expand Down Expand Up @@ -431,11 +454,13 @@ export default function decorate(block) {
col.querySelectorAll('.button-container a').forEach((link) => {
if (link && (link.href.includes('/site/Store/buy/') || link.href.includes('checkout.bitdefender.com'))) {
link.href = card.url;
// console.log('test', mv.model.test)

const dataInfo = {
productId: card.productCode,
variation: {
price: card.actualPrice,
discounted_price: card.discountedPrice,
price: card.test.price,
oldPrice: card.test.oldPrice,
variation_name: card.variantId,
currency_label: card.currency,
region_id: card.regionId,
Expand Down
5 changes: 3 additions & 2 deletions _src/scripts/utils/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -328,9 +328,10 @@ export function setDataOnBuyLinks(element, dataInfo) {
const { productId, variation } = dataInfo;
if (productId) element.dataset.product = productId;

element.dataset.buyPrice = variation.discounted_price || variation.price || 0;
// element.dataset.buyPrice = variation.discounted_price || variation.price || 0;

if (variation.price) element.dataset.oldPrice = variation.price;
if (variation.price) element.dataset.buyPrice = variation.price;
if (variation.oldPrice) element.dataset.oldPrice = variation.oldPrice;
if (variation.currency_label) element.dataset.currency = variation.currency_label;
if (variation.region_id) element.dataset.region = variation.region_id;
if (variation.variation_name) element.dataset.variation = variation.variation_name;
Expand Down

0 comments on commit 2be8c7c

Please sign in to comment.