Adds an on screen number pad to click on to fill in a haggle price at stores.
// ==UserScript==
// @name GC - Shop Numpad
// @namespace https://greasyfork.org/en/users/1202961-twiggies
// @version 1.0
// @description Adds an on screen number pad to click on to fill in a haggle price at stores.
// @author Twiggies
// @match https://www.grundos.cafe/buyitem/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=grundos.cafe
// @grant none
// @license MIT
// ==/UserScript==
let buyID = location.pathname;
const formArea = document.querySelector(`form[action="${buyID}"]`);
if (formArea != null) {
let inputArea = formArea.querySelector('div.flex-column')
let offerInput = inputArea.querySelector('div.center-items:not([style*="display:none"]) div input')
const numpadStyles = `#twigsNumPad {
width:300px;
height:200px;
display: grid;
gap: 1px;
grid-template-columns: 30% 30% 30% 10%;
margin:auto;
}
.twigsNumpadBtn {
padding:5px;
outline: 1px solid black;
user-select: none;
}
.twigsNumpadBtn:hover {
background-color:#bbb;
}
#twigsNum0 {
grid-column:1/3;
}
#twigsNumEnter {
grid-row:1/5;
grid-column-start:4;
}`
let numpadStylesheet = document.createElement("style");
numpadStylesheet.innerText = numpadStyles;
document.head.appendChild(numpadStylesheet);
formArea.querySelector('input[value="Submit Offer!"]').insertAdjacentHTML('afterend',`<div id="twigsNumPad" >
<div class="twigsNumpadBtn" id="twigsNumEnter">
E
</div>
<div class="twigsNumpadBtn">
7
</div>
<div class="twigsNumpadBtn">
8
</div>
<div class="twigsNumpadBtn">
9
</div>
<div class="twigsNumpadBtn">
4
</div>
<div class="twigsNumpadBtn">
5
</div>
<div class="twigsNumpadBtn">
6
</div>
<div class="twigsNumpadBtn">
1
</div>
<div class="twigsNumpadBtn">
2
</div>
<div class="twigsNumpadBtn">
3
</div>
<div class="twigsNumpadBtn" id="twigsNum0">
0
</div>
<div class="twigsNumpadBtn">
Clear
</div>
</div>`)
//Get the newly added buttons.
const numpadButtons = document.getElementsByClassName('twigsNumpadBtn');
//Loop through the buttons to add the appropriate events to it, based on what the button is.
for (let i = 0; i < numpadButtons.length; i++) {
const currentBtn = numpadButtons[i];
//If button is E, then click the Submit Offer! button.
if (currentBtn.innerText == "E") {
currentBtn.onclick = function() {
formArea.querySelector('input[value="Submit Offer!"]').click();
}
}
//If button is Clear, then empty the haggle input.
else if (currentBtn.innerText == "Clear") {
currentBtn.onclick = function() {
offerInput.value = '';
}
}
//Otherwise the button should be a number, so append that value onto the end of the haggle input.
else {
currentBtn.onclick = function() {
console.log(this);
offerInput.value = offerInput.value + this.innerText;
}
}
}
}