mirror of
https://github.com/unraid/webgui.git
synced 2026-01-17 23:20:02 -06:00
Merge pull request #61 from bergware/master
Add collapsable CPU load details in Dashboard
This commit is contained in:
@@ -175,7 +175,9 @@ echo "<td>Array Status</td>".implode('',$row0);
|
||||
</td></tr><tr><td colspan='4'><center>Load Statistics</center></td></tr></thead>
|
||||
<tbody>
|
||||
<tr class='wide'><td>Avg. CPU load</td><td colspan='3'><div class='usage-disk sys'><span id='cpu' style='width:0'></span></div></td></tr>
|
||||
<?if (count($cpus)>1):?><tr><td rowspan='<?=count($cpus)?>'><?else:?><tr class='wide'><td><?endif;?>Per CPU load</td>
|
||||
</tbody>
|
||||
<tbody class='cpu_open' style='display:none'>
|
||||
<?if (count($cpus)>1):?><tr><td rowspan='<?=count($cpus)?>'><?else:?><tr class='wide'><td><?endif;?><a href='#' onclick='toggle_CPU()' title='Click to hide details' class='none'>Per CPU load</a><span class='red-text'> *</span></td>
|
||||
<?
|
||||
$tr = false;
|
||||
foreach ($cpus as $pair):
|
||||
@@ -188,6 +190,21 @@ foreach ($cpus as $pair):
|
||||
echo "</tr>";
|
||||
$tr = true;
|
||||
endforeach;
|
||||
?>
|
||||
</tbody>
|
||||
<tbody class='cpu_closed' style='display:none'>
|
||||
<?
|
||||
$text = '';
|
||||
foreach ($cpus as $pair):
|
||||
list($cpu1, $cpu2) = preg_split('/[,-]/',$pair);
|
||||
if ($text) $text .= ", ";
|
||||
$text .= isset($cpu2) ? "[$cpu1/$cpu2]" : $cpu1;
|
||||
endforeach;
|
||||
?>
|
||||
<tr class='wide'><td><a href='#' onclick='toggle_CPU()' title='Click to show details' class='none'>Per CPU load</a><span class='red-text'> *</span></td><td colspan='3' style='text-align:center'><?=$text?></td></tr>
|
||||
</tbody>
|
||||
<tbody>
|
||||
<?
|
||||
if ($fans>0):
|
||||
echo $fans>2 ? "<tr><td rowspan='".ceil($fans/2)."'>" : "<tr class='wide'><td>";
|
||||
echo "FAN speed</td>";
|
||||
@@ -485,9 +502,22 @@ function dropdown(menu) {
|
||||
$(select+' option')[$.cookie(menu)].selected = true;
|
||||
$(select).change();
|
||||
}
|
||||
function toggle_CPU(init) {
|
||||
if (!init) {
|
||||
if ($.cookie('cpu')===undefined) $.cookie('cpu','close',{path:'/',expires:3650}); else $.removeCookie('cpu',{path:'/'});
|
||||
}
|
||||
if ($.cookie('cpu')===undefined) {
|
||||
$('.cpu_open').show();
|
||||
$('.cpu_closed').hide();
|
||||
} else {
|
||||
$('.cpu_open').hide();
|
||||
$('.cpu_closed').show();
|
||||
}
|
||||
}
|
||||
$(function() {
|
||||
dropdown('enter_share');
|
||||
dropdown('enter_view');
|
||||
toggle_CPU(true);
|
||||
update3();
|
||||
update60();
|
||||
update30();
|
||||
|
||||
@@ -290,7 +290,7 @@ foreach ($pages as $page) {
|
||||
if (!file_exists($icon)) { $icon = "{$pg['root']}/{$pg['Icon']}"; if (!file_exists($icon)) $icon = false; }
|
||||
}
|
||||
if (!$icon) $icon = "/webGui/images/default.png";
|
||||
echo "<div class=\"Panel\"><a href=\"$link\" onclick=\"$.cookie('one','tab1',{path:'/'})\"><img class=\"PanelImg\" src=\"$icon\" title=\"$title\"><br><div class=\"PanelText\">$title</div></a></div>";
|
||||
echo "<div class=\"Panel\"><a href=\"$link\" onclick=\"$.cookie('one','tab1',{path:'/'})\"><img class=\"PanelImg\" src=\"$icon\"><br><div class=\"PanelText\">$title</div></a></div>";
|
||||
}
|
||||
}
|
||||
$text = $page['text'];
|
||||
|
||||
@@ -55,7 +55,7 @@ function device_info(&$disk) {
|
||||
case 'grey-off': $help = 'Device not present'; break;
|
||||
}
|
||||
$status = "$ctrl<a class='info nohand' onclick='return false'><img src='/webGui/images/{$disk['color']}.png' class='icon'><span>$help</span></a>";
|
||||
$link = strpos($disk['status'], 'DISK_NP')===false ? "<a href='$path/$type?name=$name' title='".$fancyname." Settings'>".$fancyname."</a>" : $fancyname;
|
||||
$link = strpos($disk['status'], 'DISK_NP')===false ? "<a href='$path/$type?name=$name'>".$fancyname."</a>" : $fancyname;
|
||||
return $status.$link;
|
||||
}
|
||||
function device_browse(&$disk) {
|
||||
|
||||
@@ -3,11 +3,11 @@ html,body{font-family:arimo;font-size:12px;color:#808080;background-color:#00000
|
||||
img{border:0;text-decoration:none;vertical-align:middle;}
|
||||
p{text-align:justify;}
|
||||
p.centered{text-align:left;}
|
||||
a:hover{text-decoration:underline;}
|
||||
a{color:#486DBA;text-decoration:none;}
|
||||
a.none{color:#808080;}
|
||||
a.img{text-decoration:none;border:none;}
|
||||
a.info{position:relative;z-index:1;}
|
||||
a.info:hover{}
|
||||
a.info span{display:none;}
|
||||
a.info:hover span{display:block;white-space:nowrap;font-variant:small-caps;position:absolute;left:8px;font-size:11px;line-height:20px;color:#FFFFFF;padding:5px 8px;border:1px solid rgba(255,255,255,0.25);border-radius:3px;background-color:rgba(25,25,25,0.95);box-shadow:0 0 3px #505050;}
|
||||
a.info:hover span.left{left:-182px;}
|
||||
@@ -58,7 +58,7 @@ input.trim{width:50px;}
|
||||
#nav-block #nav-item:hover{border-bottom:thick solid #478406;border-radius:5px;background:-webkit-radial-gradient(#3B3F40,#28292D);background:linear-gradient(#3B3F40,#28292D);}
|
||||
#nav-block #nav-item.active{color:#FFFFFF;border-right:thin solid #606060;border-bottom:thick solid #478406;border-radius:5px;background:-webkit-radial-gradient(#303030,#000000);background:linear-gradient(#303030,#000000);}
|
||||
#nav-block #nav-item a{color:#F0F0F0;font-style:normal;display:block;padding-left:10px;padding-right:10px;min-width:46px;}
|
||||
#nav-block #nav-item a:hover{color:#9CD670;}
|
||||
#nav-block #nav-item a:hover{color:#9CD670;text-decoration:none;}
|
||||
#nav-block #nav-item.active a{color:#FFFFFF;}
|
||||
#nav-block #nav-item.active:hover a{color:#FFFFFF;}
|
||||
.nav-button-active{color:#FFFFFF;border-right:thin solid #606060;background:-webkit-radial-gradient(#303030,#000000);background:linear-gradient(#303030,#000000);}
|
||||
|
||||
@@ -3,11 +3,11 @@ html,body{font-family:arimo;font-size:12px;color:#303030;background-color:#FFFFF
|
||||
img{border:0;text-decoration:none;vertical-align:middle;}
|
||||
p{text-align:justify;}
|
||||
p.centered{text-align:left;}
|
||||
a:hover{text-decoration:underline;}
|
||||
a{color:#00529B;text-decoration:none;}
|
||||
a.none{color:#303030;}
|
||||
a.img{text-decoration:none;border:none;}
|
||||
a.info{position:relative;z-index:1;}
|
||||
a.info:hover{}
|
||||
a.info span{display:none;}
|
||||
a.info:hover span{display:block;white-space:nowrap;font-variant:small-caps;position:absolute;left:8px;font-size:11px;line-height:20px;color:#FFFFFF;padding:5px 8px;border:1px solid rgba(255,255,255,0.25);border-radius:3px;background-color:rgba(25,25,25,0.95);box-shadow:0 0 3px #303030;}
|
||||
a.info:hover span.left{left:-182px;}
|
||||
@@ -57,7 +57,7 @@ input.trim{width:50px;}
|
||||
#nav-block #nav-item:hover{border-bottom:thick solid #478406;border-radius:5px;background:-webkit-radial-gradient(#3B3F40,#28292D);background:linear-gradient(#3B3F40,#28292D);}
|
||||
#nav-block #nav-item.active{color:#FFFFFF;border-right:thin solid #585858;border-bottom:thick solid #478406;border-radius:5px;background:-webkit-radial-gradient(#303030,#000000);background:linear-gradient(#303030,#000000);}
|
||||
#nav-block #nav-item a{color:#F0F0F0;font-style:normal;display:block;padding-left:10px;padding-right:10px;min-width:46px;}
|
||||
#nav-block #nav-item a:hover{color:#9CD670;}
|
||||
#nav-block #nav-item a:hover{color:#9CD670;text-decoration:none;}
|
||||
#nav-block #nav-item.active a{color:#FFFFFF;}
|
||||
#nav-block #nav-item.active:hover a{color:#FFFFFF;}
|
||||
.nav-button-active{color:#FFFFFF;border-right:thin solid #585858;background:-webkit-radial-gradient(#303030,#000000);background:linear-gradient(#303030,#000000);}
|
||||
|
||||
Reference in New Issue
Block a user