My first Google Chrome Extension

I’ve been looking for a reason to create a Google Chrome Web Browser extension for a long time now, and today I finally decided to do it.

I wrote a PHP script a while ago to help grab videos link off various websites. Particularly FLV files. I wrote the PHP script because I got tired of getting the FLV in the page source code every time. It was however a schlep to copy & paste the URL every time and then get the links. So it was time to make it more efficient.

I decided to make it a Chrome browser extension.

My first stop was http://code.google.com/chrome/extensions/index.html and from the beginning it was evident it was going to be quite a learning curve.

I checked through the examples, made offline copies and started playing around with the code. It primarily makes use of Javascript and HTML to accomplish what you need done. I normally try and stay away from Javascript, but this forced me to go against it and play around with client side coding.

There were a few snags along the line, but let’s first look at what the extension does.

How this script works:
1. Once installed, you will have an icon on your toolbar
2. When you click on it, it reads the current page’s HTML into memory
3. By making use of regular expressions it gets all the mentions of FLV files
4. It places them nicely one link per line in a popup window
5. You simply click on the link and it opens a new tab with your video there

I had a look at a number of extensions, and it seems everyone does things differently. The part that I struggled with most was getting the content of the current HTML page into memory so that the popup script could use it. I thought it would’ve been easier to figure it out, but nothing worth anything in life comes easy. Once I figured that out it was simply a matter of putting a few finishing touches on there.

I’ve uploaded it onto Google Chrome Extension Directory to get other people to test it as well and give feedback. If you happen to test it and you find a bug, please let me know.

Bookmark and Share
Leave a comment

0 Comments.

Leave a Reply


[ Ctrl + Enter ]