Conditional drupal_add_css and _js are adding code to every page

Question

I am trying to add a CSS and JS files when a certain content type is being viewed (Drupal 6). The problem is that the code is being added to every page.

I have tried this first, included in template.php:

function phptemplate_preprocess_node(&$vars, $hook) {
  $node = $vars['node'];
  if ($node->type == 'mytype') {
        drupal_add_css(path_to_theme() . "/css/mytpess.css");

        drupal_add_js(path_to_theme() . "/javascripts/jquery.masonry.min.js");
        drupal_add_js("$(document).ready(function(){
                          $('.node').masonry({
                            itemSelector: '.field-type-flexifield'
                          });
                        });",'inline');
  }
}

Then I moved it out of there and placed it in node-mytype.tpl.php:

drupal_add_css(path_to_theme() . "/css/mytpess.css");

drupal_add_js(path_to_theme() . "/javascripts/jquery.masonry.min.js");
drupal_add_js("$(document).ready(function(){
                  $('.node').masonry({
                    itemSelector: '.field-type-flexifield'
                  });
                });",'inline');

But either way it gets added to every page. How can I resolve this?

Answer 1

If you are adding drupal_add_css or_js in phptemplate_preprocess_node,

1. First fetch all the added css in one variable and assign this for $styles value
2. Same like css you need to do for js also.

Here with see the sample code below

function phptemplate_preprocess_node(&$vars, $hook) { $node = $vars['node']; 
if ($node->type == 'mytype') {
    drupal_add_css(path_to_theme() . "/css/mytpess.css");

    drupal_add_js(path_to_theme() . "/javascripts/jquery.masonry.min.js");
    drupal_add_js("$(document).ready(function(){
                      $('.node').masonry({
                        itemSelector: '.field-type-flexifield'
                      });
                    });",'inline'); 
 }
$css = drupal_add_css();
$scripts = drupal_add_js();
$vars['styles'] = drupal_get_css($css);
$vars['scripts'] = drupal_get_js('header', $scripts);
}

Answer 2

You can use http://api.drupal.org/api/drupal/developer!hooks!node.php/function/hook_view/6 hook_view in custom module to do this.

For example if your module name is "example" then function should be

function example_view($node, FALSE, TRUE) {
  if ($node->type == "mytype") {
    drupal_add_css(path_to_theme() . "/css/mytpess.css");
    drupal_add_js(path_to_theme() . "/javascripts/jquery.masonry.min.js");
  }
}

Answer 3

Isn't template_preprocess_node() too late? Try using template_preprocess_page() instead. $variables['node']->type as usual.

function template_preprocess_page(&$vars) {
  if (isset($vars['node'], $vars['node']->type) && $vars['node']->type === 'mytype') {
    //ADD_JS
    //ADD_CSS
  }
}

Edit: as a sidenote, template_preprocess_page should be renamed to THEME_NAME_preprocess_page or MODULE_NAME_preprocess_page. Depending on where you place that function.