Merge branch 'bootstrap' of https://github.com/itshari/pfsense into itshari-bootstrap

author: Renato Botelho <renato@netgate.com> 2015-09-16 16:15:30 -0300
committer: Renato Botelho <renato@netgate.com> 2015-09-16 16:15:30 -0300
commit: b44845f8735e78235b912828f95b6729ecaba6c2 (patch)
tree: 8ea091fc9fd5bdc51284c93256359b8f9c4e260e /src
parent: 910b77ad1682740e481df29fc2d9c528a13c2da4 (diff)
parent: b40061093c81866bf19c0a175165c1985b34dfc4 (diff)
download: pfsense-b44845f8735e78235b912828f95b6729ecaba6c2.zip
pfsense-b44845f8735e78235b912828f95b6729ecaba6c2.tar.gz
4 files changed, 278 insertions, 343 deletions
diff --git a/src/etc/inc/service-utils.inc b/src/etc/inc/service-utils.inc
index ac58350..b141ba3 100644
--- a/src/etc/inc/service-utils.inc
+++ b/src/etc/inc/service-utils.inc
@@ -464,20 +464,20 @@ function get_service_status_icon($service, $withtext = true, $smallicon = false)
 	$output = "";
 	if (get_service_status($service)) {
 		$statustext = gettext("Running");
-		$output .= "<img style=\"vertical-align:middle\" title=\"" . sprintf(gettext("%s Service is"), $service["name"]) . " {$statustext}\" src=\"/themes/" . $g["theme"] . "/images/icons/";
-		$output .= ($smallicon) ? "icon_pass.gif" : "icon_service_running.gif";
-		$output .= "\" alt=\"status\" />&nbsp;";
+		$output .= "<a title=\"" . sprintf(gettext("%s Service is"), $service["name"]) . " {$statustext}\" ><i class=\"";
+		$output .= ($smallicon) ? "icon icon-play" : "icon icon-large icon-play";
+		$output .= "\" ></i></a>";
 		if ($withtext) {
 			$output .= "&nbsp;" . $statustext;
 		}
 	} else {
 		$service_enabled = is_service_enabled($service['name']);
 		$statustext = ($service_enabled) ? gettext("Stopped") : gettext("Disabled");
-		$output .= "<img style=\"vertical-align:middle\" title=\"" . sprintf(gettext("%s Service is"), $service["name"]) . " {$statustext}\" src=\"/themes/" . $g["theme"] . "/images/icons/";
-		$output .= ($smallicon) ? "icon_block.gif" : "icon_service_stopped.gif";
-		$output .= "\" alt=\"status\" />&nbsp;";
+		$output .= "<a title=\"" . sprintf(gettext("%s Service is"), $service["name"]) . " {$statustext}\" ><i class=\"";
+		$output .= ($smallicon) ? "icon icon-remove" : "icon icon-large icon-remove";
+		$output .= "\" ></i></a>";
 		if ($withtext) {
-			$output .= "&nbsp;<font color=\"white\">{$statustext}</font>";
+			$output .= "&nbsp;" . $statustext;
 		}
 	}
 	return $output;
diff --git a/src/usr/local/www/services_captiveportal_zones.php b/src/usr/local/www/services_captiveportal_zones.php
index 6d956b5..d69577e 100644
--- a/src/usr/local/www/services_captiveportal_zones.php
+++ b/src/usr/local/www/services_captiveportal_zones.php
@@ -71,84 +71,66 @@ include("head.inc");
 
 ?>
 
-<body link="#0000CC" vlink="#0000CC" alink="#0000CC">
-<?php include("fbegin.inc"); ?>
-<form action="services_captiveportal_zones.php" method="post">
-<?php if ($savemsg) print_info_box($savemsg); ?>
-<?php if (is_subsystem_dirty('captiveportal')): ?><p>
-<?php print_info_box_np(gettext("The CaptivePortal entry list has been changed") . ".<br />" . gettext("You must apply the changes in order for them to take effect."));?>
-<?php endif; ?>
-
-<table class="tabcont" width="100%" border="0" cellpadding="0" cellspacing="0" summary="captive portal">
-	<tr>
-		<td width="15%" class="listhdrr"><?=gettext("Zone");?></td>
-		<td width="30%" class="listhdrr"><?=gettext("Interfaces");?></td>
-		<td width="10%" class="listhdrr"><?=gettext("Number of users");?></td>
-		<td width="40%" class="listhdrr"><?=gettext("Description");?></td>
-		<td width="5%" class="list">
-			<table border="0" cellspacing="0" cellpadding="1" summary="icons">
-				<tr>
-					<td valign="middle" width="17">&nbsp;</td>
-					<td valign="middle">
-						<a href="services_captiveportal_zones_edit.php"><img src="/themes/<?= $g['theme']; ?>/images/icons/icon_plus.gif" width="17" height="17" border="0" title="<?=gettext("add a new captiveportal instance");?>" alt="add" /></a>
-					</td>
-				</tr>
-			</table>
-		</td>
-	</tr>
+<html>
+	<body>
+		<form action="services_captiveportal_zones.php" method="post">
+			<?php if ($savemsg) print_info_box($savemsg); ?>
+			<?php if (is_subsystem_dirty('captiveportal')): ?><p>
+			<?php print_info_box_np(gettext("The CaptivePortal entry list has been changed") . ".<br />" . gettext("You must apply the changes in order for them to take effect."));?>
+			<?php endif; ?>
+
+		<div class="panel panel-default">
+		<div class="panel-heading"><h2 class="panel-title"><?=gettext('Captive portal Zones')?></h2></div>
+		<div class="panel-body table-responsive">
+			<table class="table table-striped table-hover">
+				<thead>
+					<tr>
+						<th><?=gettext('Zone')?></th>
+						<th><?=gettext('Interfaces')?></th>
+						<th><?=gettext('Number of users'); ?></th>
+						<th><?=gettext('Description'); ?></th>
+						<th><!-- Action buttons --></th>
+					</tr>
+				</thead>
+				<tbody>
+			
 <?php
 	foreach ($a_cp as $cpzone => $cpitem):
 		if (!is_array($cpitem)) {
 			continue;
 		}
 ?>
