Apr 25

Translate: Select any text in the browser and have it convert to English (or your language)

Ajax, Google, JavaScript, Tech with tags: , , 7 Comments »

Translate Bookmarklet

I really liked getting the Ajax Language API out into developers hands as god knows we shouldn’t have to worry about translations. Now we can use the API and have the Google back-end do all of the work.

I have recently had a couple of scenarios where I really wanted a quick translation. I had a few twitter messages pass through my stream in French and Spanish. I had the answer to some technical issues show up on foreign forums.

So, I decided to create a Translate bookmarklet that allows me to select any foreign text, click on the bookmark, and a little window pops up with the English translation if it can work it out. Automatic translation is far from perfect yet, but for many scenarios you can easily get the gist (e.g. you wouldn’t want to automatically convert a book).

This is how I created the bookmarklet:

The source

First, I have the raw JavaScript source that will become the bookmarklet. There are a few sections of the code. First, we setup a method that will go off and call the Ajax Language API, passing in the translation and language that we want. This is where you would change the language code for non-English.

if (!window['apiLoaded']) {
  window.apiLoaded = function() {
    var language = "en";
    var text = window.getSelection().toString();
    if (text) {
      google.load("language", "1", { "callback" : function() {
        google.language.detect(text, function(dresult) {
          if (!dresult.error && dresult.language) {
            google.language.translate(text, dresult.language, language, function(tresult) {
              if (tresult.translation) {
                translationWindow(tresult, dresult);
              } else {
                alert('No translation found for "' + text + '" guessing the language: ' + dresult.language);

Then we setup a method that is able to display a window showing the result. I used the Prototype UI Window object if available, and good old alert() if not:

if (!window['translationWindow']) {
  window.translationWindow = function(tresult, dresult) {
    if (window['UI']) {
      new UI.Window({theme:  "black_hud",
                   shadow: true, 
                   width:  350,
                   height: 100}).setContent("<div style='padding:6px'>" + tresult.translation + "</div>")
                   .setHeader("English Translation")
                   .setFooter("Language detected: " + dresult.language)
                   .center({top: 20}).show();
    } else {
      alert(tresult.translation + " [lang = " + dresult.language + "]");

Next, we load the Prototype UI window code, and accompanying CSS resources by dynamically adding the resources to the DOM:

if (!window['UI']) {
  var pw = document.createElement('script');
  pw.src = 'http://almaer.com/downloads/protowindow/protowin.js';
  pw.type = "text/javascript";
  var pwdefault = document.createElement('link');
  pwdefault.setAttribute('rel', 'stylesheet');
  pwdefault.setAttribute('type', 'text/css');
  pwdefault.setAttribute('href', 'http://almaer.com/downloads/protowindow/themes/window.css');
  var pwblack = document.createElement('link');
  pwblack.setAttribute('rel', 'stylesheet');
  pwblack.setAttribute('type', 'text/css');
  pwblack.setAttribute('href', 'http://almaer.com/downloads/protowindow/themes/black_hud.css');

Finally, we load the Google API loader, and use the dynamic loading option with the ?callback=apiLoaded. This kicks off the main driver that we saw first, and if it is already loaded we call it directly (for multiple translations on the same page).

if (!window['google']) {
  var s = document.createElement('script');
  s.src = 'http://www.google.com/jsapi?callback=apiLoaded';
  s.type = "text/javascript";
} else {


This is the raw form, and we need to get the bookmarklet form, which you can just use right away if you are wanting English. For this, I use John Grubber’s makebookmarklet Perl script to do the conversion.

The Server

The Prototype UI code lives on the server, so I put a striped down version over there which just contains a combined Prototype + Window JavaScript file, and just the one theme CSS set.

In Action

Unsure what I am talking about? Just watch it in action:

UPDATE: I also implemented Twitter Translate to automatically convert tweets to your language.

Mar 01

Lisa Awards: Community Waiting for an Update

Comic, Tech with tags: , , , 2 Comments »

Lisa Awards: Community Waiting for an Update

Man, what a wait. 10 years and counting? The community has started to take hold and have updated Perl 5 a lot recently, which most people outside of the core community never see as they wait for the Big One. When Perl 6 and Parrot really hit primetime, I wonder what will happen?

What about the other awards?

Got some ideas for awards you would give?

Feb 29

Lisa Awards: Biggest Hack for a Language Runtime

Comic, Ruby, Tech with tags: , , No Comments »

Lisa Awards: Biggest Hack for a Language Runtime

People make fun of the Ruby MRI runtime. The Java and Pythonistas giggle. What is interesting though is how it has been good enough for a lot of people. However, there is no reason for a Ruby runtime to be that slow, so it is great to see the competition across YARV, Rubinious, and of course JRuby.

The beauty of being slow, is that you have a lot of room to get faster :)

Want to learn about Ruby 1.9? Matz came to Google the other day to talk about it:

What about the other awards?

Got some ideas for awards you would give?

Feb 28

Lisa Awards: Most Original Name for a New Language

Comic, Tech with tags: , , , 3 Comments »

Lisa Awards: Most Original Name for a New Language

You have the originally named languages of A, B, and the popular C. Then Bjarne Stroustrup gets clever and goes for C++. Anders comes along with C# and adds the musical touch.

Walter Bright creates a language that “originates as a re-engineering of C++, but even though it is predominantly influenced by that language, it is not a variant of C++. D has redesigned some C++ features and has been influenced by concepts used in other programming languages, such as Java, C# and Eiffel.”

Walter then named the language …. D.

Other entrants are of course E, and the very new Arc.

What about the other awards?

Got some ideas for awards you would give?

Feb 27

Lisa Awards: Most Format Restrictive Language

Comic, Tech with tags: , , , 1 Comment »

Lisa Awards: Most Format Restrictive Language

Fortran pre-90 was very restrictive. There is the magic of column one, the line numbers, etc.

The original Fortran was written for the IBM 704 and you programmed it on punch cards which is why the restrictions were in place. Before Fortran, most of the community were coding using assembler, and Fortran was a factor of 20 more concise. Take that modern Ruby!

There were some close runners up. Fortran 90 fixed a bunch of these issues, however it was a touch too late.
Some forms of Basic has some of the issues too, namely with the explicit line numbers.

Python should maybe win the award since it is a very modern language, and the restrictiveness that people love or hate are not due to computer needs, but rather a benevolent dictator and his opinions :)

Fortran has also won the award for “programming language name that sounds like a robot from the future”.

What about the other awards?

Got some ideas for awards you would give?

Feb 26

Lisa Awards: Best Comeback for a Programming Language

Comic, Tech with tags: , , 2 Comments »

Lisa Awards: Best Comeback for a Programming Language

If you had mentioned Erlang a few years ago people would have scoffed unless you were programming a telco switch. Now you have Ruby developers spending time checking it out, and dealing with some of the ugliness of the methodname/1 language itself.

You could argue that JavaScript is making a comeback with the Ajax universe expanding all over, but it isn’t like JavaScript has ever disappeared.

The Academy of Computing and Machinery also looked at Lisp, but that hasn’t come back yet… although maybe it will be the language for 2009? Or Smalltalk?

Erlang has previously won awards for “Best Movie for a Programming Language”:

What about the other awards?

Got some ideas for awards you would give?

Feb 14

Microsoft Declares

Comic, Microsoft, Tech with tags: , 2 Comments »

Microsoft Declares

Paul Krill asked Bill Gates about declarative languages and how they are the future (and ironically the past!). Bill talked about some of the work happening at Microsoft:

“Most code that’s written today is procedural code. And there’s been this holy grail of development forever, which is that you shouldn’t have to write so much [procedural] code,” Gates said. “We’re investing very heavily to say that customization of applications, the dream, the quest, we call it, should take a tenth as much code as it takes today.”

“You should be able to do things on a declarative basis,” Gates continued. But this has not caught on partially because of weak data models — first Codasyl and then relational. Stronger data models since have emerged, such as rich schemas around XML as well as modeling work being done by Microsoft and others, Gates said. “We’re bringing the data models up to be much, much richer, and we think in that environment, a lot of business logic can be done in a declarative form. Now, we haven’t totally proven this yet. We’re doing a lot of internal developments ourselves that way,” including some Microsoft business applications, he said.

“We’re not here yet saying that [a declarative language has] happened and you should write a ton less procedural code, but that’s the direction the industry is going,” Gates said. “And, despite the fact that it’s taken longer than people expected, we really believe in it. It’s something that will change software development but more like in a five- to eight-year timeframe than overnight,” he said.

I am guessing that the work of Doug Purdy, ChrisAn, and Don Box is fitting into this world, as well the mentioned work of Brad Lovering.

But…. maybe the future is a port of Jelly ;)