From d15242ced772d0d8498c5ba8f5c8647c49e6ec48 Mon Sep 17 00:00:00 2001 From: BNoiZe Date: Thu, 24 Oct 2013 17:10:00 +0200 Subject: [PATCH 1/5] Fixed footer cell --- templates/Sparkle/admin/settings/settings.tpl | 12 +++++++----- .../Sparkle/admin/settings/settings_group.tpl | 19 ++++++++++--------- 2 files changed, 17 insertions(+), 14 deletions(-) diff --git a/templates/Sparkle/admin/settings/settings.tpl b/templates/Sparkle/admin/settings/settings.tpl index dfb5fcd6..db9df1f4 100644 --- a/templates/Sparkle/admin/settings/settings.tpl +++ b/templates/Sparkle/admin/settings/settings.tpl @@ -10,11 +10,13 @@
$fields - - - + + + + +
- -
+ +
diff --git a/templates/Sparkle/admin/settings/settings_group.tpl b/templates/Sparkle/admin/settings/settings_group.tpl index 035ca9e3..c563bf4c 100644 --- a/templates/Sparkle/admin/settings/settings_group.tpl +++ b/templates/Sparkle/admin/settings/settings_group.tpl @@ -1,9 +1,10 @@ - - - {$groupdetails['title']} - - - - - - + + + + {$groupdetails['title']} + + + + + + \ No newline at end of file From 3e73f6ccb4bb4bd542a664c78dea2198b9213e84 Mon Sep 17 00:00:00 2001 From: BNoiZe Date: Thu, 24 Oct 2013 22:07:01 +0200 Subject: [PATCH 2/5] First version of the new Dashboard --- lng/english.lng.php | 18 +- lng/german.lng.php | 8 +- templates/Sparkle/admin/index/index.tpl | 260 ++++++++++++++++----- templates/Sparkle/assets/css/main.css | 61 ++++- templates/Sparkle/assets/js/circular.js | 85 +++++++ templates/Sparkle/assets/js/jcanvas.min.js | 5 + templates/Sparkle/customer/index/index.tpl | 230 ++++++++++++------ templates/Sparkle/header.tpl | 4 +- 8 files changed, 522 insertions(+), 149 deletions(-) create mode 100644 templates/Sparkle/assets/js/circular.js create mode 100644 templates/Sparkle/assets/js/jcanvas.min.js diff --git a/lng/english.lng.php b/lng/english.lng.php index dfe87261..52d6d94e 100644 --- a/lng/english.lng.php +++ b/lng/english.lng.php @@ -59,17 +59,17 @@ $lng['customer']['zipcode'] = 'Zipcode'; $lng['customer']['city'] = 'City'; $lng['customer']['phone'] = 'Phone'; $lng['customer']['fax'] = 'Fax'; -$lng['customer']['email'] = 'Email'; +$lng['customer']['email'] = 'email'; $lng['customer']['customernumber'] = 'Customer ID'; $lng['customer']['diskspace'] = 'Webspace (MB)'; $lng['customer']['traffic'] = 'Traffic (GB)'; $lng['customer']['mysqls'] = 'MySQL-databases'; -$lng['customer']['emails'] = 'E-mail-Addresses'; -$lng['customer']['accounts'] = 'E-mail-Accounts'; -$lng['customer']['forwarders'] = 'E-mail-Forwarders'; +$lng['customer']['emails'] = 'email-Addresses'; +$lng['customer']['accounts'] = 'email-Accounts'; +$lng['customer']['forwarders'] = 'email-Forwarders'; $lng['customer']['ftps'] = 'FTP-Accounts'; -$lng['customer']['subdomains'] = 'Sub-Domain'; -$lng['customer']['domains'] = 'Domain'; +$lng['customer']['subdomains'] = 'Subdomains'; +$lng['customer']['domains'] = 'Domains'; $lng['customer']['unlimited'] = '∞'; /** @@ -1969,3 +1969,9 @@ $lng['domains']['serveraliasoption_none'] = 'No alias'; $lng['error']['givendirnotallowed'] = 'The given directory in field %s is not allowed.'; $lng['serversettings']['ssl']['ssl_cipher_list']['title'] = 'Configure the allowed SSL ciphers'; $lng['serversettings']['ssl']['ssl_cipher_list']['description'] = 'This is a list of ciphers that you want (or don\'t want) to use when talking SSL. For a list of ciphers and how to include/exclude them, see sections "CIPHER LIST FORMAT" and "CIPHER STRINGS" on the man-page for ciphers.

Default value is:
ECDHE-RSA-AES128-SHA256:AES128-GCM-SHA256:RC4:HIGH:!MD5:!aNULL:!EDH
'; + +// Added in Froxlor 0.9.31 +$lng['panel']['dashboard'] = "Dashboard"; +$lng['panel']['used'] = "used"; +$lng['panel']['assigned'] = "assigned"; +$lng['panel']['available'] = "available"; \ No newline at end of file diff --git a/lng/german.lng.php b/lng/german.lng.php index d2b8059e..1b2b460b 100644 --- a/lng/german.lng.php +++ b/lng/german.lng.php @@ -68,7 +68,7 @@ $lng['customer']['emails'] = 'E-Mail-Adressen'; $lng['customer']['accounts'] = 'E-Mail-Konten'; $lng['customer']['forwarders'] = 'E-Mail-Weiterleitungen'; $lng['customer']['ftps'] = 'FTP-Konten'; -$lng['customer']['subdomains'] = 'Sub-Domain(s)'; +$lng['customer']['subdomains'] = 'Subdomain(s)'; $lng['customer']['domains'] = 'Domain(s)'; $lng['customer']['unlimited'] = '∞'; @@ -1689,3 +1689,9 @@ $lng['domains']['serveraliasoption_none'] = 'Kein alias'; $lng['error']['givendirnotallowed'] = 'Das angegebene Verzeichnis im Feld %s ist nicht erlaubt.'; $lng['serversettings']['ssl']['ssl_cipher_list']['title'] = 'Erlaubte SSL Ciphers festlegen'; $lng['serversettings']['ssl']['ssl_cipher_list']['description'] = 'Dies ist eine Liste von Ciphers die genutzt werden sollen (oder auch nicht genutzt werden sollen) wenn eine SSL Verbindung besteht. Eine Liste aller Ciphers und wie diese hinzugefügt/ausgeschlossen werden ist in den Abschnitten "CIPHER LIST FORMAT" und "CIPHER STRINGS" in der man-page für Ciphers zu finden.

Standard-Wert ist:
ECDHE-RSA-AES128-SHA256:AES128-GCM-SHA256:RC4:HIGH:!MD5:!aNULL:!EDH
'; + +// Added in Froxlor 0.9.31 +$lng['panel']['dashboard'] = "Dashboard"; +$lng['panel']['used'] = "genutzt"; +$lng['panel']['assigned'] = "zugewiesen"; +$lng['panel']['available'] = "verfügbar"; \ No newline at end of file diff --git a/templates/Sparkle/admin/index/index.tpl b/templates/Sparkle/admin/index/index.tpl index c80b0dbd..cbcabbb9 100644 --- a/templates/Sparkle/admin/index/index.tpl +++ b/templates/Sparkle/admin/index/index.tpl @@ -1,75 +1,205 @@ $header
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +

+ + {$lng['panel']['dashboard']} +

+
+
+ + + {$lng['admin']['customers']}
+ + {$overview['number_customers']} {$lng['panel']['used']}
+ {$userinfo['customers_used']} {$lng['panel']['assigned']}
+ + {$userinfo['customers']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['domains']}
+ + {$overview['number_domains']} {$lng['panel']['used']}
+ {$userinfo['domains_used']} {$lng['panel']['assigned']}
+ + {$userinfo['domains']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['subdomains']}
+ + {$overview['subdomains_used']} {$lng['panel']['used']}
+ {$userinfo['subdomains_used']} {$lng['panel']['assigned']}
+ + {$userinfo['subdomains']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['diskspace']}
+ + {$overview['diskspace_used']} {$lng['panel']['used']}
+ {$userinfo['diskspace_used']} {$lng['panel']['assigned']}
+ + {$userinfo['diskspace']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['traffic']}
+ + {$overview['traffic_used']} {$lng['panel']['used']}
+ {$userinfo['traffic_used']} {$lng['panel']['assigned']}
+ + {$userinfo['traffic']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['mysqls']}
+ + {$overview['mysqls_used']} {$lng['panel']['used']}
+ {$userinfo['mysqls_used']} {$lng['panel']['assigned']}
+ + {$userinfo['mysqls']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['emails']}
+ + {$overview['emails_used']} {$lng['panel']['used']}
+ {$userinfo['emails_used']} {$lng['panel']['assigned']}
+ + {$userinfo['emails']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['accounts']}
+ + {$overview['email_accounts_used']} {$lng['panel']['used']}
+ {$userinfo['email_accounts_used']} {$lng['panel']['assigned']}
+ + {$userinfo['email_accounts']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['forwarders']}
+ + {$overview['email_forwarders_used']} {$lng['panel']['used']}
+ {$userinfo['email_forwarders_used']} {$lng['panel']['assigned']}
+ + {$userinfo['email_forwarders']} {$lng['panel']['available']} + + +
+ -
- - - +
+ + + {$lng['customer']['email_quota']}
+ + {$overview['email_quota_used']} {$lng['panel']['used']}
+ {$userinfo['email_quota_used']} {$lng['panel']['assigned']}
+ + {$userinfo['email_quota']} {$lng['panel']['available']} + + +
+ - - - - +
+ + + {$lng['customer']['autoresponder']}
+ + {$overview['email_autoresponder_used']} {$lng['panel']['used']}
+ {$userinfo['email_autoresponder_used']} {$lng['panel']['assigned']}
+ + {$userinfo['email_autoresponder']} {$lng['panel']['available']} + + +
+ - - - - +
+ + + {$lng['aps']['numberofapspackages']}
+ + {$overview['aps_packages_used']} {$lng['panel']['used']}
+ {$userinfo['aps_packages_used']} {$lng['panel']['assigned']}
+ + {$userinfo['aps_packages']} {$lng['panel']['available']} + + +
- - - - + +
+ + + {$lng['customer']['ftps']}
+ + {$overview['ftps_used']} {$lng['panel']['used']}
+ {$userinfo['ftps_used']} {$lng['panel']['assigned']}
+ + {$userinfo['ftps']} {$lng['panel']['available']} + + +
+ - - - - +
+ + + {$lng['customer']['tickets']}
+ + {$overview['tickets_used']} {$lng['panel']['used']}
+ {$userinfo['tickets_used']} {$lng['panel']['assigned']}
+ + {$userinfo['tickets']} {$lng['panel']['available']} + + +
+ + +
+

System Information

+
+
{$lng['admin']['ressourcedetails']}
{$lng['admin']['customers']} {$lng['admin']['usedmax']}{$overview['number_customers']} ({$userinfo['customers']})
{$lng['customer']['domains']} {$lng['admin']['usedmax']}{$overview['number_domains']} ({$userinfo['domains']})
{$lng['customer']['subdomains']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['subdomains_used']} ({$userinfo['subdomains_used']}/{$userinfo['subdomains']})
{$lng['customer']['diskspace']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['diskspace_used']} ({$userinfo['diskspace_used']}/{$userinfo['diskspace']})
{$lng['customer']['traffic']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['traffic_used']} ({$userinfo['traffic_used']}/{$userinfo['traffic']})
{$lng['customer']['mysqls']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['mysqls_used']} ({$userinfo['mysqls_used']}/{$userinfo['mysqls']})
{$lng['customer']['emails']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['emails_used']} ({$userinfo['emails_used']}/{$userinfo['emails']})
{$lng['customer']['accounts']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['email_accounts_used']} ({$userinfo['email_accounts_used']}/{$userinfo['email_accounts']})
{$lng['customer']['forwarders']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['email_forwarders_used']} ({$userinfo['email_forwarders_used']}/{$userinfo['email_forwarders']})
{$lng['customer']['email_quota']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['email_quota_used']} ({$userinfo['email_quota_used']}/{$userinfo['email_quota']})
{$lng['customer']['autoresponder']} {$lng['admin']['usedmax']}{$userinfo['email_autoresponder_used']} ({$userinfo['email_autoresponder']})
{$lng['aps']['numberofapspackages']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['aps_packages_used']} ({$userinfo['aps_packages_used']}/{$userinfo['aps_packages']})
{$lng['customer']['ftps']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['ftps_used']} ({$userinfo['ftps_used']}/{$userinfo['ftps']})
{$lng['customer']['tickets']} {$lng['admin']['used']} ({$lng['admin']['assignedmax']}){$overview['tickets_used']} ({$userinfo['tickets_used']}/{$userinfo['tickets']})
@@ -113,6 +243,10 @@ $header +
{$lng['admin']['systemdetails']}
$uptime
+
+
+ @@ -142,7 +276,7 @@ $header
{$lng['admin']['froxlordetails']}
-
+
$footer diff --git a/templates/Sparkle/assets/css/main.css b/templates/Sparkle/assets/css/main.css index 31914c64..714575d8 100644 --- a/templates/Sparkle/assets/css/main.css +++ b/templates/Sparkle/assets/css/main.css @@ -11,7 +11,7 @@ article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { /* TYPE */ html,body { - font:12px/18px Helvetica,Arial,Verdana,sans-serif; + font:12px/18px 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif; background-color:#f2f2f2; color:#333; -webkit-font-smoothing: antialiased; @@ -23,7 +23,7 @@ body { } .dark { - background-color: #e9edf0; + background: #f0f2f4; border-bottom:1px solid #d1d5d8; } @@ -45,11 +45,15 @@ h2, h3 { } h2 { - font-size:17px; + font-size:24px; + font-weight: normal; } h3 { - font-size: 15px; + font-size: 16px; +} +h4 { + font-size: 1em; } @@ -68,24 +72,27 @@ td a { } .topheader { - background: #fafafa; - background: rgba(250,250,250,0.9); + background: #f0f2f4; + background: rgba(240, 242, 244, 0.85098); top: 0px; width: 100%; padding: 2px 0 0 5px; - box-shadow: 0 1px 8px rgba(0, 0, 0, 0.35); + box-shadow: 0 1px 8px rgba(0, 0, 0, 0.10); position:fixed; z-index: 100; + border-bottom-color: rgb(221, 221, 221); + border-bottom-style: solid; + border-bottom-width: 1px; } .topheader_navigation { float: right; - margin: 14px 50px 0 0; + margin: 17px 50px 0 0; } /* TOPHEADER NAV */ ul.topheadernav { list-style-type: none; - font-size: 13px; + font-size: 12px; } ul.topheadernav li { padding: 0px; @@ -132,7 +139,7 @@ nav div:first-child { .topheadernav img { padding: 0px; - margin: 0px; + margin: -4px 0 0 0; } .countbubble { display: block; @@ -145,7 +152,7 @@ nav div:first-child { line-height: 9px; border-radius: 3px; right: -6px; - bottom: -3px; + bottom: -1px; } /* FOOTER */ @@ -653,6 +660,10 @@ textarea { border-radius: 3px; } +input[type="text"], input[type="password"] { + width: 400px; +} + input[type="password"] { background:#fff url(../img/icons/password.png) no-repeat 5px 4px; } @@ -751,6 +762,17 @@ select[multiple="multiple"] { border: 1px solid #d1d5d8; } +.dboardcanvas { + float:left; + width: 48%; + margin-top:15px; + margin-right:0; + margin-bottom:15px; + margin-left:15px; + padding:0; + box-shadow: 0px 0px 0px black; +} + .dboarditemfull { position:relative; overflow:hidden; @@ -884,3 +906,20 @@ label.nobr { text-indent:-9999px; background: url(../img/top.png) no-repeat; } + +/* CANVAS STUFF */ +.canvasitems { + margin: 0 auto; + text-align: center; +} +.canvasbox { + width: 130px !important; + margin: 10px; + text-align: center; + float: left; + height: 150px; + line-height: normal; +} +canvas { + width: 120px; +} diff --git a/templates/Sparkle/assets/js/circular.js b/templates/Sparkle/assets/js/circular.js new file mode 100644 index 00000000..a971c25e --- /dev/null +++ b/templates/Sparkle/assets/js/circular.js @@ -0,0 +1,85 @@ +$(document).ready(function() { + var usedColor = "#91c46b"; + var assiColor = "#287e7e"; + var unliColor = "#56606e"; + + $(".circular").each(function(index, element) { + var canvas = "#" + $(element).attr("id") + "-canvas"; + var used = parseFloat($(element).attr("used")); + var available = $(element).attr("available"); + var assigned = parseFloat($(element).attr("assigned")); + var usedD, usedP, assignedP, assignedD; + + // Draw basic circle + circularCircle(canvas, 40, 0, 270, 8, "#d2d4d8"); + + // Draw percentages + if (!isNaN(assigned) && available == "∞") { + if (assigned > used) { + // Draw assigned as full circle + circularCircle(canvas, 38, 0, 270, 4, assiColor); + // Draw used as percentage of full circle + usedP = Math.round(100 / assigned * used); + usedD = 270 * usedP / 100; + circularCircle(canvas, 42, 0, usedD, 4, usedColor); + } else if (used > assigned) { + // Draw used as full circle + circularCircle(canvas, 42, 0, 270, 4, usedColor); + // Draw assigned as percentage of full circle + assignedP = Math.round(100 / used * assigned); + assignedD = 270 * assignedP / 100; + circularCircle(canvas, 38, 0, assignedD, 4, assiColor); + } else { + circularCircle(canvas, 42, 0, 270, 4, usedColor); + circularCircle(canvas, 38, 0, 270, 4, assiColor); + } + circularText(canvas, 60, 42, 26, "∞") + } else if (!isNaN(assigned)) { + available = parseFloat(available); + + assignedP = Math.round(100 / available * assigned); + assignedD = 270 * assignedP / 100; + circularCircle(canvas, 38, 0, assignedD, 4, assiColor); + + usedP = Math.round(100 / available * used); + usedD = 270 * usedP / 100; + circularCircle(canvas, 42, 0, usedD, 4, usedColor); + } else if (available == "∞") { + circularCircle(canvas, 40, 0, 270, 8, unliColor); + circularText(canvas, 60, 42, 26, "∞") + } else { + available = parseFloat(available); + usedP = 100 / available * used; + if (usedP < 1 && usedP > 0) { + usedP = 1; + } else { + usedP = Math.round(usedP); + } + usedD = 270 * usedP / 100; + circularCircle(canvas, 40, 0, usedD, 8, usedColor); + circularText(canvas, 60, 42, 22, usedP + "%") + } + + }); + +}); + +function circularCircle(canvas, radius, start, end, stroke, color) { + $(canvas).drawArc({ + strokeStyle: color, + strokeWidth: stroke, + x: 60, y: 44, + radius: radius, + start: start, end: end, + rotate: -135 + }); +} +function circularText(canvas, x, y, size, text) { + $(canvas).drawText({ + fillStyle: "#343a41", + x: x, y: y, + fontSize: size, + fontFamily: "Lucida Grande, Verdana, sans-serif", + text: text + }); +} \ No newline at end of file diff --git a/templates/Sparkle/assets/js/jcanvas.min.js b/templates/Sparkle/assets/js/jcanvas.min.js new file mode 100644 index 00000000..dc58b0d3 --- /dev/null +++ b/templates/Sparkle/assets/js/jcanvas.min.js @@ -0,0 +1,5 @@ +/** + * jCanvas v13.09.16 + * Copyright 2013 Caleb Evans + * Released under the MIT license + */(function(e,t,n,r,i,s,o,u,a){function L(e){var t=this;l(t,e);return t}function A(e){e?l(L.prototype,e):A.prefs=L.prototype=l({},f);return this}function O(e){return h(e)==="string"}function M(e){return e&&e.getContext?e.getContext("2d"):u}function _(e){e=l({},e);e.masks=e.masks.slice(0);return e}function D(e,t){var n;e.save();n=_(t.transforms);t.savedTransforms.push(n)}function P(e,t){if(t.savedTransforms.length===0)t.transforms=_(N);else{e.restore();t.transforms=t.savedTransforms.pop()}}function H(e,t,n){p(n.fillStyle)?t.fillStyle=n.fillStyle.call(e,n):t.fillStyle=n.fillStyle;p(n.strokeStyle)?t.strokeStyle=n.strokeStyle.call(e,n):t.strokeStyle=n.strokeStyle;t.lineWidth=n.strokeWidth;if(n.rounded)t.lineCap=t.lineJoin="round";else{t.lineCap=n.strokeCap;t.lineJoin=n.strokeJoin;t.miterLimit=n.miterLimit}t.shadowOffsetX=n.shadowX;t.shadowOffsetY=n.shadowY;t.shadowBlur=n.shadowBlur;t.shadowColor=n.shadowColor;t.globalAlpha=n.opacity;t.globalCompositeOperation=n.compositing;n.imageSmoothing&&(t.webkitImageSmoothingEnabled=t.mozImageSmoothingEnabled=n.imageSmoothing)}function B(e,t,n){if(n.mask){n.autosave&&D(e,t);e.clip();t.transforms.masks.push(n._args)}}function j(e,t){t._transformed&&e.restore()}function F(e,t,n){var r;n.closed&&t.closePath();if(n.shadowStroke&&n.strokeWidth!==0){t.stroke();t.fill();t.shadowColor="transparent";t.shadowBlur=0;t.stroke()}else{t.fill();n.fillStyle!=="transparent"&&(t.shadowColor="transparent");n.strokeWidth!==0&&t.stroke()}n.closed||t.closePath();j(t,n);if(n.mask){r=z(e);B(t,r,n)}}function I(e,t,n){t._toRad=t.inDegrees?v/180:1;e.translate(t.x,t.y);e.rotate(t.rotate*t._toRad);e.translate(-t.x,-t.y);n&&(n.rotate+=t.rotate*t._toRad)}function q(e,t,n){t.scale!==1&&(t.scaleX=t.scaleY=t.scale);e.translate(t.x,t.y);e.scale(t.scaleX,t.scaleY);e.translate(-t.x,-t.y);if(n){n.scaleX*=t.scaleX;n.scaleY*=t.scaleY}}function R(e,t,n){t.translate&&(t.translateX=t.translateY=t.translate);e.translate(t.translateX,t.translateY);if(n){n.translateX+=t.translateX;n.translateY+=t.translateY}}function U(e,t,n,r,i){n._toRad=n.inDegrees?v/180:1;n._transformed=s;t.save();i===a&&(i=r);if(!n.fromCenter&&!n._centered){n.x+=r/2;n.y+=i/2;n._centered=s}n.rotate&&I(t,n,{});(n.scale!==1||n.scaleX!==1||n.scaleY!==1)&&q(t,n,{});(n.translate||n.translateX||n.translateY)&&R(t,n,{})}function z(t){var n;if(S._canvas===t&&S._data)n=S._data;else{n=e.data(t,"jCanvas");if(!n){n={canvas:t,layers:[],layer:{names:{},groups:{}},intersecting:[],lastIntersected:u,cursor:e(t).css("cursor"),drag:{},event:{type:u,x:u,y:u},events:{},transforms:_(N),savedTransforms:[],animating:o,animated:u,pos:0,pixelRatio:1,scaled:!1};e.data(t,"jCanvas",n)}S._canvas=t;S._data=n}return n}function W(e,t,n){var r;for(r in A.events)A.events.hasOwnProperty(r)&&(n[r]||n.cursors&&n.cursors[r])&&X(e,t,n,r)}function X(e,t,n,r){r=ot(r);A.events[r](e,t);n._event=s}function V(e,t,n){var r,i,o;if(n.draggable||n.cursor||n.cursors){r=["mousedown","mousemove","mouseup"];for(o=0;o=0;n-=1){t=e.intersecting[n];if(t._masks){for(r=t._masks.length-1;r>=0;r-=1)if(!t._masks[r].intersects){t.intersects=o;break}if(t.intersects)break}}return t}function Q(e,t,n,r){if(n&&n.visible&&n._method){r?n._next=r:n._next=u;n._method.call(e,n)}}function G(e,t,n){var r,i,u,a,f,l,h,p;a=t.drag;i=a.layer;f=i.dragGroups||[];r=t.layers;if(n==="mousemove"||n==="touchmove"){if(!a.dragging){a.dragging=s;if(i.bringToFront){r.splice(i.index,1);i.index=r.push(i)}for(p=0;pr.width&&(r.width=u)}o=t.style.fontSize;t.style.fontSize=r.fontSize;r.height=i(e.css(t,"fontSize"))*s.length*r.lineHeight;t.style.fontSize=o}}function pt(e,t){var n=t.text,r=t.maxWidth,i=n.split("\n"),s=[],o,u,a,f,l,c;for(a=0;ar){u!==""&&o.push(u);u=""}u+=l[c];c!==l.length-1&&(u+=" ")}o.push(u)}s=s.concat(o.join("\n").replace(/( (\n))|( $)/gi,"$2").split("\n"))}return s}var f,l=e.extend,c=e.inArray,h=e.type,p=e.isFunction,d=r.round,v=r.PI,m=r.sin,g=r.cos,y=e.event.fix,b,w,E,S={},x={},T={},N={rotate:0,scaleX:1,scaleY:1,translateX:0,translateY:0,masks:[]},C,k;e.fn.jCanvas=A;A.events={};f={align:"center",autosave:s,baseline:"middle",bringToFront:o,ccw:o,closed:o,compositing:"source-over",concavity:0,cornerRadius:0,count:1,cropFromCenter:s,cursor:u,cursors:u,disableEvents:o,draggable:o,dragGroups:u,group:u,groups:u,data:{},each:u,end:360,fillStyle:"transparent",fontStyle:"normal",fontSize:"12pt",fontFamily:"sans-serif",fromCenter:s,fn:u,height:u,imageSmoothing:s,inDegrees:s,index:u,lineHeight:1,layer:o,load:u,mask:o,maxWidth:u,miterLimit:10,name:u,opacity:1,r1:u,r2:u,radius:0,repeat:"repeat",respectAlign:o,rotate:0,rounded:o,scale:1,scaleX:1,scaleY:1,shadowBlur:0,shadowColor:"transparent",shadowStroke:!1,shadowX:0,shadowY:0,sHeight:u,sides:0,source:"",spread:0,start:0,strokeCap:"butt",strokeJoin:"miter",strokeStyle:"transparent",strokeWidth:1,sWidth:u,sx:u,sy:u,text:"",translate:0,translateX:0,translateY:0,type:u,visible:s,width:u,x:0,y:0};A();A.extend=function(n){A.defaults=l(f,n.props);A();n.name&&(e.fn[n.name]=function r(e){var t=this,i,s,o,u,a;for(s=0;sd.height&&(i.sy=d.height-i.sHeight/2);i.sx-i.sWidth/2<0&&(i.sx=i.sWidth/2);i.sx+i.sWidth/2>d.width&&(i.sx=d.width-i.sWidth/2);U(r[e],t,i,i.width,i.height);t.drawImage(d,i.sx-i.sWidth/2,i.sy-i.sHeight/2,i.sWidth,i.sHeight,i.x-i.width/2,i.y-i.height/2,i.width,i.height)}else{U(r[e],t,i,i.width,i.height);t.drawImage(d,i.x-i.width/2,i.y-i.height/2,i.width,i.height)}H(r[e],t,i);t.beginPath();t.rect(i.x-i.width/2,i.y-i.height/2,i.width,i.height);i._event&<(r[e],t,i);t.closePath();t.stroke();j(t,i);B(t,n,i)}function y(t,n,r,i,u,a){return function(){g(n,r,i,u,a);u.load&&u.load.call(t,a);if(u.layer){u._args._masks=i.transforms.masks.slice(0);u._next&&e(t).drawLayers({clear:o,resetFire:s,index:u._next})}}}var r=this,i,f,l,c,h,p,d,v,m;for(f=0;f")[0];a.width=o.width;a.height=o.height;f=M(a);c.call(a,f);h()}else{f=c.getContext;if(c.src||f)a=c;else{a=new n;a.src=c}if(a.complete||f)h();else{e(a).bind("load",h);a.src=a.src}}}else l=u;return l};e.fn.createGradient=function(t){var n=this,r,i,s,o=[],f,l,c,h,p,d,v;i=new L(t);r=M(n[0]);if(r){i.x1=i.x1||0;i.y1=i.y1||0;i.x2=i.x2||0;i.y2=i.y2||0;i.r1!==u||i.r2!==u?s=r.createRadialGradient(i.x1,i.y1,i.r1,i.x2,i.y2,i.r2):s=r.createLinearGradient(i.x1,i.y1,i.x2,i.y2);for(h=1;i["c"+h]!==a;h+=1)i["s"+h]!==a?o.push(i["s"+h]):o.push(u);f=o.length;o[0]===u&&(o[0]=0);o[f-1]===u&&(o[f-1]=1);for(h=0;hc&&(o[p]=o[h])}else if(o[h]===u){v+=1;o[h]=l+v*((c-l)/d)}s.addColorStop(o[h],i["c"+(h+1)])}}else s=u;return s};e.fn.setPixels=function _t(e){var t=this,n,r,i,s,o,a,f,l,c,h;for(r=0;r")[0].getContext;A.defaults=f;A.transformShape=U;A.detectEvents=lt;A.closePath=F;A.getTouchEventName=ot;e.jCanvas=A})(jQuery,document,Image,Math,parseFloat,!0,!1,null); \ No newline at end of file diff --git a/templates/Sparkle/customer/index/index.tpl b/templates/Sparkle/customer/index/index.tpl index 058f06c3..6b364f47 100644 --- a/templates/Sparkle/customer/index/index.tpl +++ b/templates/Sparkle/customer/index/index.tpl @@ -1,11 +1,169 @@ $header
+

+ + {$lng['panel']['dashboard']} +

+ +
+
+ + + {$lng['customer']['subdomains']}
+ + {$userinfo['subdomains_used']} {$lng['panel']['used']}
+ + {$userinfo['subdomains']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['diskspace']}
+ + {$userinfo['diskspace_used']} {$lng['panel']['used']}
+ + {$userinfo['diskspace']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['traffic']}
+ + {$userinfo['traffic_used']} {$lng['panel']['used']}
+ + {$userinfo['traffic']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['emails']}
+ + {$userinfo['emails_used']} {$lng['panel']['used']}
+ + {$userinfo['emails']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['accounts']}
+ + {$userinfo['email_accounts_used']} {$lng['panel']['used']}
+ + {$userinfo['email_accounts']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['forwarders']}
+ + {$userinfo['email_forwarders_used']} {$lng['panel']['used']}
+ + {$userinfo['email_forwarders']} {$lng['panel']['available']} + + +
+ + +
+ + + {$lng['customer']['email_quota']}
+ + {$userinfo['email_quota_used']} {$lng['panel']['used']}
+ + {$userinfo['email_quota']} {$lng['panel']['available']} + + +
+ + + +
+ + + {$lng['customer']['autoresponder']}
+ + {$userinfo['email_autoresponder_used']} {$lng['panel']['used']}
+ + {$userinfo['email_autoresponder']} {$lng['panel']['available']} + + +
+ -
- - +
+ + + {$lng['customer']['mysqls']}
+ + {$userinfo['mysqls_used']} {$lng['panel']['used']}
+ + {$userinfo['mysqls']} {$lng['panel']['available']} + + +
+ +
+ + + {$lng['customer']['ftps']}
+ + {$userinfo['ftps_used']} {$lng['panel']['used']}
+ + {$userinfo['ftps']} {$lng['panel']['available']} + + +
+ + +
+ + + {$lng['aps']['numberofapspackages']}
+ + {$userinfo['aps_packages_used']} {$lng['panel']['used']}
+ + {$userinfo['aps_packages']} {$lng['panel']['available']} + + +
+ + + +
+ + + {$lng['customer']['tickets']}
+ + {$userinfo['tickets_used']} {$lng['panel']['used']}
+ + {$userinfo['tickets']} {$lng['panel']['available']} + + +
+ + + +
+
+ - + @@ -15,70 +173,8 @@ $header - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
{$lng['index']['accountdetails']}
{$lng['login']['username']} {$userinfo['loginname']}$domains
{$lng['customer']['subdomains']}
{$lng['customer']['usedmax']}		{$userinfo['subdomains_used']}/{$userinfo['subdomains']}
{$lng['customer']['diskspace']}
{$lng['customer']['usedmax']}		{$userinfo['diskspace_used']}/{$userinfo['diskspace']}
{$lng['customer']['traffic']}
$month, {$lng['customer']['usedmax']}		{$userinfo['traffic_used']}/{$userinfo['traffic']}
{$lng['customer']['emails']}
{$lng['customer']['usedmax']}		{$userinfo['emails_used']}/{$userinfo['emails']}
{$lng['customer']['accounts']}
{$lng['customer']['usedmax']}		{$userinfo['email_accounts_used']}/{$userinfo['email_accounts']}
{$lng['customer']['forwarders']}
{$lng['customer']['usedmax']}		{$userinfo['email_forwarders_used']}/{$userinfo['email_forwarders']}
{$lng['customer']['email_quota']}
{{$lng['panel']['megabyte']}, {$lng['customer']['usedmax']}		{$userinfo['email_quota_used']}/{$userinfo['email_quota']}
{$lng['customer']['autoresponder']}
{$lng['customer']['usedmax']}		{$userinfo['email_autoresponder_used']}/{$userinfo['email_autoresponder']}
{$lng['customer']['mysqls']}
{$lng['customer']['usedmax']}		{$userinfo['mysqls_used']}/{$userinfo['mysqls']}
{$lng['customer']['ftps']}
{$lng['customer']['usedmax']}		{$userinfo['ftps_used']}/{$userinfo['ftps']}
{$lng['aps']['numberofapspackages']}
{$lng['customer']['usedmax']}		{$userinfo['aps_packages_used']}/{$userinfo['aps_packages']}
{$lng['customer']['tickets']}
{$lng['customer']['usedmax']}		{$userinfo['tickets_used']}/{$userinfo['tickets']}
-
- -
- - - + diff --git a/templates/Sparkle/header.tpl b/templates/Sparkle/header.tpl index 4efd0962..c096dc6a 100644 --- a/templates/Sparkle/header.tpl +++ b/templates/Sparkle/header.tpl @@ -19,6 +19,8 @@ + + @@ -57,7 +59,7 @@
  • {$userinfo['loginname']}
    • -
  • {$lng['admin']['overview']}
    • +
  • {$lng['panel']['dashboard']}
  • {$lng['panel']['options']} ▾
    • {$lng['login']['password']}
      • From c233fbfffb9a1f2f4b6ef976f2aac18d30c3679e Mon Sep 17 00:00:00 2001 From: BNoiZe Date: Sun, 27 Oct 2013 10:44:31 +0100 Subject: [PATCH 3/5] Dashboard bugfixes --- .../admin/customers/customers_customer.tpl | 4 +- templates/Sparkle/admin/index/index.tpl | 379 +++++++++--------- templates/Sparkle/assets/css/main.css | 5 +- templates/Sparkle/assets/js/circular.js | 25 +- templates/Sparkle/customer/index/index.tpl | 24 +- 5 files changed, 234 insertions(+), 203 deletions(-) diff --git a/templates/Sparkle/admin/customers/customers_customer.tpl b/templates/Sparkle/admin/customers/customers_customer.tpl index 96326a53..f0400ea8 100644 --- a/templates/Sparkle/admin/customers/customers_customer.tpl +++ b/templates/Sparkle/admin/customers/customers_customer.tpl @@ -36,7 +36,7 @@
      -
      +
      @@ -54,7 +54,7 @@
      -
      +
      diff --git a/templates/Sparkle/admin/index/index.tpl b/templates/Sparkle/admin/index/index.tpl index cbcabbb9..d7b1af86 100644 --- a/templates/Sparkle/admin/index/index.tpl +++ b/templates/Sparkle/admin/index/index.tpl @@ -5,198 +5,197 @@ $header {$lng['panel']['dashboard']}
      -
      - - - {$lng['admin']['customers']}
      - - {$overview['number_customers']} {$lng['panel']['used']}
      - {$userinfo['customers_used']} {$lng['panel']['assigned']}
      - - {$userinfo['customers']} {$lng['panel']['available']} - -       +
      + + + {$lng['admin']['customers']}
      + + {$overview['number_customers']} {$lng['panel']['used']}
      + {$userinfo['customers_used']} {$lng['panel']['assigned']}
      + + {$userinfo['customers']} {$lng['panel']['available']} + +       +
      + +
      + + + {$lng['customer']['domains']}
      + + {$overview['number_domains']} {$lng['panel']['used']}
      + {$userinfo['domains_used']} {$lng['panel']['assigned']}
      + + {$userinfo['domains']} {$lng['panel']['available']} + +       +
      + +
      + + + {$lng['customer']['subdomains']}
      + + {$overview['subdomains_used']} {$lng['panel']['used']}
      + {$userinfo['subdomains_used']} {$lng['panel']['assigned']}
      + + {$userinfo['subdomains']} {$lng['panel']['available']} + +       +
      + +
      + + + {$lng['customer']['diskspace']}
      + + {$overview['diskspace_used']} {$lng['panel']['used']}
      + {$userinfo['diskspace_used']} {$lng['panel']['assigned']}
      + + {$userinfo['diskspace']} {$lng['panel']['available']} + +       +
      + +
      + + + {$lng['customer']['traffic']}
      + + {$overview['traffic_used']} {$lng['panel']['used']}
      + {$userinfo['traffic_used']} {$lng['panel']['assigned']}
      + + {$userinfo['traffic']} {$lng['panel']['available']} + +       +
      + +
      + + + {$lng['customer']['mysqls']}
      + + {$overview['mysqls_used']} {$lng['panel']['used']}
      + {$userinfo['mysqls_used']} {$lng['panel']['assigned']}
      + + {$userinfo['mysqls']} {$lng['panel']['available']} + +       +
      + +
      + + + {$lng['customer']['emails']}
      + + {$overview['emails_used']} {$lng['panel']['used']}
      + {$userinfo['emails_used']} {$lng['panel']['assigned']}
      + + {$userinfo['emails']} {$lng['panel']['available']} + +       +
      + +
      + + + {$lng['customer']['accounts']}
      + + {$overview['email_accounts_used']} {$lng['panel']['used']}
      + {$userinfo['email_accounts_used']} {$lng['panel']['assigned']}
      + + {$userinfo['email_accounts']} {$lng['panel']['available']} + +       +
      + +
      + + + {$lng['customer']['forwarders']}
      + + {$overview['email_forwarders_used']} {$lng['panel']['used']}
      + {$userinfo['email_forwarders_used']} {$lng['panel']['assigned']}
      + + {$userinfo['email_forwarders']} {$lng['panel']['available']} + +       +
      + + +
      + + + {$lng['customer']['email_quota']}
      + + {$overview['email_quota_used']} {$lng['panel']['used']}
      + {$userinfo['email_quota_used']} {$lng['panel']['assigned']}
      + + {$userinfo['email_quota']} {$lng['panel']['available']} + +       +
      +       + + +
      + + + {$lng['customer']['autoresponder']}
      + + {$overview['email_autoresponder_used']} {$lng['panel']['used']}
      + {$userinfo['email_autoresponder_used']} {$lng['panel']['assigned']}
      + + {$userinfo['email_autoresponder']} {$lng['panel']['available']} + +       +
      +       + + +
      + + + {$lng['aps']['numberofapspackages']}
      + + {$overview['aps_packages_used']} {$lng['panel']['used']}
      + {$userinfo['aps_packages_used']} {$lng['panel']['assigned']}
      + + {$userinfo['aps_packages']} {$lng['panel']['available']} + +       +
      +       + +
      + + + {$lng['customer']['ftps']}
      + + {$overview['ftps_used']} {$lng['panel']['used']}
      + {$userinfo['ftps_used']} {$lng['panel']['assigned']}
      + + {$userinfo['ftps']} {$lng['panel']['available']} + +       +
      + + +
      + + + {$lng['customer']['tickets']}
      + + {$overview['tickets_used']} {$lng['panel']['used']}
      + {$userinfo['tickets_used']} {$lng['panel']['assigned']}
      + + {$userinfo['tickets']} {$lng['panel']['available']} + +       +
      +
      -
      - - - {$lng['customer']['domains']}
      - - {$overview['number_domains']} {$lng['panel']['used']}
      - {$userinfo['domains_used']} {$lng['panel']['assigned']}
      - - {$userinfo['domains']} {$lng['panel']['available']} - -       -
      - -
      - - - {$lng['customer']['subdomains']}
      - - {$overview['subdomains_used']} {$lng['panel']['used']}
      - {$userinfo['subdomains_used']} {$lng['panel']['assigned']}
      - - {$userinfo['subdomains']} {$lng['panel']['available']} - -       -
      - -
      - - - {$lng['customer']['diskspace']}
      - - {$overview['diskspace_used']} {$lng['panel']['used']}
      - {$userinfo['diskspace_used']} {$lng['panel']['assigned']}
      - - {$userinfo['diskspace']} {$lng['panel']['available']} - -       -
      - -
      - - - {$lng['customer']['traffic']}
      - - {$overview['traffic_used']} {$lng['panel']['used']}
      - {$userinfo['traffic_used']} {$lng['panel']['assigned']}
      - - {$userinfo['traffic']} {$lng['panel']['available']} - -       -
      - -
      - - - {$lng['customer']['mysqls']}
      - - {$overview['mysqls_used']} {$lng['panel']['used']}
      - {$userinfo['mysqls_used']} {$lng['panel']['assigned']}
      - - {$userinfo['mysqls']} {$lng['panel']['available']} - -       -
      - -
      - - - {$lng['customer']['emails']}
      - - {$overview['emails_used']} {$lng['panel']['used']}
      - {$userinfo['emails_used']} {$lng['panel']['assigned']}
      - - {$userinfo['emails']} {$lng['panel']['available']} - -       -
      - -
      - - - {$lng['customer']['accounts']}
      - - {$overview['email_accounts_used']} {$lng['panel']['used']}
      - {$userinfo['email_accounts_used']} {$lng['panel']['assigned']}
      - - {$userinfo['email_accounts']} {$lng['panel']['available']} - -       -
      - -
      - - - {$lng['customer']['forwarders']}
      - - {$overview['email_forwarders_used']} {$lng['panel']['used']}
      - {$userinfo['email_forwarders_used']} {$lng['panel']['assigned']}
      - - {$userinfo['email_forwarders']} {$lng['panel']['available']} - -       -
      - - -
      - - - {$lng['customer']['email_quota']}
      - - {$overview['email_quota_used']} {$lng['panel']['used']}
      - {$userinfo['email_quota_used']} {$lng['panel']['assigned']}
      - - {$userinfo['email_quota']} {$lng['panel']['available']} - -       -
      -       - - -
      - - - {$lng['customer']['autoresponder']}
      - - {$overview['email_autoresponder_used']} {$lng['panel']['used']}
      - {$userinfo['email_autoresponder_used']} {$lng['panel']['assigned']}
      - - {$userinfo['email_autoresponder']} {$lng['panel']['available']} - -       -
      -       - - -
      - - - {$lng['aps']['numberofapspackages']}
      - - {$overview['aps_packages_used']} {$lng['panel']['used']}
      - {$userinfo['aps_packages_used']} {$lng['panel']['assigned']}
      - - {$userinfo['aps_packages']} {$lng['panel']['available']} - -       -
      -       - -
      - - - {$lng['customer']['ftps']}
      - - {$overview['ftps_used']} {$lng['panel']['used']}
      - {$userinfo['ftps_used']} {$lng['panel']['assigned']}
      - - {$userinfo['ftps']} {$lng['panel']['available']} - -       -
      - - -
      - - - {$lng['customer']['tickets']}
      - - {$overview['tickets_used']} {$lng['panel']['used']}
      - {$userinfo['tickets_used']} {$lng['panel']['assigned']}
      - - {$userinfo['tickets']} {$lng['panel']['available']} - -       -
      -       -
      - -

      System Information

    • {$lng['index']['customerdetails']}
    {$lng['customer']['customernumber']}:
    diff --git a/templates/Sparkle/assets/css/main.css b/templates/Sparkle/assets/css/main.css index 714575d8..d3b7f181 100644 --- a/templates/Sparkle/assets/css/main.css +++ b/templates/Sparkle/assets/css/main.css @@ -806,9 +806,8 @@ select[multiple="multiple"] { .cronjobtask li { background-image: url(../img/icons/clock.png); background-repeat: no-repeat; - background-position: 0px center; - padding-left: 18px; - height: 18px; + background-position: 0px 1px; + padding-left: 18px; } .overviewheading { diff --git a/templates/Sparkle/assets/js/circular.js b/templates/Sparkle/assets/js/circular.js index a971c25e..e5653b98 100644 --- a/templates/Sparkle/assets/js/circular.js +++ b/templates/Sparkle/assets/js/circular.js @@ -2,6 +2,7 @@ $(document).ready(function() { var usedColor = "#91c46b"; var assiColor = "#287e7e"; var unliColor = "#56606e"; + var overColor = "#dd514c"; $(".circular").each(function(index, element) { var canvas = "#" + $(element).attr("id") + "-canvas"; @@ -15,6 +16,7 @@ $(document).ready(function() { // Draw percentages if (!isNaN(assigned) && available == "∞") { + // Unlimited ressource and assigned if (assigned > used) { // Draw assigned as full circle circularCircle(canvas, 38, 0, 270, 4, assiColor); @@ -35,6 +37,7 @@ $(document).ready(function() { } circularText(canvas, 60, 42, 26, "∞") } else if (!isNaN(assigned)) { + // Limited ressources but assigned available = parseFloat(available); assignedP = Math.round(100 / available * assigned); @@ -48,6 +51,7 @@ $(document).ready(function() { circularCircle(canvas, 40, 0, 270, 8, unliColor); circularText(canvas, 60, 42, 26, "∞") } else { + // Limited ressources available = parseFloat(available); usedP = 100 / available * used; if (usedP < 1 && usedP > 0) { @@ -55,9 +59,21 @@ $(document).ready(function() { } else { usedP = Math.round(usedP); } + // Check if customer is over Limit usedD = 270 * usedP / 100; - circularCircle(canvas, 40, 0, usedD, 8, usedColor); - circularText(canvas, 60, 42, 22, usedP + "%") + if (usedD > 270) { usedD = 270; } + if (usedP > 90) { + circularCircle(canvas, 40, 0, usedD, 8, overColor); + } else { + circularCircle(canvas, 40, 0, usedD, 8, usedColor); + } + if (usedP > 100) { + circularText(canvas, 60, 42, 22, usedP + "%", overColor); + } else { + circularText(canvas, 60, 42, 22, usedP + "%") + } + + } }); @@ -74,9 +90,10 @@ function circularCircle(canvas, radius, start, end, stroke, color) { rotate: -135 }); } -function circularText(canvas, x, y, size, text) { +function circularText(canvas, x, y, size, text, color) { + color = color || "#343a41"; $(canvas).drawText({ - fillStyle: "#343a41", + fillStyle: color, x: x, y: y, fontSize: size, fontFamily: "Lucida Grande, Verdana, sans-serif", diff --git a/templates/Sparkle/customer/index/index.tpl b/templates/Sparkle/customer/index/index.tpl index 6b364f47..876201b9 100644 --- a/templates/Sparkle/customer/index/index.tpl +++ b/templates/Sparkle/customer/index/index.tpl @@ -6,6 +6,7 @@ $header
    +
    @@ -17,7 +18,9 @@ $header
    +     +
    @@ -29,7 +32,9 @@ $header
    +     +
    @@ -41,7 +46,9 @@ $header
    +     +
    @@ -53,7 +60,9 @@ $header
    +     +
    @@ -65,7 +74,9 @@ $header
    +     +
    @@ -77,8 +88,9 @@ $header
    +     - +
    @@ -92,7 +104,7 @@ $header
    - +
    @@ -106,6 +118,7 @@ $header
    +
    @@ -117,7 +130,9 @@ $header
    +     +
    @@ -129,8 +144,9 @@ $header
    +     - +
    @@ -144,7 +160,7 @@ $header
    - +
    From fc69afcffc71f35b867302ad842856b04864a069 Mon Sep 17 00:00:00 2001 From: BNoiZe Date: Sun, 27 Oct 2013 11:52:53 +0100 Subject: [PATCH 4/5] Some more bugfixes, soft animation when resizing window No more oh! (Hopefully) --- .../admin/customers/customers_customer.tpl | 4 +- templates/Sparkle/admin/index/index.tpl | 31 +++++++------- templates/Sparkle/assets/css/main.css | 16 ++++++-- templates/Sparkle/assets/js/circular.js | 40 +++++++++++++++++++ templates/Sparkle/customer/index/index.tpl | 26 ++++++------ 5 files changed, 83 insertions(+), 34 deletions(-) diff --git a/templates/Sparkle/admin/customers/customers_customer.tpl b/templates/Sparkle/admin/customers/customers_customer.tpl index f0400ea8..b9070c85 100644 --- a/templates/Sparkle/admin/customers/customers_customer.tpl +++ b/templates/Sparkle/admin/customers/customers_customer.tpl @@ -35,7 +35,7 @@
    -
    +
    ∞
    @@ -53,7 +53,7 @@
    -
    +
    ∞
    diff --git a/templates/Sparkle/admin/index/index.tpl b/templates/Sparkle/admin/index/index.tpl index d7b1af86..9f60ba29 100644 --- a/templates/Sparkle/admin/index/index.tpl +++ b/templates/Sparkle/admin/index/index.tpl @@ -4,10 +4,10 @@ $header {$lng['panel']['dashboard']} -
    +
    - +
    {$lng['admin']['customers']}
    {$overview['number_customers']} {$lng['panel']['used']}
    @@ -20,7 +20,7 @@ $header
    - +
    {$lng['customer']['domains']}
    {$overview['number_domains']} {$lng['panel']['used']}
    @@ -33,7 +33,7 @@ $header
    - +
    {$lng['customer']['subdomains']}
    {$overview['subdomains_used']} {$lng['panel']['used']}
    @@ -46,7 +46,7 @@ $header
    - +
    {$lng['customer']['diskspace']}
    {$overview['diskspace_used']} {$lng['panel']['used']}
    @@ -59,7 +59,7 @@ $header
    - +
    {$lng['customer']['traffic']}
    {$overview['traffic_used']} {$lng['panel']['used']}
    @@ -72,7 +72,7 @@ $header
    - +
    {$lng['customer']['mysqls']}
    {$overview['mysqls_used']} {$lng['panel']['used']}
    @@ -85,7 +85,7 @@ $header
    - +
    {$lng['customer']['emails']}
    {$overview['emails_used']} {$lng['panel']['used']}
    @@ -98,7 +98,7 @@ $header
    - +
    {$lng['customer']['accounts']}
    {$overview['email_accounts_used']} {$lng['panel']['used']}
    @@ -111,7 +111,7 @@ $header
    - +
    {$lng['customer']['forwarders']}
    {$overview['email_forwarders_used']} {$lng['panel']['used']}
    @@ -125,7 +125,7 @@ $header
    - +
    {$lng['customer']['email_quota']}
    {$overview['email_quota_used']} {$lng['panel']['used']}
    @@ -140,7 +140,7 @@ $header
    - +
    {$lng['customer']['autoresponder']}
    {$overview['email_autoresponder_used']} {$lng['panel']['used']}
    @@ -155,7 +155,7 @@ $header
    - +
    {$lng['aps']['numberofapspackages']}
    {$overview['aps_packages_used']} {$lng['panel']['used']}
    @@ -169,7 +169,7 @@ $header
    - +
    {$lng['customer']['ftps']}
    {$overview['ftps_used']} {$lng['panel']['used']}
    @@ -183,7 +183,7 @@ $header
    - +
    {$lng['customer']['tickets']}
    {$overview['tickets_used']} {$lng['panel']['used']}
    @@ -194,6 +194,7 @@ $header
    +

    System Information

    diff --git a/templates/Sparkle/assets/css/main.css b/templates/Sparkle/assets/css/main.css index d3b7f181..c184bd25 100644 --- a/templates/Sparkle/assets/css/main.css +++ b/templates/Sparkle/assets/css/main.css @@ -363,6 +363,9 @@ aside.right { right:36px; font-size:80%; } +.overviewsearch input[type="text"] { + width: 150px; +} .overviewadd { padding:10px; @@ -834,6 +837,7 @@ select[multiple="multiple"] { -webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.1); -moz-box-shadow:inset 0 1px 2px rgba(0,0,0,0.1); box-shadow:inset 0 1px 2px rgba(0,0,0,0.1); + text-align: center; } .progress .bar { width:1px; @@ -908,12 +912,16 @@ label.nobr { /* CANVAS STUFF */ .canvasitems { - margin: 0 auto; - text-align: center; + position:relative; + overflow:hidden; + width:100%; + margin-top:10px; + margin-bottom:10px; + padding: 0 0 0 10px; } .canvasbox { - width: 130px !important; - margin: 10px; + width: 130px; + margin: 10px 20px 10px 0; text-align: center; float: left; height: 150px; diff --git a/templates/Sparkle/assets/js/circular.js b/templates/Sparkle/assets/js/circular.js index e5653b98..f39e87c7 100644 --- a/templates/Sparkle/assets/js/circular.js +++ b/templates/Sparkle/assets/js/circular.js @@ -1,4 +1,44 @@ +(function($,sr){ + var debounce = function (func, threshold, execAsap) { + var timeout; + + return function debounced () { + var obj = this, args = arguments; + function delayed () { + if (!execAsap) + func.apply(obj, args); + timeout = null; + }; + + if (timeout) + clearTimeout(timeout); + else if (execAsap) + func.apply(obj, args); + + timeout = setTimeout(delayed, threshold || 100); + }; + } + // smartresize + jQuery.fn[sr] = function(fn){ return fn ? this.bind('resize', debounce(fn)) : this.trigger(sr); }; + +})(jQuery,'smartresize'); + + +$(window).smartresize(function(){ + resizecanvas(); +}); + +function resizecanvas() { + var divwidth = $('#statsbox').width(); + var space = divwidth % 150; + var elementspl = (divwidth - space) / 150; + var elementwidth = 130 + Math.round(space / elementspl) - 1; + $(".canvasbox").animate({width: elementwidth}, 500); +} + $(document).ready(function() { + resizecanvas(); + var usedColor = "#91c46b"; var assiColor = "#287e7e"; var unliColor = "#56606e"; diff --git a/templates/Sparkle/customer/index/index.tpl b/templates/Sparkle/customer/index/index.tpl index 876201b9..3876c4ae 100644 --- a/templates/Sparkle/customer/index/index.tpl +++ b/templates/Sparkle/customer/index/index.tpl @@ -5,11 +5,11 @@ $header {$lng['panel']['dashboard']} -
    +
    - +
    {$lng['customer']['subdomains']}
    {$userinfo['subdomains_used']} {$lng['panel']['used']}
    @@ -23,7 +23,7 @@ $header
    - +
    {$lng['customer']['diskspace']}
    {$userinfo['diskspace_used']} {$lng['panel']['used']}
    @@ -37,7 +37,7 @@ $header
    - +
    {$lng['customer']['traffic']}
    {$userinfo['traffic_used']} {$lng['panel']['used']}
    @@ -51,7 +51,7 @@ $header
    - +
    {$lng['customer']['emails']}
    {$userinfo['emails_used']} {$lng['panel']['used']}
    @@ -65,7 +65,7 @@ $header
    - +
    {$lng['customer']['accounts']}
    {$userinfo['email_accounts_used']} {$lng['panel']['used']}
    @@ -79,7 +79,7 @@ $header
    - +
    {$lng['customer']['forwarders']}
    {$userinfo['email_forwarders_used']} {$lng['panel']['used']}
    @@ -93,7 +93,7 @@ $header
    - +
    {$lng['customer']['email_quota']}
    {$userinfo['email_quota_used']} {$lng['panel']['used']}
    @@ -107,7 +107,7 @@ $header
    - +
    {$lng['customer']['autoresponder']}
    {$userinfo['email_autoresponder_used']} {$lng['panel']['used']}
    @@ -121,7 +121,7 @@ $header
    - +
    {$lng['customer']['mysqls']}
    {$userinfo['mysqls_used']} {$lng['panel']['used']}
    @@ -135,7 +135,7 @@ $header
    - +
    {$lng['customer']['ftps']}
    {$userinfo['ftps_used']} {$lng['panel']['used']}
    @@ -149,7 +149,7 @@ $header
    - +
    {$lng['aps']['numberofapspackages']}
    {$userinfo['aps_packages_used']} {$lng['panel']['used']}
    @@ -163,7 +163,7 @@ $header
    - +
    {$lng['customer']['tickets']}
    {$userinfo['tickets_used']} {$lng['panel']['used']}
    From 9d3f2deef16f6ca57c1eccd24501cb3e7bcefe10 Mon Sep 17 00:00:00 2001 From: BNoiZe Date: Sun, 27 Oct 2013 12:14:57 +0100 Subject: [PATCH 5/5] Removed useless text --- templates/Sparkle/admin/index/index.tpl | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/templates/Sparkle/admin/index/index.tpl b/templates/Sparkle/admin/index/index.tpl index 9f60ba29..ddd1d376 100644 --- a/templates/Sparkle/admin/index/index.tpl +++ b/templates/Sparkle/admin/index/index.tpl @@ -196,8 +196,7 @@ $header
    - -

    System Information

    +