-	<tr>
-		<td class="listlr" ondblclick="document.location='services_captiveportal.php?zone=<?=$cpzone;?>';">
-			<?=htmlspecialchars($cpitem['zone']);?>
-		</td>
-		<td class="listlr" ondblclick="document.location='services_captiveportal.php?zone=<?=$cpzone;?>';">
+					<tr>
+						<td><?=htmlspecialchars($cpitem['zone']);?></td>
+						<td>
 <?php
 		$cpifaces = explode(",", $cpitem['interface']);
 		foreach ($cpifaces as $cpiface) {
 			echo convert_friendly_interface_to_friendly_descr($cpiface) . " ";
 		}
 ?>
-		</td>
-		<td class="listr" ondblclick="document.location='services_captiveportal.php?zone=<?=$cpzone;?>';">
-			<?=count(captiveportal_read_db());?>
-		</td>
-		<td class="listbg" ondblclick="document.location='services_captiveportal.php?zone=<?=$cpzone;?>';">
-			<?=htmlspecialchars($cpitem['descr']);?>&nbsp;
-		</td>
-		<td valign="middle" class="list nowrap">
-			<table border="0" cellspacing="0" cellpadding="1" summary="icons">
-				<tr>
-					<td valign="middle"><a href="services_captiveportal.php?zone=<?=$cpzone?>"><img src="/themes/<?= $g['theme']; ?>/images/icons/icon_e.gif" width="17" height="17" border="0" title="<?=gettext("edit captiveportal instance"); ?>" alt="edit" /></a></td>
-					<td>
-						<a href="services_captiveportal_zones.php?act=del&amp;zone=<?=$cpzone;?>" onclick="return confirm('<?=gettext("Do you really want to delete this entry?");?>')"><img src="/themes/<?= $g['theme']; ?>/images/icons/icon_x.gif" width="17" height="17" border="0" title="<?=gettext("delete captiveportal instance");?>" alt="delete" /></a>
-					</td>
-				</tr>
-			</table>
-		</td>
-	</tr>
+						</td>
+						<td><?=count(captiveportal_read_db());?></td>
+						<td><?=htmlspecialchars($cpitem['descr']);?>&nbsp;</td>
+						<td>
+							<a type="button" class="btn btn-info btn-xs" href="services_captiveportal.php?zone=<?=$cpzone?>"><?=gettext('Edit')?></a>
+							<a type="button" class="btn btn-danger btn-xs" href="services_captiveportal_zones.php?act=del&amp;zone=<?=$cpzone;?>"><?=gettext('Del')?></a>
+						</td>
+					</tr>
 <?php
 	endforeach;
 ?>
-	<tr>
-		<td class="list" colspan="4"></td>
-		<td class="list">
-			<table border="0" cellspacing="0" cellpadding="1" summary="add">
-				<tr>
-					<td valign="middle" width="17">&nbsp;</td>
-					<td valign="middle">
-						<a href="services_captiveportal_zones_edit.php"><img src="/themes/<?= $g['theme']; ?>/images/icons/icon_plus.gif" width="17" height="17" border="0" title="<?=gettext("add a new captiveportal instance");?>" alt="add" /></a>
-					</td>
-				</tr>
+				</tbody>
 			</table>
-		</td>
-	</tr>
-</table>
-</form>
-<?php include("fend.inc"); ?>
-</body>
+		</div>
+
+		<nav class="action-buttons">
+			<a href="services_captiveportal_zones_edit.php" class="btn btn-success"><?=gettext('Add')?></a>
+		</nav>
+
+		</div>
+		</form>
+	</body>
 </html>
+
+<?php include("foot.inc"); ?>
diff --git a/src/usr/local/www/status_openvpn.php b/src/usr/local/www/status_openvpn.php
index 2cd2770..9322bb0 100644
--- a/src/usr/local/www/status_openvpn.php
+++ b/src/usr/local/www/status_openvpn.php
@@ -109,8 +109,7 @@ $clients = openvpn_get_active_clients();
 
 include("head.inc"); ?>
 
