Skip to content

Instantly share code, notes, and snippets.

@kelilipan

kelilipan/1-wishlish-calculator-script.js

Last active March 1, 2025 02:05
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save kelilipan/e321fe3724d221b2b204408e8338ba14 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save kelilipan/e321fe3724d221b2b204408e8338ba14 to your computer and use it in GitHub Desktop.
Download ZIP
wishlist-collection-price-calculator
Raw
1-wishlish-calculator-script.js
function showPriceCalculator() {
// Function to find all price and name elements and calculate total
function calculateTotalPrice() {
// Find all price elements
const priceElements = document.querySelectorAll('[data-testid="linkProductPrice"]');
// Find all name elements
const nameElements = document.querySelectorAll('[data-testid="linkProductName"]');
// Initialize items array
const items = [];
// Extract prices and names
// We'll use the smaller length of the two arrays to avoid errors
const count = Math.min(priceElements.length, nameElements.length);
for (let i = 0; i < count; i++) {
// Get price
const priceText = priceElements[i].textContent || priceElements[i].innerText;
// Extract only digits (removing Rp, dots, etc)
const priceStr = priceText.replace(/[^\d]/g, '');
const price = parseInt(priceStr) || 0;
// Get name
const name = nameElements[i].textContent || nameElements[i].innerText;
// Add to items array
items.push({
name: name.trim(),
price: price
});
}
// Handle case where there are more prices than names
if (priceElements.length > nameElements.length) {
for (let i = count; i < priceElements.length; i++) {
const priceText = priceElements[i].textContent || priceElements[i].innerText;
const priceStr = priceText.replace(/[^\d]/g, '');
const price = parseInt(priceStr) || 0;
items.push({
name: `Item ${i + 1}`,
price: price
});
}
}
// Calculate total price
const total = items.reduce((sum, item) => sum + item.price, 0);
return { items, total };
}
// Helper function to format number as Rupiah
function formatRupiah(number) {
return new Intl.NumberFormat('id-ID').format(number);
}
// Clear any existing price table
const existingTable = document.getElementById('price-calculator-table');
if (existingTable) {
existingTable.remove();
}
// Get items and total
const { items, total } = calculateTotalPrice();
// Create container for the table
const container = document.createElement('div');
container.id = 'price-calculator-table';
container.style.position = 'fixed';
container.style.bottom = '20px';
container.style.right = '20px';
container.style.backgroundColor = 'white';
container.style.padding = '10px';
container.style.border = '1px solid #ccc';
container.style.borderRadius = '5px';
container.style.boxShadow = '0 0 10px rgba(0,0,0,0.1)';
container.style.zIndex = '9999';
container.style.maxWidth = '80%';
container.style.maxHeight = '80vh';
container.style.overflow = 'auto';
// Create table
const table = document.createElement('table');
table.style.borderCollapse = 'collapse';
table.style.width = '100%';
// Add header
const header = document.createElement('tr');
const headerCell1 = document.createElement('th');
headerCell1.textContent = 'Produk';
headerCell1.style.padding = '5px 10px';
headerCell1.style.textAlign = 'left';
const headerCell2 = document.createElement('th');
headerCell2.textContent = 'Harga';
headerCell2.style.padding = '5px 10px';
headerCell2.style.textAlign = 'right';
header.appendChild(headerCell1);
header.appendChild(headerCell2);
table.appendChild(header);
// Add each item as a row
items.forEach((item, index) => {
const row = document.createElement('tr');
const nameCell = document.createElement('td');
nameCell.textContent = item.name;
nameCell.style.padding = '5px 10px';
nameCell.style.borderTop = '1px solid #eee';
nameCell.style.maxWidth = '280px';
nameCell.style.wordBreak = 'break-word';
const priceCell = document.createElement('td');
priceCell.textContent = `Rp${formatRupiah(item.price)}`;
priceCell.style.padding = '5px 10px';
priceCell.style.textAlign = 'right';
priceCell.style.borderTop = '1px solid #eee';
priceCell.style.whiteSpace = 'nowrap';
row.appendChild(nameCell);
row.appendChild(priceCell);
table.appendChild(row);
});
// Add total row
const totalRow = document.createElement('tr');
totalRow.style.fontWeight = 'bold';
const totalLabelCell = document.createElement('td');
totalLabelCell.textContent = 'Total';
totalLabelCell.style.padding = '5px 10px';
totalLabelCell.style.borderTop = '2px solid #ccc';
const totalValueCell = document.createElement('td');
totalValueCell.textContent = `Rp${formatRupiah(total)}`;
totalValueCell.style.padding = '5px 10px';
totalValueCell.style.textAlign = 'right';
totalValueCell.style.borderTop = '2px solid #ccc';
totalRow.appendChild(totalLabelCell);
totalRow.appendChild(totalValueCell);
table.appendChild(totalRow);
container.appendChild(table);
// Add close button
const closeButton = document.createElement('button');
closeButton.textContent = '×';
closeButton.style.position = 'absolute';
closeButton.style.top = '5px';
closeButton.style.right = '5px';
closeButton.style.background = 'none';
closeButton.style.border = 'none';
closeButton.style.fontSize = '16px';
closeButton.style.cursor = 'pointer';
closeButton.onclick = function() {
document.body.removeChild(container);
};
container.appendChild(closeButton);
// Show item count
const countDiv = document.createElement('div');
countDiv.textContent = `Found ${items.length} items`;
countDiv.style.fontSize = '12px';
countDiv.style.color = '#666';
countDiv.style.marginTop = '5px';
container.appendChild(countDiv);
// Add to page
document.body.appendChild(container);
// Return the number of items found and total for console feedback
return `Found ${items.length} items with a total of Rp${formatRupiah(total)}`;
}
showPriceCalculator()
Raw
how-to-use.md

Just copy script.js and paste it into the console. image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment