Google Closure’s idiocies: Ajax can’t be synchronous :(

While I love Closure tools and the possibility to write a better organized and OOP based JavaScript, I’m facing some weakness and inexplicable choices in the library. The last discover is that is impossible to make synchronous ajax call using the provided classes, since I didn’t find nothing about synch/asynch options by reading API reference, I took a look to the source (xhrio.js), and I noticed this:, url, true);  // Always async!

that true should be a parametric value which developers can set to true or false. Why forcing it to true???
I’m really disappointed :(

“Not authorized” error due to Safari “private browsing” mode! :P

This is just a quick post to share my misadventure with Safari and the “private
browsing” mode. I’m working on a small JavaScript library which has the goal to abstract SQLite database api and allow users to create table, insert, update and delete
records easily… my code seems to work very well, but this morning during some
tests, I got the “not authorized” exception (error code n°1) on every
transaction. After hours of debugging I realized that my code was ok, but I forgot
to disable the “private browsing” mode in Safari!
So, bear in mind, if you want to play with database api and other client-related store capabilities (such cookies), remember to disable that option in Safari ;)

Extending Eclipse using JavaScript and Monkey Script engine

I was wondering how to wrap a string with quotes in Eclipse by using a shortcut, then I realized that there is not such command, so I started thinking for a solution and initially I created an Aptana’s snippet, but I was not satisfied, because I want to have an handy shortcut to invoke my snippet. By googling, I discovered Eclipse Monkey Script engine, that is an extremely powerful tool for every JavaScript developer who wants to extend Eclipse features by writing few lines of JavaScript code. In order to use the js engine, you must have the package org.eclipse.eclipsemonkey (which is installed by default by Aptana) installed. Unfortunately I can’t find a complete and exhaustive reference for this project, which seems forgotten by authors, so I learnt what I know reading different posts.
Basically, Monkey Script allow developers to access editor’s instance, get selected test, get document content, edit it and update it. Moreover is possible to print text to consol, read and create files on the filesystem… and finally the scripts created will be accessible from Eclipse menu (under “Scripts”) and invokable through user defined shortcut… really nice!
So, backing to my experiment, I created this monkey script:

