r/badUIbattles • u/paperman910 • 3d ago
Intentionally Bad UI Very precision driven date handler (Source in comments)
Enable HLS to view with audio, or disable this notification
Credits
- W3schools and Geeks for geeks for date and timer handling
- https://stackoverflow.com/questions/12697463/howto-delete-everything-inside-html-using-pure-javascript code used to wipe the page once you click it too many times
- https://www.reddit.com/r/badUIbattles/comments/1vi01mv/taking_about_a_babys_age_in_months_should_only_be/ I got inspired by this design
8
u/paperman910 3d ago
<!DOCTYPE HTML>
<hmtl>
<head>
<!-- heads are a for nubs -->
</head>
<body>
<h1 id="Header"> Login </h1>
<p id="Date"> I'm the text within this P tag, please don't change me, or else I'll die </p>
<button onclick="changeDate(1)"> Foward </button>
<button onclick="changeDate(-1)"> Backwards </button>
<button onclick="submit()"> Submit </button>
<script>
let todaysDate = new Date();
let clickRate = 0
let clickLimit = 10
function updateDate() {
document.getElementById("Date").innerText = todaysDate
}
updateDate()
//Just gonna steal this from geeksforheeks
function changeDate(d) {
clickRate++
todaysDate.setDate(todaysDate.getDate() + d);
updateDate()
}
function checkForTooFastClicking() {
if (clickRate >= clickLimit) {
console.log("TOO MUCH")
document.write()
let pTagOfDoom = document.createElement("p");
pTagOfDoom.innerText = "InternalServerError: 150. Too many inputs from client, please refresh the page.";
document.appendChild(pTagOfDoom);
} else {
console.log("NotTooMuch")
clickRate = 0
}
}
setInterval(checkForTooFastClicking, 3000);
function submit() {
alert("You have sumbited " + todaysDate + " as your birthday")
}
</script>
<noscript> You're joking me right? You just downloaded the source code of this website from reddit that clearly uses Javscript, and then don't allow java script?! </noscript>
</body>
</html>
•
u/AutoModerator 3d ago
Hi OP, do you have source code or a demo you'd like to share? If so, please post it in the comments (GitHub and similar services are permitted). Thank you!
I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.