-<body link="#0000CC" vlink="#0000CC" alink="#0000CC" onload="<?=$jsevents["body"]["onload"];?>">
-<?php include("fbegin.inc"); ?>
+<body>
 <form action="status_openvpn.php" method="get" name="iform">
 <script type="text/javascript">
 //<![CDATA[
@@ -143,130 +142,111 @@ include("head.inc"); ?>
 	}
 //]]>
 </script>
+
 <?php
 	$i = 0;
 	foreach ($servers as $server):
 ?>
 
-<table style="padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px" width="100%" border="0" cellpadding="0" cellspacing="0" summary="status openvpn">
-	<tr>
-		<td colspan="6" class="listtopic">
-			<?=htmlspecialchars($server['name']);?> <?=gettext("Client connections"); ?>
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<table style="padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px" class="tabcont sortable" width="100%" border="0" cellpadding="0" cellspacing="0" summary="connections">
-			<tr>
-				<td class="listhdrr"><?=gettext("Common Name"); ?></td>
-				<td class="listhdrr"><?=gettext("Real Address"); ?></td>
-				<td class="listhdrr"><?=gettext("Virtual Address"); ?></td>
-				<td class="listhdrr"><?=gettext("Connected Since"); ?></td>
-				<td class="listhdrr"><?=gettext("Bytes Sent"); ?></td>
-				<td class="listhdrr"><?=gettext("Bytes Received"); ?></td>
-			</tr>
-<?php
-		foreach ($server['conns'] as $conn):
-?>
-			<tr id="<?php echo "r:{$server['mgmt']}:{$conn['remote_host']}"; ?>">
-				<td class="listlr">
-					<?=$conn['common_name'];?>
-				</td>
-				<td class="listr">
-					<?=$conn['remote_host'];?>
-				</td>
-				<td class="listr">
-					<?=$conn['virtual_addr'];?>
-				</td>
-				<td class="listr">
-					<?=$conn['connect_time'];?>
-				</td>
-				<td class="listr">
-					<?=format_bytes($conn['bytes_sent']);?>
-				</td>
-				<td class="listr">
-					<?=format_bytes($conn['bytes_recv']);?>
-				</td>
-				<td class="list">
-					<img src="/themes/<?php echo $g['theme']; ?>/images/icons/icon_x.gif" height="17" width="17" border="0"
-					   onclick="killClient('<?php echo $server['mgmt']; ?>', '<?php echo $conn['remote_host']; ?>');" style="cursor:pointer;"
-					   id="<?php echo "i:{$server['mgmt']}:{$conn['remote_host']}"; ?>"
-					   title="<?php echo gettext("Kill client connection from") . " " . $conn['remote_host']; ?>" alt="delete" />
-				</td>
-			</tr>
-<?php
-		endforeach;
-?>
-			<tfoot>
-			<tr>
-				<td colspan="2" class="list" height="12">
-				<table>
-				<tr>
-				<td><?php $ssvc = find_service_by_openvpn_vpnid($server['vpnid']); ?>
-				<?= get_service_status_icon($ssvc, true, true); ?>
-				<?= get_service_control_links($ssvc, true); ?></td>
-				</tr>
-				</table>
-				</td>
-				<td colspan="4" class="list" height="12">&nbsp;</td>
-			</tr>
-			</tfoot>
-		</table>
-		</td>
-	</tr>
-</table>
+<div class="panel panel-default">
+		<div class="panel-heading"><h2 class="panel-title"><?=htmlspecialchars($server['name']);?> <?=gettext('Client connections')?></h2></div>
+		<div class="panel-body table-responsive">
+			<table class="table table-striped table-hover">
+				<thead>
+					<tr>
+						<th><?=gettext("Common Name")?></th>
+						<th><?=gettext("Real Address")?></th>
+						<th><?=gettext("Virtual Address"); ?></th>
+						<th><?=gettext("Connected Since"); ?></th>
+						<th><?=gettext("Bytes Sent")?></th>
+						<th><?=gettext("Bytes Received")?></th>
+					</tr>
+				</thead>
+				<tbody>
+					
+					<?php
+							foreach ($server['conns'] as $conn):
+					?>
+					<tr id="<?php echo "r:{$server['mgmt']}:{$conn['remote_host']}"; ?>">
+						<td><?=$conn['common_name'];?></td>
+						<td><?=$conn['remote_host'];?></td>
+						<td><?=$conn['virtual_addr'];?></td>
+						<td><?=$conn['connect_time'];?></td>
+						<td><?=format_bytes($conn['bytes_sent']);?></td>
+						<td><?=format_bytes($conn['bytes_recv']);?></td>
+						<td>
+							<a
+							   onclick="killClient('<?php echo $server['mgmt']; ?>', '<?php echo $conn['remote_host']; ?>');" style="cursor:pointer;"
+							   id="<?php echo "i:{$server['mgmt']}:{$conn['remote_host']}"; ?>"
+							   title="<?php echo gettext("Kill client connection from") . " " . $conn['remote_host']; ?>">
+							<i class="icon icon-remove"></i>
+							</a>
+						</td>
+					</tr>
+					<?php
+							endforeach;
+					?>
+				</tbody>
+				<tfoot>
+					<tr>
+						<td>
+							<table>
+								<tr>
+									<td>
+										<?php $ssvc = find_service_by_openvpn_vpnid($server['vpnid']); ?>
+										<?= get_service_status_icon($ssvc, true, true); ?>
+										<?= get_service_control_links($ssvc, true); ?>
+									</td>
+								</tr>
+							</table>
+						</td>
+					</tr>
+				</tfoot>
+			</table>
+		</div>
+</div>
 <?php
 		if (is_array($server['routes']) && count($server['routes'])):
 ?>
 <div id="shroutebut-<?= $i ?>">
