Difference between revisions of "Expandable.php"

From Organic Design wiki
m
(trees need to be in data not view)
Line 1: Line 1:
 
<?
 
<?
# Converts expandable tables and trees
 
 
 
# Insert a JS function into the page to be called when show/hide links are clicked
 
# Insert a JS function into the page to be called when show/hide links are clicked
 
$article = preg_replace(
 
$article = preg_replace(
Line 32: Line 30:
 
<table class=expandable-content>'.$matches[3].'
 
<table class=expandable-content>'.$matches[3].'
 
</td></tr></table>';
 
</td></tr></table>';
}
 
 
# Callback function executed for rendering each expandable table
 
function expandableTreeCallback($matches) {
 
$id = ++$GLOBALS["expandable/tbl-count"];
 
$tree = '';
 
if (preg_match_all('/^(\\*+)\\s*(.+)\\s*$/m',$matches[3],$items)) {
 
foreach ($items[1] as $row => $indent) {
 
$depth = strlen($indent);
 
$cs1 = $depth > 1 ? ' colspan="'.($depth-1).'"' : '';
 
$cs2 = ' colspan='.(20-$depth);
 
$open = strlen($items[1][$row+1]) > $depth ? '+' : '';
 
$tree .= "<tr id=$row><td$cs1 align=\"right\">$open</td><td>F</td><td$cs2>".$items[2][$row];
 
}
 
return '<table '.$matches[2].$tree.'</table>';
 
}
 
return $matches[0];
 
 
}
 
}
  
Line 58: Line 39:
 
);
 
);
  
# Replace all the expandable tree-views
 
$article = preg_replace_callback(
 
'/(<div)\\s+(class=["\']?expandable-tree["\']?.+?\\s*>)(.+?)(<\\/div\\s*?>)/s',
 
'expandableTreeCallback',
 
$article
 
);
 
 
 
?>
 
?>

Revision as of 09:14, 23 January 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(); } function toggleExpandableTreeItem(id) { var item = document.getElementById("expandable-"+id); if (item.style.display == "none") item.style.display = ""; else item.style.display = "none"; this.parent.focus(); } </script>', $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 ); ?>