font-weight:bold;
}
-div.table_size_dialog {
- align:left;
+td.table_flushleft {
+ text-align:left;
}
-div.table_pattern_dialog {
- align:right;
+td.table_flushright {
+ text-align:right;
+}
+table.table_dialogs {
+ width:100%;
+ border:1px;
+}
+.table_size_label{
+ font-weight:bold;
+}
+.table_search_label{
+ font-weight:bold;
+}
+.table_reset {
+ border:1px;
}
row.className=cn;
}
+/* maintain the number of matching entries in the <tbody> element's classname */
+function plc_table_tbody_matching (tbody, matching) {
+ var new_cn="matching-" + matching;
+ var cn=tbody.className;
+ if (cn.match("matching-")) {
+ cn=cn.replace(/matching-\d+/,new_cn);
+ } else {
+ cn=cn + " " + new_cn;
+ }
+ cn=cn.replace(/^ +/,"");
+ tbody.className=cn;
+}
+
// /* scan the table, and mark as visible the rows that have at least one cell that contains the pattern */
function plc_table_filter (table_id,pattern_id) {
- var rows = document.getElementById(table_id).getElementsByTagName("tbody")[0].rows;
+ var tbody = document.getElementById(table_id).getElementsByTagName("tbody")[0];
+ var rows=tbody.rows;
var pattern_text = document.getElementById(pattern_id).value;
var row_index, row, cells, cell_index, cell, visible;
var pattern,i;
+ var matching_entries=0;
// remove whitespaces at the beginning and end
pattern_text = pattern_text.replace(/[ \t]+$/,"");
}
}
plc_table_row_visible(row,visible);
+ if (visible) matching_entries +=1;
}
+ plc_table_tbody_matching(tbody,matching_entries);
tablePaginater.init(table_id);
}
var t = document.getElementById(tablename+'-fdtablePaginaterWrapTop');
var b = document.getElementById(tablename+'-fdtablePaginaterWrapBottom');
+ /* get how many entries are matching:
+ opts.visibleRows only holds the contents of the current page
+ so we store the number of matching entries in the tbody's classname
+ see plc_table_tbody_matching
+ */
+ var totalMatches = opts.totalRows;
+ var tbody=document.getElementById(tablename).getElementsByTagName("tbody")[0];
+ var cn=tbody.className;
+ if (cn.match (/matching-\d+/)) {
+ totalMatches=cn.match(/matching-\d+/)[0].replace("matching-","");
+ }
+
+ var label;
+
+ /* when there's no visible entry, the pagination code removes the wrappers */
+ if (totalMatches == 0) return;
+
+ var matches_text;
+ if (totalMatches != opts.totalRows) {
+ matches_text = totalMatches + "/" + opts.totalRows;
+ } else {
+ matches_text = opts.totalRows;
+ }
var first = ((opts.currentPage-1) * opts.rowsPerPage) +1;
- var last = Math.min((opts.currentPage * opts.rowsPerPage),opts.totalRows);
- var items_text = "Items [" + first + " - " + last + "] of " + opts.totalRows;
- var page_text = "Page " + opts.currentPage + " of " + Math.ceil(opts.totalRows / opts.rowsPerPage);
- var label = items_text + " --- " + page_text;
+ var last = Math.min((opts.currentPage * opts.rowsPerPage),totalMatches);
+ var items_text = "Items [" + first + " - " + last + "] of " + matches_text;
+ var page_text = "Page " + opts.currentPage + " of " + Math.ceil(totalMatches / opts.rowsPerPage);
+ label = items_text + " -- " + page_text;
p.className = "paginationText";
p.appendChild(document.createTextNode(label));
-
- /* t.insertBefore(p.cloneNode(true), t.firstChild); */
+
+ t.insertBefore(p.cloneNode(true), t.firstChild);
b.appendChild(p);
}
function plc_table_setsize (table_id,size_id,def_size) {
var table=document.getElementById(table_id);
var size_area=document.getElementById(size_id);
- var paginate=/paginate-\d+/;
if ( ! size_area.value ) {
size_area.value=def_size;
}
var size=size_area.value;
- table.className=table.className.replace(paginate,"paginate-"+size);
+ table.className=table.className.replace(/paginate-\d+/,"paginate-"+size);
tablePaginater.init(table_id);
}
-function plc_table_filter_resetsize(table_id, size_id, size) {
+function plc_table_size_reset(table_id, size_id, size) {
var table=document.getElementById(table_id);
var size_area=document.getElementById(size_id);
- var paginate=/paginate-\d+/;
size_area.value=size;
- table.className=table.className.replace(paginate,"paginate-"+size);
+ table.className=table.className.replace(/paginate-\d+/,"paginate-"+size);
tablePaginater.init(table_id);
}
<link href="/planetlab/css/plc_paginate.css" rel="stylesheet" type="text/css" />
';
-$unused='
-<script type="text/javascript" src="/planetlab/tablesort/more.js"></script>
-<link href="/planetlab/css/more.css" rel="stylesheet" type="text/css" />
-<body OnLoad="init();">
-';
-
drupal_set_html_head($header_autocomplete_js);
drupal_set_html_head($header_tablesort_js);
drupal_set_html_head($header_tablesort_css);
// --------------------
$nodepattern=$_GET['nodepattern'];
$peerscope=$_GET['peerscope'];
-$tablesize=$_GET['tablesize'];
-if (empty($tablesize)) $tablesize=25;
+$tablesize=25;
?>
$peer_filter=array();
-// fetch nodes
+// fetch nodes - use nodepattern for server-side filtering
$node_columns=array('hostname','site_id','node_id','boot_state','interface_ids','peer_id');
if ($nodepattern) {
$node_filter['hostname']=$nodepattern;
$node_filter=array('hostname'=>"*");
}
-// peerscope
+// server-side selection on peerscope
list ( $peer_filter, $peer_label) = plc_peer_info($api,$_GET['peerscope']);
$node_filter=array_merge($node_filter,$peer_filter);
?>
<!------------------------------------------------------------>
-<div class='table_size_dialog'>
-<form>
- <label> table size </label>
- <input type='text' id='tablesize_text' value="<?php echo $tablesize; ?>" size=3 maxlength=3
+<table class='table_dialogs'> <tr>
+<td class='table_flushleft'>
+<form class='table_size'>
+ <input class='table_size_input' type='text' id='tablesize_text' value="<?php echo $tablesize; ?>"
onkeyup='plc_table_setsize("nodes","tablesize_text", "<?php echo $tablesize; ?>" );'
- />
- <input type='button' value='reset' src="/planetlab/icons/clear.png"
- onclick='plc_table_filter_resetsize("nodes","tablesize_text","999");'>
+ size=3 maxlength=3 />
+ <label class='table_size_label'> items per page </label>
+ <img class='table_reset' src="/planetlab/icons/clear.png"
+ onmousedown='plc_table_size_reset("nodes","tablesize_text","999");'>
</form>
-</div>
-
-<div class='table_pattern_dialog'>
-<form>
- <label> pattern </label>
- <input type='text' id='filter_text' size=40 maxlength=256
- onkeyup='plc_table_filter("nodes","filter_text");'
- />
- <input type='button' value='reset' src="/planetlab/icons/clear.png"
- onclick='plc_table_filter_reset("nodes","filter_text");'>
+</td>
+
+<td class='table_flushright'>
+<form class='table_search'>
+ <label class='table_search_label'> search </label>
+ <input class='table_search_input' type='text' id='search_text'
+ onkeyup='plc_table_filter("nodes","search_text");'
+ size=40 maxlength=256 />
+ <img class='table_reset' src="/planetlab/icons/clear.png"
+ onmousedown='plc_table_filter_reset("nodes","search_text");'>
</form>
-</div>
+</td>
+</tr></table>
<!------------------------------------------------------------>
<div class="fdtablePaginaterWrap" id="nodes-fdtablePaginaterWrapTop"><p></p></div>
<!------------------------------------------------------------>
<table id="nodes" cellpadding="0" cellspacing="0" border="0"
-class="plc_table sortable-onload-1 rowstyle-alt colstyle-alt no-arrow paginationcallback-nodesTextInfo max-pages-15 paginate-<?php print $tablesize; ?>">
+class="plc_table sortable-onload-4 rowstyle-alt colstyle-alt no-arrow paginationcallback-nodesTextInfo max-pages-15 paginate-<?php print $tablesize; ?>">
<thead>
<tr>
<th class="sortable plc_table">Peer</th>
</table>
<div class="fdtablePaginaterWrap" id="nodes-fdtablePaginaterWrapBottom"><p></p></div>
-<p class='plc_filter_note'> Notes: Several words in pattern are combined with <em> OR </em>
-<br/> Hold down the shift key to select multiple columns to sort
+<p class='plc_filter_note'>
+Notes: Several words in pattern are combined with <em> OR </em>
+<br/>
+Hold down the shift key to select multiple columns to sort
</p>
<!------------------------------------------------------------>
</form>
</div>
+<!-- trash -->
+<script type="text/javascript">
+ function foo () {
+ var tbody=document.getElementById("nodes").getElementsByTagName("tbody")[0];
+ alert ('current classname = [' + tbody.className + "]");
+ }
+</script>
+
+<hr>
+<form> <input type='button' onclick="foo()" value='debug classname'> </form>
+