Difference between revisions of "Expandable.php"

From Organic Design wiki
m
m
Line 3: Line 3:
 
$article = preg_replace(
 
$article = preg_replace(
 
'/(<\\/head\\s*>)/',
 
'/(<\\/head\\s*>)/',
'$1<script type="text/javascript">
+
'<script type="text/javascript">
 
function toggleExpandable(id) {
 
function toggleExpandable(id) {
 
var content = document.getElementById("expandable-"+id);
 
var content = document.getElementById("expandable-"+id);
Line 10: Line 10:
 
this.parent.focus();
 
this.parent.focus();
 
}
 
}
</script>',
+
</script>$1',
 
$article
 
$article
 
);
 
);

Revision as of 12:34, 7 March 2007

<?

  1. Insert a JS function into the page to be called when show/hide links are clicked

$article = preg_replace( '/(<\\/head\\s*>)/', '<script type="text/javascript"> function toggleExpandable(id) { var content = document.getElementById("expandable-"+id); if (content.style.display == "none") content.style.display = ""; else content.style.display = "none"; this.parent.focus(); } </script>$1', $article );

  1. Callback function executed for rendering each expandable table

function expandableCallback($matches) { $i = ++$GLOBALS["expandable/tbl-count"]; $open = $matches[2] ?  : ' style="display:none;"'; # default to expanded in id present after title attribute

return '

<a class=expandable-link href="javascript:toggleExpandable('.$i.')">► '.$matches[1].'</a> <a href="'.$GLOBALS['xwScript'].'?title='.$matches[1].'&action=edit"></a>
'.$matches[3].'
';

}

  1. Replace all the expandable tables with html containing CSS classes and the show/hide links

$article = preg_replace_callback(

'/(.+?<\\/table\\s*?>)/s', 'expandableCallback', $article ); ?>