Add a class to a field based on the page regions

Question

I have my field tpl file which sets in a div classes 'field-item', 'odd/even' etc. I need to dynamically assign a class to it based on the regions that exist on the page. I am using bootstrap theme and the class I need to add reflects the column span count, so f I have a sidebar on the left I will have less space for that field and need a narrower column class.

Bootstrap already comes with a function doing it for page preprocess:

function mytheme_preprocess_page(&$variables) {
  // Add information about the number of sidebars.
  if (!empty($variables['page']['sidebar_first']) && !empty($variables['page']['sidebar_second'])) {
    $variables['columns'] = 3;
  }
  elseif (!empty($variables['page']['sidebar_first'])) {
    $variables['columns'] = 2;
  }
  elseif (!empty($variables['page']['sidebar_second'])) {
    $variables['columns'] = 2;
  }
  else {
    $variables['columns'] = 1;
  }

So basically what I need is to make my field aware of that page variable. How can I use this variable on my field tpl file?

Answer 1

A quick look shows that the content region is wrapped in a class derived from that $columns variable, getting it from this function...

/**
 * Returns the correct span class for a region
 */
function _bootstrap_content_span($columns = 1) {
  $class = FALSE;

  switch($columns) {
    case 1:
      $class = 'span12';
      break;
    case 2:
      $class = 'span9';
      break;
    case 3:
      $class = 'span6';
      break;
  }

  return $class;
}

...so you should be able to use the cascading features of CSS to theme your field, eg...

.span12 .your-field-stuff {
  /* widescreen */
}

.span9 .your-field-stuff {
  /* one sidebar */
}

.span6 .your-field-stuff {
  /* two sidebars */
}