Dashboard bugfixes

This commit is contained in:
BNoiZe
2013-10-27 10:44:31 +01:00
parent be9bf3fd34
commit c233fbfffb
5 changed files with 234 additions and 203 deletions

View File

@@ -36,7 +36,7 @@
</if> </if>
<else> <else>
<div class="progress"> <div class="progress">
<div class="bar" style="width: 50%"></div> <div class="bar" style="width: 0%"></div>
</div> </div>
</if> </if>
</span> </span>
@@ -54,7 +54,7 @@
</if> </if>
<else> <else>
<div class="progress"> <div class="progress">
<div class="bar" style="width: 50%"></div> <div class="bar" style="width: 0%"></div>
</div> </div>
</if> </if>
</span> </span>

View File

@@ -196,7 +196,6 @@ $header
</if> </if>
</div> </div>
<section style="clear:both"></section>
<h3>System Information</h3> <h3>System Information</h3>
<section class="dboarditem bradius"> <section class="dboarditem bradius">
<table> <table>

View File

@@ -806,9 +806,8 @@ select[multiple="multiple"] {
.cronjobtask li { .cronjobtask li {
background-image: url(../img/icons/clock.png); background-image: url(../img/icons/clock.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: 0px center; background-position: 0px 1px;
padding-left: 18px; padding-left: 18px;
height: 18px;
} }
.overviewheading { .overviewheading {

View File

@@ -2,6 +2,7 @@ $(document).ready(function() {
var usedColor = "#91c46b"; var usedColor = "#91c46b";
var assiColor = "#287e7e"; var assiColor = "#287e7e";
var unliColor = "#56606e"; var unliColor = "#56606e";
var overColor = "#dd514c";
$(".circular").each(function(index, element) { $(".circular").each(function(index, element) {
var canvas = "#" + $(element).attr("id") + "-canvas"; var canvas = "#" + $(element).attr("id") + "-canvas";
@@ -15,6 +16,7 @@ $(document).ready(function() {
// Draw percentages // Draw percentages
if (!isNaN(assigned) && available == "∞") { if (!isNaN(assigned) && available == "∞") {
// Unlimited ressource and assigned
if (assigned > used) { if (assigned > used) {
// Draw assigned as full circle // Draw assigned as full circle
circularCircle(canvas, 38, 0, 270, 4, assiColor); circularCircle(canvas, 38, 0, 270, 4, assiColor);
@@ -35,6 +37,7 @@ $(document).ready(function() {
} }
circularText(canvas, 60, 42, 26, "∞") circularText(canvas, 60, 42, 26, "∞")
} else if (!isNaN(assigned)) { } else if (!isNaN(assigned)) {
// Limited ressources but assigned
available = parseFloat(available); available = parseFloat(available);
assignedP = Math.round(100 / available * assigned); assignedP = Math.round(100 / available * assigned);
@@ -48,6 +51,7 @@ $(document).ready(function() {
circularCircle(canvas, 40, 0, 270, 8, unliColor); circularCircle(canvas, 40, 0, 270, 8, unliColor);
circularText(canvas, 60, 42, 26, "∞") circularText(canvas, 60, 42, 26, "∞")
} else { } else {
// Limited ressources
available = parseFloat(available); available = parseFloat(available);
usedP = 100 / available * used; usedP = 100 / available * used;
if (usedP < 1 && usedP > 0) { if (usedP < 1 && usedP > 0) {
@@ -55,11 +59,23 @@ $(document).ready(function() {
} else { } else {
usedP = Math.round(usedP); usedP = Math.round(usedP);
} }
// Check if customer is over Limit
usedD = 270 * usedP / 100; usedD = 270 * usedP / 100;
if (usedD > 270) { usedD = 270; }
if (usedP > 90) {
circularCircle(canvas, 40, 0, usedD, 8, overColor);
} else {
circularCircle(canvas, 40, 0, usedD, 8, usedColor); circularCircle(canvas, 40, 0, usedD, 8, usedColor);
}
if (usedP > 100) {
circularText(canvas, 60, 42, 22, usedP + "%", overColor);
} else {
circularText(canvas, 60, 42, 22, usedP + "%") circularText(canvas, 60, 42, 22, usedP + "%")
} }
}
}); });
}); });
@@ -74,9 +90,10 @@ function circularCircle(canvas, radius, start, end, stroke, color) {
rotate: -135 rotate: -135
}); });
} }
function circularText(canvas, x, y, size, text) { function circularText(canvas, x, y, size, text, color) {
color = color || "#343a41";
$(canvas).drawText({ $(canvas).drawText({
fillStyle: "#343a41", fillStyle: color,
x: x, y: y, x: x, y: y,
fontSize: size, fontSize: size,
fontFamily: "Lucida Grande, Verdana, sans-serif", fontFamily: "Lucida Grande, Verdana, sans-serif",

View File

@@ -6,6 +6,7 @@ $header
</h2> </h2>
<section class="dboardcanvas"> <section class="dboardcanvas">
<if $userinfo['subdomains'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="subdomains" class="circular" used="{$userinfo['subdomains_used']}" available="{$userinfo['subdomains']}"> <input type="hidden" id="subdomains" class="circular" used="{$userinfo['subdomains_used']}" available="{$userinfo['subdomains']}">
<canvas id="subdomains-canvas" width="120" height="76"></canvas> <canvas id="subdomains-canvas" width="120" height="76"></canvas>
@@ -17,7 +18,9 @@ $header
</if> </if>
</small> </small>
</div> </div>
</if>
<if $userinfo['diskspace'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="diskspace" class="circular" used="{$userinfo['diskspace_used']}" available="{$userinfo['diskspace']}"> <input type="hidden" id="diskspace" class="circular" used="{$userinfo['diskspace_used']}" available="{$userinfo['diskspace']}">
<canvas id="diskspace-canvas" width="120" height="76"></canvas> <canvas id="diskspace-canvas" width="120" height="76"></canvas>
@@ -29,7 +32,9 @@ $header
</if> </if>
</small> </small>
</div> </div>
</if>
<if $userinfo['traffic'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="traffic" class="circular" used="{$userinfo['traffic_used']}" available="{$userinfo['traffic']}"> <input type="hidden" id="traffic" class="circular" used="{$userinfo['traffic_used']}" available="{$userinfo['traffic']}">
<canvas id="traffic-canvas" width="120" height="76"></canvas> <canvas id="traffic-canvas" width="120" height="76"></canvas>
@@ -41,7 +46,9 @@ $header
</if> </if>
</small> </small>
</div> </div>
</if>
<if $userinfo['emails'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="emails" class="circular" used="{$userinfo['emails_used']}" available="{$userinfo['emails']}"> <input type="hidden" id="emails" class="circular" used="{$userinfo['emails_used']}" available="{$userinfo['emails']}">
<canvas id="emails-canvas" width="120" height="76"></canvas> <canvas id="emails-canvas" width="120" height="76"></canvas>
@@ -53,7 +60,9 @@ $header
</if> </if>
</small> </small>
</div> </div>
</if>
<if $userinfo['email_accounts'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="email_accounts" class="circular" used="{$userinfo['email_accounts_used']}" available="{$userinfo['email_accounts']}"> <input type="hidden" id="email_accounts" class="circular" used="{$userinfo['email_accounts_used']}" available="{$userinfo['email_accounts']}">
<canvas id="email_accounts-canvas" width="120" height="76"></canvas> <canvas id="email_accounts-canvas" width="120" height="76"></canvas>
@@ -65,7 +74,9 @@ $header
</if> </if>
</small> </small>
</div> </div>
</if>
<if $userinfo['email_forwarders'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="email_forwarders" class="circular" used="{$userinfo['email_forwarders_used']}" available="{$userinfo['email_forwarders']}"> <input type="hidden" id="email_forwarders" class="circular" used="{$userinfo['email_forwarders_used']}" available="{$userinfo['email_forwarders']}">
<canvas id="email_forwarders-canvas" width="120" height="76"></canvas> <canvas id="email_forwarders-canvas" width="120" height="76"></canvas>
@@ -77,8 +88,9 @@ $header
</if> </if>
</small> </small>
</div> </div>
</if>
<if $settings['system']['mail_quota_enabled'] == 1> <if $settings['system']['mail_quota_enabled'] == 1 && $userinfo['email_quota'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="email_quota" class="circular" used="{$userinfo['email_quota_used']}" available="{$userinfo['email_quota']}"> <input type="hidden" id="email_quota" class="circular" used="{$userinfo['email_quota_used']}" available="{$userinfo['email_quota']}">
<canvas id="email_forwarders-canvas" width="120" height="76"></canvas> <canvas id="email_forwarders-canvas" width="120" height="76"></canvas>
@@ -92,7 +104,7 @@ $header
</div> </div>
</if> </if>
<if $settings['autoresponder']['autoresponder_active'] == 1> <if $settings['autoresponder']['autoresponder_active'] == 1 && $userinfo['email_autoresponder'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="email_autoresponder" class="circular" used="{$userinfo['email_autoresponder_used']}" available="{$userinfo['email_autoresponder']}"> <input type="hidden" id="email_autoresponder" class="circular" used="{$userinfo['email_autoresponder_used']}" available="{$userinfo['email_autoresponder']}">
<canvas id="email_autoresponder-canvas" width="120" height="76"></canvas> <canvas id="email_autoresponder-canvas" width="120" height="76"></canvas>
@@ -106,6 +118,7 @@ $header
</div> </div>
</if> </if>
<if $userinfo['mysqls'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="mysqls" class="circular" used="{$userinfo['mysqls_used']}" available="{$userinfo['mysqls']}"> <input type="hidden" id="mysqls" class="circular" used="{$userinfo['mysqls_used']}" available="{$userinfo['mysqls']}">
<canvas id="mysqls-canvas" width="120" height="76"></canvas> <canvas id="mysqls-canvas" width="120" height="76"></canvas>
@@ -117,7 +130,9 @@ $header
</if> </if>
</small> </small>
</div> </div>
</if>
<if $userinfo['ftps'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="ftps" class="circular" used="{$userinfo['ftps_used']}" available="{$userinfo['ftps']}"> <input type="hidden" id="ftps" class="circular" used="{$userinfo['ftps_used']}" available="{$userinfo['ftps']}">
<canvas id="ftps-canvas" width="120" height="76"></canvas> <canvas id="ftps-canvas" width="120" height="76"></canvas>
@@ -129,8 +144,9 @@ $header
</if> </if>
</small> </small>
</div> </div>
</if>
<if (int)$settings['aps']['aps_active'] == 1> <if (int)$settings['aps']['aps_active'] == 1 && $userinfo['aps_packages'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="aps_packages" class="circular" used="{$userinfo['aps_packages_used']}" available="{$userinfo['aps_packages']}"> <input type="hidden" id="aps_packages" class="circular" used="{$userinfo['aps_packages_used']}" available="{$userinfo['aps_packages']}">
<canvas id="aps_packages-canvas" width="120" height="76"></canvas> <canvas id="aps_packages-canvas" width="120" height="76"></canvas>
@@ -144,7 +160,7 @@ $header
</div> </div>
</if> </if>
<if (int)$settings['ticket']['enabled'] == 1> <if (int)$settings['ticket']['enabled'] == 1 && $userinfo['tickets'] != '0'>
<div class="canvasbox"> <div class="canvasbox">
<input type="hidden" id="tickets" class="circular" used="{$userinfo['tickets_used']}" available="{$userinfo['tickets']}"> <input type="hidden" id="tickets" class="circular" used="{$userinfo['tickets_used']}" available="{$userinfo['tickets']}">
<canvas id="tickets-canvas" width="120" height="76"></canvas> <canvas id="tickets-canvas" width="120" height="76"></canvas>