Chrome Destroyer

Youtube with the extension applied.
Bing page with changed font, images, and links

Inspiration

Oftentimes at Hackathons, too many people try to complete really ambitious and lofty projects in a very short period of time. Often, there is simply not enough time to complete such projects and they end being failures. Hence, since this was our first Hackathon, we decided to do something fun and low-stakes that would be doable within 24 hours. Hence, we conceived the idea behind Chrome Destroyer, which we believed would be a fun and silly project we could do to also learn how Chrome extensions are created. If you have ever wished your friends, loved ones, children etc would just use Firefox or Microsoft Edge over the monstrosity that is Google Chrome, this is the perfect extension for you!

What it does

It redirects all google, yahoo, baidu and duckduckgo search requests to Bing.
It changes all images in all web pages to an image of John Cena.
It changes all links in all web pages to one of 3 links:
It changes the font of all text in all webpages to a very unreadable font.
It plays an explosion noise every time a new tab is opened, closed, moved, updated, replaced, switched etc.

How we built it

We built mostly using plain JavaScript and a little of CSS for the font changes. We also made use of the Chrome WebRequests API to capture Google search requests and redirect them to Bing. We used JavaScript to get all image and links in a web page and alter their attributes to change all images and links.

Challenges we ran into

The main challenge we ran into was figuring out how to change images in a persistent manner because what would happen is that on some webpages, the altered images would randomly go back to their original images. We fixed that issue by creating another img tag into the DOM with the image of John Cena as the src and injecting it into the DOM of the webpage.

Accomplishments that we're proud of

The fact that we were able to change all images in all webpages to images of John Cena.
The fact that we changed the fonts to a hilariously hideous font on all webpages.
That we managed to rickroll a few people by changing links to a rickroll videos.
And the proudest accomplishment is that we managed to make some people laugh.

What we learned

We learned the basics of how Chrome extensions are created in the real world, which was one of our goals coming into this Hackathon. We also learned how to capture and redirect/block HTTP requests in Chrome, which could be an inspiration for a future project idea that could actually be used for social good.