When you go to start an auction, there will be a popup to double-check values.
// ==UserScript==
// @name Neopets Auction Safely
// @version 2024.12.29
// @description When you go to start an auction, there will be a popup to double-check values.
// @match https://www.neopets.com/inventory.phtml
// @icon https://images.neopets.com/new_shopkeepers/t_1900.gif
// @author Posterboy
// @namespace https://greasyfork.org/users/1277376
// @run-at document-end
// @grant none
// ==/UserScript==
(function() {
'use strict';
// Inject custom CSS for the dialog and new button
const style = document.createElement('style');
style.textContent = `
/* Custom Confirmation Dialog */
.customConfirmDialog {
max-width: 440px;
border-radius: 15px;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
z-index: 1000;
display: none;
}
.customConfirmDialog .popup-header__2020 {
background-color: #E6E4DD;
border-bottom: 1px solid #949494;
padding: 10px;
position: relative;
}
.customConfirmDialog .popup-body__2020 {
padding: 10px;
}
.customConfirmDialog .popup-footer__2020 {
display: flex;
justify-content: center;
padding: 10px;
}
.customConfirmDialog .button-default__2020 {
padding: 2px 5px 7px 5px !important;
border-radius: 12px;
min-height: 25px;
cursor: pointer;
border: none;
color: #fff;
}
.customConfirmDialog .button-yellow__2020 {
background-color: #ffcc00;
margin-right: 10px;
}
.customConfirmDialog .button-red__2020 {
background-color: #ff6666;
}
.customConfirmDialog .inv-popup-exit {
position: absolute;
right: 10px;
top: 10px;
cursor: pointer;
}
/* Custom Button */
.customButton {
background-color: #ffcc00;
color: #fff;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
}
.customButton:hover {
background-color: #e6b800;
}
`;
document.head.appendChild(style);
// Create the HTML for the custom dialog
const dialogHtml = `
<div id="customConfirmDialog" class="customConfirmDialog">
<div class="popup-header__2020">
<h3>Confirm Auction</h3>
<div class="inv-popup-exit button-default__2020 button-red__2020" id="dialogClose">
<div class="button-x__2020"></div>
</div>
</div>
<div class="popup-body__2020">
<p id="customDialogMessage"></p>
</div>
<div class="popup-footer__2020">
<button id="customDialogConfirm" class="button-default__2020 button-yellow__2020">Yes</button>
<button id="customDialogCancel" class="button-default__2020 button-red__2020">No</button>
</div>
</div>
`;
document.body.insertAdjacentHTML('beforeend', dialogHtml);
function formatNumberWithCommas(number) {
return number.toLocaleString();
}
function showCustomDialog(message, callback) {
const dialog = document.getElementById('customConfirmDialog');
const messageElem = document.getElementById('customDialogMessage');
const confirmButton = document.getElementById('customDialogConfirm');
const cancelButton = document.getElementById('customDialogCancel');
const closeButton = document.getElementById('dialogClose');
messageElem.textContent = message;
dialog.style.display = 'block';
confirmButton.onclick = function() {
dialog.style.display = 'none';
callback(true);
};
cancelButton.onclick = function() {
dialog.style.display = 'none';
callback(false);
};
closeButton.onclick = function() {
dialog.style.display = 'none';
callback(false);
};
window.onclick = function(event) {
if (event.target === dialog) {
dialog.style.display = 'none';
callback(false);
}
};
}
// Function to replace the button
function replaceButton() {
// Find the button with the exact onclick attribute
const existingButton = Array.from(document.querySelectorAll('.button-default__2020.button-yellow__2020.btn-single__2020'))
.find(button => button.getAttribute('onclick') === 'auctionItem()');
if (existingButton) {
console.log('Existing button found:', existingButton);
// Replace the existing button with the custom button
existingButton.innerHTML = 'Proceed to Confirmation';
existingButton.className = 'customButton';
existingButton.onclick = function(event) {
event.preventDefault(); // Prevent the default action
// Retrieve values from input fields
const startPriceElem = document.querySelector('input[name="start_price"]');
const minIncrementElem = document.querySelector('input[name="min_increment"]');
// Remove commas before parsing the values as floats
let startPrice = parseFloat(startPriceElem ? startPriceElem.value.replace(/,/g, '') : 0);
let minIncrement = parseFloat(minIncrementElem ? minIncrementElem.value.replace(/,/g, '') : 0);
// Calculate total and format with commas
let total = startPrice + minIncrement;
let formattedTotal = formatNumberWithCommas(total);
// Show confirmation dialog with formatted total
showCustomDialog(`Are you sure you wish to auction this item starting at ${formattedTotal} Neopoints?`, function(confirmed) {
if (confirmed) {
// Call the original auctionItem function
if (typeof auctionItem === 'function') {
auctionItem();
} else {
console.error('auctionItem function not found.');
}
}
});
};
} else {
console.error('Specific auction button not found.');
}
}
// Use MutationObserver to handle dynamic content
const observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList') {
replaceButton();
}
});
});
// Start observing the body for changes
observer.observe(document.body, { childList: true, subtree: true });
// Initial attempt to replace the button
replaceButton();
})();