-<input type="button" onClick="show_routes('tabroute-<?= $i ?>','shroutebut-<?= $i ?>')" value="<?php echo gettext("Show Routing Table"); ?>" /> - <?= gettext("Display OpenVPN's internal routing table for this server.") ?>
-<br /><br />
+	<input type="button" onClick="show_routes('tabroute-<?= $i ?>','shroutebut-<?= $i ?>')" value="<?php echo gettext("Show Routing Table"); ?>" /> - <?= gettext("Display OpenVPN's internal routing table for this server.") ?>
+		<br /><br />
 </div>
-<table style="display: none; padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px" width="100%" border="0" cellpadding="0" cellspacing="0" id="tabroute-<?= $i ?>" summary="routing table">
-	<tr>
-		<td colspan="6" class="listtopic">
-			<?=htmlspecialchars($server['name']);?> <?=gettext("Routing Table"); ?>
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<table style="padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px" class="tabcont sortable" width="100%" border="0" cellpadding="0" cellspacing="0" summary="results">
-			<tr>
-				<td class="listhdrr"><?=gettext("Common Name"); ?></td>
-				<td class="listhdrr"><?=gettext("Real Address"); ?></td>
-				<td class="listhdrr"><?=gettext("Target Network"); ?></td>
-				<td class="listhdrr"><?=gettext("Last Used"); ?></td>
-			</tr>
+<div class="panel panel-default">
+		<div class="panel-heading"><h2 class="panel-title"><?=htmlspecialchars($server['name']);?> <?=gettext("Routing Table"); ?></h2></div>
+		<div class="panel-body table-responsive">
+			<table class="table table-striped table-hover">
+				<thead>
+					<tr>
+						<th><?=gettext("Common Name"); ?></th>
+						<th><?=gettext("Real Address"); ?></th>
+						<th><?=gettext("Target Network"); ?></th>
+						<th><?=gettext("Last Used"); ?></th>
+					</tr>
+				</thead>	
+				<tbody>
 
 <?php
 			foreach ($server['routes'] as $conn):
 ?>
-			<tr id="<?php echo "r:{$server['mgmt']}:{$conn['remote_host']}"; ?>">
-				<td class="listlr">
-					<?=$conn['common_name'];?>
-				</td>
-				<td class="listr">
-					<?=$conn['remote_host'];?>
-				</td>
-				<td class="listr">
-					<?=$conn['virtual_addr'];?>
-				</td>
-				<td class="listr">
-					<?=$conn['last_time'];?>
-				</td>
-			</tr>
+					<tr id="<?php echo "r:{$server['mgmt']}:{$conn['remote_host']}"; ?>">
+						<td><?=$conn['common_name'];?></td>
+						<td><?=$conn['remote_host'];?></td>
+						<td><?=$conn['virtual_addr'];?></td>
+						<td><?=$conn['last_time'];?></td>
+					</tr>
 <?php
 			endforeach;
 ?>
-			<tfoot>
-			<tr>
-				<td colspan="6" class="list" height="12"><?= gettext("An IP address followed by C indicates a host currently connected through the VPN.") ?></td>
-			</tr>
-			</tfoot>
-		</table>
-		</td>
-	</tr>
-</table>
+				</tbody>
+				<tfoot>
+					<tr>
+						<td><?= gettext("An IP address followed by C indicates a host currently connected through the VPN.") ?></td>
+					</tr>
+				</tfoot>
+			</table>
+		</div>
+</div>
 <?php
 		endif;
 ?>
