Drupal 7 Module Development

JavaScript in Drupal
Drupal.theme() will call the Drupal.theme.prototype.hello() function and pass
in all the arguments, but the first one. This is useful because the theme can provide
an override function. If a module provides a hello_world.js file as the one above,
and a theme provides a JavaScript file with the following function, the output will
be changed.
(function($) {
Drupal.theme.hello = function(text) {
return '' + text + '';
}
})(jQuery);
Drupal.theme() will call Drupal.theme.hello() instead of Drupal.theme.
prototype.hello(). The theme can override the presentation in JavaScript this way.
Translatable strings
All the text inside the Drupal interface is translatable. The text within JavaScript
can be translated as well. Inside the PHP code for Drupal the t() function is used
for translations. Inside JavaScript the Drupal.t() function is used to handle
translations.
Continuing the Hello World module we can extend it to handle, say "hello" to
different cities, where the "hello" part is translatable.
(function($) {
Drupal.theme.prototype.hello = function(text) {
return '' + Drupal.t('Hello @city', {'@city': text}) + '';
}
$().ready(function() {
$('#hello-world').html(Drupal.theme('hello', 'Chicago'));
});
})(jQuery);
The part we are interested in is where it says:
Drupal.t('Hello @city', {'@city': text})
Here the string 'Hello @city' is a translatable string. The @city part is dynamic
and will be filled in by the value of text. This setup enables translations
to modify the string and still pass the dynamic portions through.
[ 302 ]