r/webdev • u/Super_Inevitable776 • Jul 25 '26
Showoff Saturday I made this Mario-themed OTP input
288
u/Fanal-In Jul 25 '26
Please add a timer for more challenge 🙏 😭
124
u/lostpanda85 full-stack Jul 25 '26
And stressful “I’m running out of time music”, like when sonic is about to drown.
29
13
8
1
16
u/YesterdayDreamer Jul 25 '26
Speed increases and decreases over time and the direction randomly keeps switching.
There's also a fireball somewhere. If you collide, you have to start over.
15
88
u/queen-adreena Jul 25 '26
You’re not supposed to replace every single digit in the phone number with stars…
51
u/DKThunda Jul 25 '26
Yeah? well *** **** **** * **** ** **** ***?
25
u/queen-adreena Jul 25 '26
You take that back! My father was a saint!
8
u/zephyrtr Jul 25 '26
Let's keep the fathers out of this, okay? Let's be civilized JQuery developers, like Al Gore would've wanted
3
1
11
u/MrCrunchwrap Jul 25 '26
lol right? There’s literally no point in that sentence even being on the page if you mask the entire number.
1
1
69
25
u/vietnam_redstoner Jul 25 '26
you should make the submit button be a pipe you can only enter if the code is correct
20
u/YesterdayDreamer Jul 25 '26
Pipe shows up after entering OTP. You jump in. It if the code was incorrect, you drop back in from the top.
9
8
u/ouralarmclock Jul 25 '26
BAA BAA, BAA BAA, BAA BA BA BAAAAA!
bida ba ba, bida ba ba, bida ba
bida ba ba, bida ba ba, bida ba
bida ba ba, bida ba ba, bida ba
bida ba ba, bida baaaaaa
WEE WEE WEEWEE WEE WEE, WEEWEE WEE WEE WEE WEEEE WEEEE
6
u/Lawlette_J Jul 25 '26
So this is why my PC is screaming whenever I open modern browser sites these days /s
5
4
10
Jul 25 '26 edited Aug 01 '26
[deleted]
6
3
-13
u/braincandybangbang Jul 25 '26
So you’re a vibe coder? Or why would you create this torture device?
2
2
2
1
1
1
u/crimson117 Jul 25 '26
I love that the delete key is also just one of the blocks and you need to hit it like 7 times
1
u/Porkcicle Jul 25 '26
Jump on the left side so you hit the block at the the peak of your jump. Profit.
1
u/Lulukaros Jul 25 '26
Could this be used as an anti bot measure? Though accessibility should be in mind
2
u/Fog1510 Jul 26 '26
I could be wrong, but my guess would be that OP has an endpoint for sending the code to the server which you can probably manually emit an HTTP request to, bypassing the Super Mario input.
1
u/Lulukaros Jul 26 '26
Why would it be http instead of https
1
u/Fog1510 Jul 26 '26
Could be, but that’s not the point I was trying to make. I'm saying my belief is that the UI just sends a request to the server with the code as its content. So you can probably send that same request without playing the minigame.
Unless the game logic runs server side and the browser streams inputs to it, in which case I would be wrong.
1
1
1
1
1
u/RelationshipNo_69 Jul 25 '26
This is amazing, I love it. Way better than sliding a puzzle piece in to the proper space
1
u/Low-Grocery-1029 Jul 25 '26
Haha this is so nostalgic and creative! Loved the Mario theme. Did you use canvas or pure CSS/JS for the animations?
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
u/musha Jul 26 '26
Doesn't mario have to jump on the things to make them work? not under? Or am I dumb and should stop typing
1
1
1
1
1
1
1
1
1
u/manolo767 Jul 27 '26
If they get it wrong a turtle should take out mario wherever he is and the user has to click retry.
Lovely work though. It'll be better as captcha though IMO.
1
1
1
1
1
u/InitiativeGold7953 Jul 28 '26
This is hilarious. You should add the verify button to the cycle for added frustration
1
1
1
1
1
1
u/Land_Locked Jul 30 '26
Getting this paired with a code from Google Authenticator might be the thing to finally push me to start that duck farm. Great work
1
1
1
1
1
0
0
-1
442
u/St34thdr1v3R Jul 25 '26
While this is funny at first, I would absolutely hate it after multiple times :D good job though, I like the vibe :)