* Key: M1+M2+C
* Menu: Custom Scripts > Wrap with double quotes
* DOM:
* Kudos: Davide Zanotti
function main() {
	// no editor... exit
	if (typeof editors.activeEditor == 'undefined') {
		return alert('No active editor');
	// get a reference to the editor in use
	var editor = editors.activeEditor;
	// beginning of text selection
	var startOffset = editor.selectionRange.startingOffset;
	// end of text selection
	var endOffset = editor.selectionRange.endingOffset;
	// selected text
    var selection = editor.source.substring(startOffset, endOffset);
	try {
		// surround selection with quotes
	   editor.applyEdit(startOffset, endOffset - startOffset, '"' + selection + '"');
	} catch (e) {
		alert('Error ' + e.code + ': ' + e.message);

It’s important to notice some points, first you MUST write an “header” using the comment syntax “/* */” into which you MUST declare at least 2 parameter: the “Menu” path (you can nest several menu items by writing several “>”) and the “DOM” package (which allows you to access specific objects like “editors“). You can write several js functions, but you must provide a main() function, which is called automatically by Eclipse once you launch your script, otherwise you can call the main function as you like but you must then provide the “OnLoad” param in the header, specifying which function will be called.
To define a shortcut you can use the “Key” parameter and define your own keys combination by choosing among the four modifiers: M1, M2, M3, M4, that are a platform-independent way of representing keys (these stand for ALT, COMMAND, CTRL, and SHIFT). The strange (at least to me) parameter “Kudos” is used to declare the author of the monkey script.
To test my little script or create your own, you have simply to create a new project into Eclipse by calling it as you like (ie: “custom-extensions”), then create a “scripts” folder into which you will save your .js files… that’s all, try yourself and enjoy :)

This is how it looks:

eclipse monkey script menu

eclipse monkey script menu

ps: I’m going to explore the Monkey Script API in order to write more complex and useful extensions :P

Custom JavaScript classes and packages using goog.provide() and goog.require()

I will repeat it until the dead, the real power of Goolge Closure is the mechanism and the tools behind it, not the classes and methods written for you, but the possibility to write your own better JavaScript code! Today I’m gonna show you how to create and use your custom JavaScript classes and to take the benefits of goog.provide() and goog.require() methods.
Ok, let’s suppose we are working on a funny and exciting project, like an online JavaScript game called “Js Monsters Battle” and let’s suppose the domain will be We love OOP, we love write js code, we love to have a well organized and document code, so we will begin by creating our packages, following the standard which establishes that the root of a package must be the reversed domain name, so in our example we will create this folders structure “/com/jsmonstersbattle/” and inside we will put our classes (and subpackages).
Since our game is a game about monsters, we will create the core package “monsters” in that directory and we will write the first base class called Monster. We will got the following: “/com/jsmonstersbattle/monsters/monster.js”, three folders and one js file. Yes, one JavaScript file for class, forget those huge files containing millions of functions, we are going to write better JavaScript code and thinking more like a Java developer. If you are concerning about file size and performances, don’t worry about it, the compiler will reduce and optimize the code for you (just before release the project). Ok, let’s take a look inside the Monster class (monster.js):


 * A common Monster
 * @constructor
 * @param {String} name
 * @param {String} age
 * @param {Number} level
com.jsmonstersbattle.monsters.Monster = function(name, age, level) {

    /** @private */ this._name = name;
    /** @private */ this._age = age;
    /** @private */ this._level = level;


* Returns an amount of damage points
* @return {Number}
com.jsmonstersbattle.monsters.Monster.prototype.attack = function() {

    return Math.round(this._level + this._age / 100) * 2000;


In the code above I defined a basic class called Monster, which is available under the package (namespace) com.jsmonstersbattle.monsters, declared using goog.provide(), then I created a constructor (by using the special jsDoc notation /** @constructor */) which receives three arguments and sets three private Monster’s variable (/** @private */), finally I defined a method attack which returns a number of damage points. Ok, by following the Monster’s example, we can now create as many classes and packages as we like, interfaces (using /** @interface */ and /** @impements */) and subcalsses (using the method goog.inherits()), let’s see briefly these implementation:

Extending a class:

* @constructor
* @extends com.jsmonstersbattle.monsters.Monster
com.jsmonstersbattle.monsters.UglyMonster = function(name, age, level, uglyness) {

    // call to Super, name, age, level);

    /** @private */ this._uglyness = uglyness;


// you can read the following as: "UglyMonster extends Monster"
goog.inherits(com.jsmonstersbattle.monsters.UglyMonster, com.jsmonstersbattle.monsters.Monster);

Creating and implementing an interface:

 * Evil interface.
 * @interface
function IEvil() {};
IEvil.prototype.doEvil = function() {};

* @constructor
* @implements {IEvil}
com.jsmonstersbattle.monsters.EvilMonster = function(name, age, level) {
    // some code here

com.jsmonstersbattle.monsters.EvilMonster.prototype.doEvil = function() {
    // IEvil implementation

Once we created all the necessary classes, we will put our “com” folder under “closure” folder. Then we will create a main js file which will includes all the code required to initialize and run the application, I called it “application.js” for convenience. This file will requires all the classes it needs by using goog.require():

// ...and so on!

After the import we will be able to use the classes, by referring them with the full qualified class name (“com.jsmonstersbattle.monsters.EvilMonster”), however since this means to write long strings, we can create references as the following:


var EvilMonster = com.jsmonstersbattle.monsters.EvilMonster;

// then...

var monster = new EvilMonster();

or use the JavaScript with operator:


with (com.jsmonstersbattle.monsters) {

    var monster = new EvilMonster();


…and this is all today, I hope you enjoyed my post ;^)

Don’t use the with operator nor take reference to fully qualified class name, otherwise you will get several errors if you use advanced compilation!