Render Array Javascript with Variables

Question

I'm creating a custom block and I'd like to add some Javascript to it. I'm using a Render Array to add the Javascript to the page, which works fine, I'm then trying to add some variables to the Render Array for the Javascript to use.

This is what my Render Array looks like

$content = array(
  '#slides' => $slides,
  '#theme' => 'slider_block',
  '#attached' => array(
    'js' =>
      array(
        drupal_get_path('module', 'single_slider') . '/js/test.js' => array(
          'type' => 'file',
        ),
      )
  )
);

$content['#attached']['js'][] = array(
  'data' => array('word' => 'world'),
  'type' => 'setting'
);

return $content;

I'm then trying to access the variable in the Javascript (test.js) file using the following.

console.log(Drupal.settings);

At the moment this just returns with an empty object. If someone could point me in the right direction I'd appreciate it very much.

Thanks in advanced.

Answer 1

Ok I've managed to solve it myself.

For anyone that is interested my Render Array now looks like this.

    return array(
        '#slides' => $slides,
        '#theme' => 'slider_block',
        '#attached' => array(
            'js' => array(
                array('data' => array('word' => 'world'), 'type' => 'setting'),
                drupal_get_path('module', 'single_slider') . '/js/tes.js'
            ),
        )
    );

And my Javascript file (test.js) now looks like this.

(function($)
{
    //console.log(Drupal.settings.word) //This won't work and will return with undefined.
    $(function()
    {
        alert('Hello ' + Drupal.settings.word);
    });
}(jQuery));