Button to show and hide order and item numbers on Superbuy
// ==UserScript==
// @name Superbuy show/hide order numbers
// @namespace https://tharglet.me.uk/
// @version 2.0
// @description Button to show and hide order and item numbers on Superbuy
// @author tharglet
// @match https://www.superbuy.com/order
// @match https://www.superbuy.com/order?*
// @icon https://www.google.com/s2/favicons?sz=64&domain=superbuy.com
// @grant GM_addStyle
// @license CC BY-NC-ND 4.0
// ==/UserScript==
GM_addStyle(`
.hideshow-hide {
display: none;
}
#hideshow_toggle_button {
margin-left: 10px;
margin-top: 10px;
padding: 5px 10px;
background-color: white;
border: 1px gray solid;
}`);
(function() {
'use strict';
// Initialise spans
const tableHeaders = document.querySelectorAll('.user_orderlist thead > tr > td');
console.log(tableHeaders);
for (let tableHeader of tableHeaders) {
for (let element of tableHeader.childNodes) {
if (element.nodeType == Node.TEXT_NODE) {
if(element.textContent.indexOf('Order No') > -1) {
const replacementNode = document.createElement('span');
replacementNode.classList.add('hideshow-order-no');
replacementNode.innerHTML = element.textContent;
element.parentNode.insertBefore(replacementNode, element);
element.parentNode.removeChild(element);
}
}
}
}
// Initialise button
const toggleButtonContainer = document.createElement('template');
toggleButtonContainer.innerHTML = '<button id="hideshow_toggle_button">Hide Order IDs</button>';
const statusList = document.getElementsByClassName('status-list')[0];
statusList.after(toggleButtonContainer.content.firstChild);
document.getElementById('hideshow_toggle_button').addEventListener('click', (event) => {
toggleOrderIds();
});
const toggleOrderIds = () => {
const showHideButton = document.getElementById('hideshow_toggle_button');
const hide = showHideButton.textContent.startsWith('Hide');
toggleElements(document.getElementsByClassName('hideshow-order-no'), hide);
toggleElements(document.getElementsByClassName('tno'), hide);
toggleElements(document.querySelectorAll('.user_orderlist_primg > span'), hide);
if(hide) {
showHideButton.textContent = 'Show Order IDs';
} else {
showHideButton.textContent = 'Hide Order IDs';
}
}
const toggleElements = (elements, isHide) => {
for(let element of elements) {
if(isHide) {
element.classList.add('hideshow-hide');
} else {
element.classList.remove('hideshow-hide');
}
}
}
})();