expand = function(id){
  var content = $$('#' + id + ' div.content')[0];
  var twisty = $$('#' + id + ' div.header span.twisty')[0];
  if (content.style.display == 'none') {
    twisty.addClassName('minus');
    content.blindDown();
  } else {
    content.blindUp({
      afterFinish:function(){
        twisty.removeClassName('minus');
      }
    });
  }
}
transform = function(){
  var elements = $$('.hideable');
  for (var i = 0; i < elements.length; i++) {
    var e = elements[i];
    var h = e.getElementsByClassName('header');
    var c = e.getElementsByClassName('content');
    if (h[0] && c[0]) {
      h = h[0]; c = c[0];
      h.innerHTML = h.innerHTML.replace(/^\s+/, '');
      h.insert({top : '<span class="twisty"></span>' });
      c.style.display='none';
      h.observe('click', function(){
        var id = e.id;
        return function(){
          expand(id);
        }
      }());
      h.style.cursor = 'default';
    }
  }
}
document.observe('dom:loaded', transform);
