A bookmarklet is defined by Wictionary as "A small piece of JavaScript code stored as a URL within a bookmark". I have been using bookmarklets to make my life easier from a long time.
Some that I use regularly are
- [Read Now] : This makes it really easy for me to read pages which are unreadable.
- [Google Translate] : Translates pages
- [Mobilise This] : Formats the page for mobile viewing by Google.
- [Acronym lookup] : This helps me find the meanings for abbreviations.
I picked these up from these two pages. There is also a whole website dedicated to them bookmarklets.
As a developer, what i like about bookmarklets is that they are coded in JavaScript and i can meddle with them till my heart's content, without worrying about breaking anything.
However, i wanted a bookmarklet that would allow me to look up meaning of words. Wiktionary was my open dictionary of choice. They did have bookmarklets, but I didn't like the way the current page was replaced by the relevant wiktionary entry. Also i didn't know what was going on inside the bookmarklet. So i wanted to (a). know what was going on? ,and (b). open the wiktionary entry in a new page.
The code of the official wiktionary bookmarklet was taken and then made into a human readable form.
javascript:(function(){ q=window.getSelection().toString(); if(!q)q=prompt('Wiktionary:'); if(q)location.href='http://en.wiktionary.org/w/wiki.phtml?search='+encodeURI(q); })()
The first line defines that the string is a bit of javascript code. The way the function is defined; it is called an anonymous function. This is to ensure that the function does not return an undefined value ( discussed here ).
In the second line, the selected text is added as the value of a variable q after making it into a string (.toString()). The 3rd line asks us which word we want the meaning for (prompt('Wiktionary:')) if no text has been selected (if(!q)).
The 4th line: Since now the text has been selected (or entered). The relevant webpage is opened.
After doing some googling, i came up with this page that explained how the Window.open function worked just the way i wanted it to. So I changed the 4th line and my final code was:
javascript:(function(){ Q=window.getSelection().toString(); if(!Q){Q=prompt('Wiktionary:')} if(Q){window.open('http://en.wiktionary.org/w/wiki.phtml?search='+encodeURI(Q)+'')} })()
The website minifyjavascript.com runs a javascript minifying service. Using this I minified my code and now, proudly present the [Wiktionary] bookmarklet, featuring opening the meaning of the selected (or entered) word using wiktionary in a new browser window. Do drag away to the (bookmark) bar and use for your pleasure.
Hi Trs,
ReplyDeleteWell written article. This was a very interesting concept. Im hoping to modify ur bookmarklet and experiment with it.. definitely made browsing the net easier.. :)
Thanks a lot dude.
DeleteFor starters, Do try looking at coding a bookmarklet for http://www.indiabookstore.net . it compares book prices including flipkart which both junglee and google dont do (a real chore, doing that). That would be really nice.