@@ -280,69 +260,53 @@ include("head.inc"); ?>
 <?php
 	if (!empty($sk_servers)) {
 ?>
-<table style="padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px" width="100%" border="0" cellpadding="0" cellspacing="0" summary="peer to peer stats">
-	<tr>
-		<td colspan="6" class="listtopic">
-			<?=gettext("Peer to Peer Server Instance Statistics"); ?>
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<table style="padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px" class="tabcont sortable" width="100%" border="0" cellpadding="0" cellspacing="0" summary="results">
-			<tr>
-				<td class="listhdrr"><?=gettext("Name"); ?></td>
-				<td class="listhdrr"><?=gettext("Status"); ?></td>
-				<td class="listhdrr"><?=gettext("Connected Since"); ?></td>
-				<td class="listhdrr"><?=gettext("Virtual Addr"); ?></td>
-				<td class="listhdrr"><?=gettext("Remote Host"); ?></td>
-				<td class="listhdrr"><?=gettext("Bytes Sent"); ?></td>
-				<td class="listhdrr"><?=gettext("Bytes Rcvd"); ?></td>
-				<td class="listhdrr"><?=gettext("Service"); ?></td>
-			</tr>
+<div class="panel panel-default">
+	<div class="panel-heading"><h2 class="panel-title"><?=gettext("Peer to Peer Server Instance Statistics"); ?></h2></div>
+		<div class="panel-body table-responsive">
+			<table class="table table-striped table-hover">
+				<thead>
+					<tr>  
+						<th><?=gettext("Name"); ?></th>
+						<th><?=gettext("Connected Since"); ?></th>
+						<th><?=gettext("Virtual Addr"); ?></th>
+						<th><?=gettext("Remote Host"); ?></th>
+						<th><?=gettext("Bytes Sent"); ?></th>
+						<th><?=gettext("Bytes Rcvd"); ?></th>
+						<th><?=gettext("Service"); ?></th>
+					</tr>
+				</thead>
+				<tbody>
 
 <?php
 		foreach ($sk_servers as $sk_server):
 ?>
-			<tr id="<?php echo "r:{$sk_server['port']}:{$sk_server['vpnid']}"; ?>">
-				<td class="listlr">
-					<?=htmlspecialchars($sk_server['name']);?>
-				</td>
-				<td class="listr">
-					<?=$sk_server['status'];?>
-				</td>
-				<td class="listr">
-					<?=$sk_server['connect_time'];?>
-				</td>
-				<td class="listr">
-					<?=$sk_server['virtual_addr'];?>
-				</td>
-				<td class="listr">
-					<?=$sk_server['remote_host'];?>
-				</td>
-				<td class="listr">
-					<?=format_bytes($sk_server['bytes_sent']);?>
-				</td>
-				<td class="listr">
-					<?=format_bytes($sk_server['bytes_recv']);?>
-				</td>
-				<td class="listr">
-				<table>
-				<tr>
-				<td><?php $ssvc = find_service_by_openvpn_vpnid($sk_server['vpnid']); ?>
-				<?= get_service_status_icon($ssvc, false, true); ?>
-									<?= get_service_control_links($ssvc, true); ?>
-								</td>
-				</tr>
-				</table>
-				</td>
-			</tr>
+					<tr id="<?php echo "r:{$sk_server['port']}:{$sk_server['vpnid']}"; ?>">
+						<td><?=htmlspecialchars($sk_server['name']);?></td>
+						<td><?=$sk_server['status'];?></td>
+						<td><?=$sk_server['connect_time'];?></td>
+						<td><?=$sk_server['virtual_addr'];?></td>
+						<td><?=$sk_server['remote_host'];?></td>
+						<td><?=format_bytes($sk_server['bytes_sent']);?></td>
+						<td><?=format_bytes($sk_server['bytes_recv']);?></td>
+						<td>
+							<table>
+								<tr>
+									<td>
+										<?php $ssvc = find_service_by_openvpn_vpnid($sk_server['vpnid']); ?>
+										<?= get_service_status_icon($ssvc, false, true); ?>
+										<?= get_service_control_links($ssvc, true); ?>
+									</td>
+								</tr>
+							</table>
+						</td>
+					</tr>
 <?php
 		endforeach;
 ?>
+				</tbody>
 			</table>
-		</td>
-	</tr>
-</table>
+		</div>
+</div>
 
 <?php
 	}
