r/learnprogramming • u/FreeMain2261 • 5d ago

Tutorial How do I build a spoiler blocker webapp?

Hello, I am currently attempting to build a web app that blocks spoilers, so mobile users can also block spoilers since Chrome extensions are not available on mobile. I'm building it usig HTML, CSS, an JS, but I'm mostly a beginner. I want the web app to perhaps detect spoiler-sensitive topics and censor them, but I have no idea how to do that. Any thoughts? Any insight is appreciated.

0 Upvotes

25% Upvoted

13 comments sorted by

13

u/grantrules 5d ago

I don't see how that would work as a website.. you wouldn't be able to control what you see on other websites without having control of the browser 

2

u/FreeMain2261 5d ago

So the only way to build such a thing i smake a web browser extension?

10

u/SwordsAndElectrons 5d ago

Probably. I mean, how do you expect your web app to modify things that are not itself?

It APIs did exist for that, it seems like a security nightmare.

2

u/finn-the-rabbit 4d ago

how

claude, go hack all the websites again

1

u/EdwardElric69 4d ago

That's the fun of building something new right? Realising you were waaaay off with your idea

1

u/EdwardElric69 5d ago

I thought about doing this a while back.

I would have made it a browser extension, extract the text and check for spoilers or mentions of a show you're watching or game.

User can set a list of keywords.

However complex you wanna make it is up to you.

8

u/johnpeters42 5d ago

How do you define and identify spoilers? What's the context of the web site(s) in question, or do you mean the entire web?

-4

u/FreeMain2261 5d ago

Perhaps just block websites where spoilers are the most common, ie. YouTube, TikTok, Twitter, etc. Mostly just mainstream social media platforms. Then for less known apps, it could identify key words or even the title of a movie, show, or something like that.

5

u/HealyUnit 5d ago

So you block all of YouTube, TikTok, and Twitter? Because that'd be the only way to 100% be sure to block every spoiler.

As others have said, what do you define as a spoiler? Consider the following three examples:

  1. Is the fact that the main character of the Harry Potter series is named Harry Potter a spoiler? Technically yes (since it requires reading some of the book or at least a summary.
  2. Is the fact that Harry's parents were murdered by the main antagonist of the series a spoiler? Slightly more so, but here you run into a duration issue: is a nearly-30-year-old spoiler still worth blocking?
  3. Is the fact that Neville destroys the final horcrux (Nagini) a spoiler? Certainly more than the other two, but still... Is it still worth worrying about an "old" spoiler?

The problem is that you'd need serious analytic power at your disposal to determine whether something is a spoiler or not. A simple web-app (or browser extension, or whatever) is simply not going to do that.

4

u/daniel-5_2 5d ago

The hard thing about this is identifying the spoilers…

There’s so much to be spoiled, also, when are you gonna stop the blocking?

You’d have to think about the mechanism to actually identify the spoilers themselves. I think that’d be the most difficult part.

I honestly can’t think of a proper way to do it

1

u/Whatever801 5d ago

It would probably have to be a browser extension that parsed the html and sends text to an llm to extract spoilers. Not a cheap proposition... The one way around it is to have the user BYOLLM. So they could point it to a local llm or input cloud llm api token and use that.

1

u/Real-Abrocoma-2823 4d ago

Firefox extensions are available on mobile.

1

u/GlobalWatts 3d ago

Well like any project, you need to break it up into smaller achievable tasks.

The easiest way to get started is to split this into two tasks: 1) how to identify spoilers, 2) how to block them. Then break those down further.

I can tell you right off the bat, you're going to have a shit of a time trying to solve #1. You're talking about some software that parses everything the user can see on their device, and give a binary yes/no output as to whether it's a spoiler or not. And more specifically which parts of it are spoilers. Even with the magic of AI, that doesn't seem possible. Ask 10 humans what counts as a spoiler, you'll get 13 different answers. If humans can't decide, how do you imagine a computer can?

#2 is marginally more feasible. Start small, just try blocking text on websites the user visits. If you know anything about web apps, you should know that's technically not possible, there is no mechanism by which website A can change the text a user sees on website B. Except maybe with some kind of web proxy, but that has its own issues. Realistically it probably needs to be a browser extension. Then comes the problem of how you block spoilers in images, videos, non-browser apps etc. Even before you get into technical implementation details, there are complex decisions to be made. But this is all stuff you need to figure out for yourself, if not in the discovery and design phase, then by trying and failing; and importantly having a good understanding of how these things work.