Babylscript to JavaScript Translator

Below is a web-based demo of Babylscript that lets you run Babylscript code in your browser. We also have a web demo applet that shows Babylscript being used to script Java code. Here are the steps needed to use the demo:

1. Write some Babylscript code in the text box on the left.

2. Click on the translate button. Any error messages will be appear in the Messages area at the bottom.

3. Your Babylscript code will then be translated into JavaScript code. This JavaScript code will be shown in the right text box.

4. Click the Run button to run the translated JavaScript code. Any output will appear in the Messages area.

There is some sample code at the bottom of the page that you can try in this demo.

Things to try in the demo

Here are some code samples that you can try out in order to get a feel for how Babylscript works as a language. Just cut & paste the code into the editor. Then you can translate them into JavaScript and run the resulting code.

Simple Computation

In the English mode, Babylscript behaves like normal JavaScript. For example, you can type simple JavaScript expressions and run them.

alert(5+5);

Fully Integrated with JavaScript

Babylscript is currently well-integrated with regular JavaScript. You can call into the DOM and use Babylscript functions as DOM function handlers.

div = document.createElement('div');
document.body.appendChild(div);
button = document.createElement('input');
button.setAttribute('value', 'click me');
button.setAttribute('type', 'button');
button.onclick = function(e) {
  alert('clicked');
};
div.appendChild(button);

Writing Code in Another Language

So far, you have been shown that Babylscript behaves like normal JavaScript when in English mode. You can switch to writing code in another language by typing three hyphens, typing the code of the langauge mode that you want to switch to, and then typing three hyphens again (alternately, you can just go into the File menu and switch to the default language that you want). The languages supported (and their language codes) can be found at the Translations link at the top of this page.

---fr---
alerter(«Salut!»);
alerter(1,5 + 2,0);
si (vrai)
   alerter(«12345».longueur);

In the above code, we switch to the French language mode. In the French language mode, the function "alert" becomes "alerter", the attribute "length" becomes "longueur", and the keywords "if(true)" become "si(vrai)". The symbols used to denote strings are different, and commas are used for decimal points.

DOM in another Language

Unfortunately, the DOM functionality for manipulating html code has not been translated into other languages. But you can still use DOM functionality from non-English code.

---fr---
div = document.createElement(«div»);
document.body.appendChild(div);
bouton = document.createElement(«input»);
bouton.setAttribute(«value», «Appuyez-moi!»);
bouton.setAttribute(«type», «button»);
bouton.onclick = fonction(e) {
  alerter(«Appuyé»);
};
div.appendChild(bouton);

Also, the JavaScript standard library has not been extended to handle non-English dates and numbers.

---hi---
सावधान("Hindi numbers still show up"
   + " using Western digits: " + १.५);

Mix Different Language Modes in One Program

In Babylscript, you can mix code written in different languages in the same program. For example, in the code below, we switch to the Chinese (Simplified) language mode. In this mode, the "alert" function is called "警告". We use this to show a number of the screen, but we switch to the French language mode, so that we can write out the number in a French style.

---中文---
警告(---fr--- 1,5 ---zh---);

In the next example, we define a function called "fn" in the French language mode. This function simply adds two numbers and returns the result. Then we switch into the Spanish language mode. In Spanish, the "alert" command becomes "alertar". We then call the French function "fn" and display the result.

---fr---
fonction fn(a; b) {
   retourner a + b;
}

---es---
alertar(fn(2; 3));

Different APIs in Different Language Modes

As you've seen from the previous examples, functions and objects have different names in different language modes. For example, the "show" function is called "mostrar" in Spanish, "afficher" in French, and "显示" in Chinese. Programmers can write their own functions and objects that have different names for different languages. In the code below, we take the French function "fn" that we defined previously. We then switch to the English mode and specify that in English, "add" should be used to refer to the "fn" function. From then on, when we are in the English mode, we can use "add" to refer to the function or its original name "fn".

---fr---
fonction fn(a; b) {
   retourner a + b;
}

---en---
this['en':'add'] = 'fn';
alert(add(2, 3));
alert(fn(5, 5));