@@ -351,84 +315,67 @@ include("head.inc"); ?>
 <?php
 	if (!empty($clients)) {
 ?>
-<table style="padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px" width="100%" border="0" cellpadding="0" cellspacing="0" summary="client stats">
-	<tr>
-		<td colspan="6" class="listtopic">
-			<?=gettext("Client Instance Statistics"); ?>
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<table style="padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px" class="tabcont sortable" width="100%" border="0" cellpadding="0" cellspacing="0" summary="results">
-			<tr>
-				<td class="listhdrr"><?=gettext("Name"); ?></td>
-				<td class="listhdrr"><?=gettext("Status"); ?></td>
-				<td class="listhdrr"><?=gettext("Connected Since"); ?></td>
-				<td class="listhdrr"><?=gettext("Virtual Addr"); ?></td>
-				<td class="listhdrr"><?=gettext("Remote Host"); ?></td>
-				<td class="listhdrr"><?=gettext("Bytes Sent"); ?></td>
-				<td class="listhdrr"><?=gettext("Bytes Rcvd"); ?></td>
-				<td class="listhdrr"><?=gettext("Service"); ?></td>
-			</tr>
+<div class="panel panel-default">
+	<div class="panel-heading"><h2 class="panel-title"><?=gettext("Client Instance Statistics"); ?></h2></div>
+		<div class="panel-body table-responsive">
+			<table class="table table-striped table-hover">
+				<thead>
+					<tr>  
+						<th><?=gettext("Name"); ?></th>
+						<th><?=gettext("Status"); ?></th>
+						<th><?=gettext("Connected Since"); ?></th>
+						<th><?=gettext("Virtual Addr"); ?></th>
+						<th><?=gettext("Remote Host"); ?></th>
+						<th><?=gettext("Bytes Sent"); ?></th>
+						<th><?=gettext("Bytes Rcvd"); ?></th>
+						<th><?=gettext("Service"); ?></th>
+					</tr>
+				</thead>
+				<tbody>
 
 <?php
 		foreach ($clients as $client):
 ?>
-			<tr id="<?php echo "r:{$client['port']}:{$client['vpnid']}"; ?>">
-				<td class="listlr">
-					<?=htmlspecialchars($client['name']);?>
-				</td>
-				<td class="listr">
-					<?=$client['status'];?>
-				</td>
-				<td class="listr">
-					<?=$client['connect_time'];?>
-				</td>
-				<td class="listr">
-					<?=$client['virtual_addr'];?>
-				</td>
-				<td class="listr">
-					<?=$client['remote_host'];?>
-				</td>
-				<td class="listr">
-					<?=format_bytes($client['bytes_sent']);?>
-				</td>
-				<td class="listr">
-					<?=format_bytes($client['bytes_recv']);?>
-				</td>
-				<td class="listr" height="12">
-				<table>
-				<tr>
-								<td>
-									<?php $ssvc = find_service_by_openvpn_vpnid($client['vpnid']); ?>
-				<?= get_service_status_icon($ssvc, false, true); ?>
-									<?= get_service_control_links($ssvc, true); ?>
-								</td>
-				</tr>
-				</table>
-				</td>
-			</tr>
+					<tr id="<?php echo "r:{$client['port']}:{$client['vpnid']}"; ?>">
+						<td><?=htmlspecialchars($client['name']);?></td>
+						<td><?=$client['status'];?></td>
+						<td><?=$client['connect_time'];?></td>
+						<td><?=$client['virtual_addr'];?></td>
+						<td><?=$client['remote_host'];?></td>
+						<td><?=format_bytes($client['bytes_sent']);?></td>
+						<td><?=format_bytes($client['bytes_recv']);?></td>
+						<td>
+							<table>
+								<tr>
+									<td>
+										<?php $ssvc = find_service_by_openvpn_vpnid($client['vpnid']); ?>
+										<?= get_service_status_icon($ssvc, false, true); ?>
+										<?= get_service_control_links($ssvc, true); ?>
+									</td>
+								</tr>
+							</table>
+						</td>
+					</tr>
 <?php
 		endforeach;
 ?>
+				</tbody>
 			</table>
-		</td>
-	</tr>
-</table>
+		</div>
+</div>
 
 <?php 
 }
 
 if ($DisplayNote) {
-	echo "<br /><b>" . gettext("NOTE") . ":</b> " . gettext("If you have custom options that override the management features of OpenVPN on a client or server, they will cause that OpenVPN instance to not work correctly with this status page.");
+ 	print_info_box(gettext("If you have custom options that override the management features of OpenVPN on a client or server, they will cause that OpenVPN instance to not work correctly with this status page."));
 }
 
 if ((empty($clients)) && (empty($servers)) && (empty($sk_servers))) {
-	echo gettext("No OpenVPN instances defined");
+	print_info_box(gettext("No OpenVPN instances defined"));
 }
 ?>
 </form>
-
 <?php include("fend.inc"); ?>
 <script type="text/javascript">
 //<![CDATA[
