The jsloaderinit function

The first hook we implemented printed the help text. This second one will do the rest of the work for our module. It will read the module's .info file and load any JavaScript files specified in the scripts[] directive. For example, when we created our file, we added a line to the bottom that looked like this:

Drupal will simply ignore this directive when it parses the .info file. However, we can make use of it.

To do so, we are going to implement another hook: hook_init(). This hook is executed near the beginning of a page request, after Drupal has loaded all of the core libraries, and then loaded the modules. However, it is called before any HTML is sent back to the client.

We want to hook into the Drupal request cycle early. This allows us to add the JavaScript files to the HTML's head section (inside the <head></head> tags).

The hook_init() hook is easy to implement. It takes no arguments and nothing needs to be returned. To implement the hook_init() function, we simply create jsloader_init(), a function that follows the hook naming convention:

function jsloader_init() {

$path = drupal_get_path('module', 'jsloader'); $info = drupal_parse_info_file($path . '/'); foreach ($info['scripts'] as $script) { drupal_add_js($path . '/' . $script);

This function reads the .info file, and then load all of the scripts that the info file points to. Both of these functions will require us to know the path to the module. Fortunately, Drupal can compute this for us.

On the first line, we retrieve the path to our module and then assign this information to the variable $path. The drupal_get_path() function takes two arguments. The first is the type of path we want to get. The string module indicates that we are interested in a module directory. In contrast, to get a theme path, we would use the string theme.

The second parameter is the module whose path we want. We are interested in our own module's path, so we pass jsloader to the function.

Now that we have the base path to our module, we can load the .info file. Again, this is a simple task because Drupal provides a function for reading and parsing this file.

The drupal_parse_info_file() takes the full path to the .info file as its parameter. We build this by concatenating the $path and '/'. Drupal will then read the file, parse it, and return an array.

PHP arrays

In JavaScript, we made frequent use of arrays and object literals. PHP's array-type functions are a combination of these two. That is, it may contain a list of values with numeric indexes or key/value pairs.

The array returned is an associative array that, if done in JavaScript, would look something like this:

'description': 'Load JavaScript files',

Items in the .info file, that have square brackets in the name, are converted to arrays. Thus, scripts[] is transformed into a key, scripts, and it has an array for a value. Each time the scripts[] directive is parsed, its contents are appended to the array. If we had two scripts[] directives, the scripts entry would look like this:

The results of the parsed .info file are stored in the $info variable. We know that the scripts[] entries are now stored in the $info array as the name scripts and an array of script file names. What we want to do next is loop through $info['scripts'] and tell Drupal to add each script to the output.

In PHP, this can be done conveniently with a foreach loop, which will iterate through each item in an array, temporarily assigning each item to a variable.

A foreach loop follows the pattern foreach ($array as $array_item) {}. In each iteration, the $array_item will contain the value of the current item in the array:

foreach ($info['scripts'] as $script) { drupal_add_js($path . '/' . $script);

For each script[] item added in the .info file, this will use the drupal_add_js() function to add that JavaScript file.

The drupal_add_js() function is multifunctional. It can be used three ways:

1. To add a JavaScript file to the head of the generated HTML.

2. To add inline JavaScript to the output, inside of <script></script> tags. This will also go in the HTML head.

3. To add an individual setting to the Drupal.settings array. We have seen the Drupal.settings.basePath variable in previous chapters. This extends that same object.

Unfortunately, the arguments are different in each case and therefore mean different things. Here, we have used the simplest case as we are simply adding a file. The syntax for doing this from within a module is drupal_add_js($filename). As we can see, the drupal_add_js() function needs to know the path to the filename.

In the above code snippet, this loads each script file.

In the next project, we will see how drupal_add_js() can be used to add settings.

[r-^TX The three uses of this function are documented in the Drupal API at I

That is all there is to our loader. Now, every script that we add to the .info file using the scripts[] directive will automatically be loaded on every page request. At the beginning of this project, we created a module that fired an alert() every time a page loaded. Now that our module is complete, we should be able to test the loader by loading a page on our site. Here's a screenshot of what that should look like:

The page at http://localliast:SSS8 says: JS Loader is ready.

If the alert box pops up, we know that our script is being loaded.

The module we just created provides a way for integrating JavaScript files into Drupal, without relying on a theme, and without requiring any additional code. With this single module, we could add all of the scripts created since Chapter 3. The one in Chapter 2 relied a little too heavily on a template file to be used outside of a theme. No additional PHP would be necessary.

On the other hand, this module doesn't exploit the possibility of using PHP code to inform JavaScript. In the next project, we will see how we can use PHP code in modules to pass information on to a JavaScript tool.

Was this article helpful?

0 0

Post a comment