diff --git a/src/usr/local/www/status_queues.php b/src/usr/local/www/status_queues.php
index 42789bf..37537b8 100644
--- a/src/usr/local/www/status_queues.php
+++ b/src/usr/local/www/status_queues.php
@@ -103,15 +103,14 @@ if ($_REQUEST['getactivity']) {
 	$finscript = "";
 	foreach ($statistics as $q) {
 		if ($stat_type == "0") {
-			$packet_s = round(150 * (1 - $q->pps / $bigger_stat), 0);
+			$packet_s = round(100 * ($q->pps / $bigger_stat), 0);
 		} else {
-			$packet_s = round(150 * (1 - $q->bandwidth / $bigger_stat), 0);
+			$packet_s = round(100 * ($q->bandwidth / $bigger_stat), 0);
 		}
 		if ($packet_s < 0) {
 			$packet_s = 0;
 		}
-		$finscript .= "jQuery('#queue{$q->queuename}widthb').width('{$packet_s}');";
-		$finscript .= "jQuery('#queue{$q->queuename}widtha').width('" . (150 - $packet_s) . "');";
+		$finscript .= "jQuery('#queue{$q->queuename}width').css('width','{$packet_s}%');";
 		$finscript .= "jQuery('#queue{$q->queuename}pps').val('" . number_format($q->pps, 1) . "');";
 		$finscript .= "jQuery('#queue{$q->queuename}bps').val('" . format_bits($q->bandwidth) . "');";
 		$finscript .= "jQuery('#queue{$q->queuename}borrows').val('{$q->borrows}');";
@@ -128,11 +127,11 @@ $pgtitle = array(gettext("Status"), gettext("Traffic shaper"), gettext("Queues")
 $shortcut_section = "trafficshaper";
 include("head.inc");
 ?>
-<body link="#0000CC" vlink="#0000CC" alink="#0000CC">
-<?php include("fbegin.inc"); ?>
+<body>
+<script src="/jquery/jquery-1.11.2.min.js"></script>
 <?php
 if (!is_array($config['shaper']['queue']) || count($config['shaper']['queue']) < 1) {
-	echo gettext("Traffic shaping is not configured.");
+	print_info_box(gettext("Traffic shaping is not configured."));
 	include("fend.inc");
 	echo "</body></html>";
 	exit;
@@ -161,38 +160,46 @@ if (!is_array($config['shaper']['queue']) || count($config['shaper']['queue']) <
 	});
 //]]>
 </script>
-<?php endif; ?>
-<table width="100%" border="1" cellpadding="0" cellspacing="0" summary="status queues">
-<?php if ($error): ?>
-	<tr><td><?php echo $error; ?></td></tr>
-<?php else: ?>
-	<tr>
-		<td class="listhdr"><?=gettext("Queue"); ?></td>
-		<td class="listhdr">
-			<?=gettext("Statistics"); ?>
-			<select id="selStatistic">
-				<option value="0">PPS</option>
-				<option value="1">Bandwidth</option>
-			</select>
-		</td>
-		<td class="listhdr" width="1%"><?=gettext("PPS"); ?></td>
-		<td class="listhdr" width="1%"><?=gettext("Bandwidth"); ?></td>
-		<td class="listhdr" width="1%"><?=gettext("Borrows"); ?></td>
-		<td class="listhdr" width="1%"><?=gettext("Suspends"); ?></td>
-		<td class="listhdr" width="1%"><?=gettext("Drops"); ?></td>
-		<td class="listhdr" width="1%"><?=gettext("Length"); ?></td>
-	</tr>
+<?php endif; 
+
+if ($error): 
+	print_info_box($error);
+else: ?>
+	<div class="panel panel-default">
+	<div class="panel-heading"><h2 class="panel-title"><?=gettext("Status Queues"); ?></h2></div>
+		<div class="panel-body table-responsive">
+			<table class="table table-striped table-hover">
+				<thead>
+					<tr>  
+						<th><?=gettext("Queue"); ?></th>
+						<th><?=gettext("Statistics"); ?>
+							<select id="selStatistic">
+								<option value="0">PPS</option>
+								<option value="1">Bandwidth</option>
+							</select>
+						</th>
+						<th><?=gettext("PPS"); ?></th>
+						<th><?=gettext("Bandwidth"); ?></th>
+						<th><?=gettext("Borrows"); ?></th>
+						<th><?=gettext("Suspends"); ?></th>
+						<th><?=gettext("Drops"); ?></th>
+						<th><?=gettext("Length"); ?></th>
+					</tr>
+				</thead>	
 <?php
 	$if_queue_list = get_configured_interface_list_by_realif(false, true);
 	processQueues($altqstats, 0, "");
 ?>
 <?php endif; ?>
-</table>
-<p>
-	<strong><span class="red"><?=gettext("Note"); ?>:</span></strong><br />
-	<?=gettext("Queue graphs take 5 seconds to sample data"); ?>.<br />
-	<?=gettext("You can configure the Traffic Shaper"); ?> <a href="/firewall_shaper_wizards.php"><?=gettext("here"); ?></a>.
-</p>
+			</table>
+</br>
+
+<?php 
+
+	print_info_box(gettext("Queue graphs take 5 seconds to sample data"));
+
+?>
+
 <script type="text/javascript">
 //<![CDATA[
 	function StatsShowHide(classname) {
@@ -229,7 +236,7 @@ function processQueues($altqstats, $level, $parent_name) {
 			}
 		}
 		if ($prev_if != $q['interface']) {
-			echo "<tr><td colspan=\"8\" style=\"padding: 2px;\"><b>Interface ". htmlspecialchars(convert_real_interface_to_friendly_descr($q['interface'])) . "</b></td></tr>";
+			echo "<tr><td><b>Interface ". htmlspecialchars(convert_real_interface_to_friendly_descr($q['interface'])) . "</b></td></tr>";
 			$prev_if = $q['interface'];
 		}
 ?>
@@ -237,6 +244,9 @@ function processQueues($altqstats, $level, $parent_name) {
 			<td bgcolor="#<?php echo $row_background?>" style="padding-left: <?php echo $level * 20?>px;">
 				<font color="#000000">
 					<?
+					if (is_array($q['queue'])) {
+						echo "<a href=\"#\" onclick=\"StatsShowHide('queuerow{$q['name']}{$q['interface']}');return false\">+/-</a> ";
+					}
 					if (strstr($q['name'], "root_")) {
 						echo "<a href=\"firewall_shaper.php?interface={$if_name}&amp;queue={$if_name}&amp;action=show\">Root queue</a>";
 					} else {
@@ -247,21 +257,17 @@ function processQueues($altqstats, $level, $parent_name) {
 			</td>
 <?php
 		$cpuUsage = 0;
-		echo "<td class=\"nowrap\" width=\"1%\" bgcolor=\"#{$row_background}\">";
-		echo "<img src='./themes/".$g['theme']."/images/misc/bar_left.gif' height='10' width='4' border='0' align='middle' alt='' />";
-		echo "<img src='./themes/".$g['theme']."/images/misc/bar_blue.gif' height='10' name='queue{$q['name']}{$q['interface']}widtha' id='queue{$q['name']}{$q['interface']}widtha' width='" . $cpuUsage . "' border='0' align='middle' alt='" . htmlspecialchars($q['name']) . "' />";
-		echo "<img src='./themes/".$g['theme']."/images/misc/bar_gray.gif' height='10' name='queue{$q['name']}{$q['interface']}widthb' id='queue{$q['name']}{$q['interface']}widthb' width='" . (150 - $cpuUsage) . "' border='0' align='middle' alt='" . htmlspecialchars($q['name']) . "' />";
-		echo "<img src='./themes/".$g['theme']."/images/misc/bar_right.gif' height='10' width='5' border='0' align='middle' alt='' /> ";
-		if (is_array($q['queue'])) {
-			echo "<a href=\"#\" onclick=\"StatsShowHide('queuerow{$q['name']}{$q['interface']}');return false\">+/-</a> ";
-		}
+		echo "<td bgcolor=\"#{$row_background}\">";
+		echo "<div class='progress' style='height: 7px;width: 170px;'>
+				<div class='progress-bar' role='progressbar' name='queue{$q['name']}{$q['interface']}width' id='queue{$q['name']}{$q['interface']}width' aria-valuenow='70' aria-valuemin='0' aria-valuemax='100' style='width: ".  ($cpuUsage*100) ."%;'></div>
+			  </div>";
 		echo " </td>";
-		echo "<td width=\"1%\" bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}pps' id='queue{$q['name']}{$q['interface']}pps' value='(" . gettext("Loading") . ")' align='left' /></td>";
-		echo "<td width=\"1%\" bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:80px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}bps' id='queue{$q['name']}{$q['interface']}bps' value='' align='right' /></td>";
-		echo "<td width=\"1%\" bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}borrows' id='queue{$q['name']}{$q['interface']}borrows' value='' align='right' /></td>";
-		echo "<td width=\"1%\" bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}suspends' id='queue{$q['name']}{$q['interface']}suspends' value='' align='right' /></td>";
-		echo "<td width=\"1%\" bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}drops' id='queue{$q['name']}{$q['interface']}drops' value='' align='right' /></td>";
-		echo "<td width=\"1%\" bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}length' id='queue{$q['name']}{$q['interface']}length' value='' align='right' /></td>";
+		echo "<td bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}pps' id='queue{$q['name']}{$q['interface']}pps' value='(" . gettext("Loading") . ")' align='left' /></td>";
+		echo "<td bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:80px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}bps' id='queue{$q['name']}{$q['interface']}bps' value='' align='right' /></td>";
+		echo "<td bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}borrows' id='queue{$q['name']}{$q['interface']}borrows' value='' align='right' /></td>";
+		echo "<td bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}suspends' id='queue{$q['name']}{$q['interface']}suspends' value='' align='right' /></td>";
+		echo "<td bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}drops' id='queue{$q['name']}{$q['interface']}drops' value='' align='right' /></td>";
+		echo "<td bgcolor=\"#{$row_background}\"><input style='border: 0px solid white; background-color:#{$row_background}; color:#000000;width:70px;text-align:right;' size='10' name='queue{$q['name']}{$q['interface']}length' id='queue{$q['name']}{$q['interface']}length' value='' align='right' /></td>";
 ?>
 		</tr>
 <?php
author	Renato Botelho <renato@netgate.com>	2015-09-16 16:15:30 -0300
committer	Renato Botelho <renato@netgate.com>	2015-09-16 16:15:30 -0300
commit	b44845f8735e78235b912828f95b6729ecaba6c2 (patch)
tree	8ea091fc9fd5bdc51284c93256359b8f9c4e260e /src
parent	910b77ad1682740e481df29fc2d9c528a13c2da4 (diff)
parent	b40061093c81866bf19c0a175165c1985b34dfc4 (diff)
download	pfsense-b44845f8735e78235b912828f95b6729ecaba6c2.zip pfsense-b44845f8735e78235b912828f95b6729ecaba6c2.tar.gz