reports: adjust graph title font-size dynamically

sni · Oct 21, 2021 · 50ff353 · 50ff353
1 parent 317fae5
commit 50ff353
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 6 deletions.
diff --git a/plugins/plugins-available/reports2/root/reports_render.js b/plugins/plugins-available/reports2/root/reports_render.js
@@ -5,6 +5,10 @@
 
 var page_renumber_required = 0;
 function reports_body_end() {
+    jQuery(".fittext").each(function(i, el) {
+        fitText(el);
+    });
+
     set_vertical_header();
     split_paged_tables();
 

diff --git a/plugins/plugins-available/reports2/templates/reports/comp/sla_total_graph.tt b/plugins/plugins-available/reports2/templates/reports/comp/sla_total_graph.tt
@@ -29,9 +29,9 @@ jQuery(document).ready(function() {
       [% x=0; FOREACH hst = avail_data.hosts.keys.sort.reverse %]
         [% val = round_decimals(values.$x.0, param.decimals) %]
         [% IF values.$x.0 == -1 %][%# no data at all... #%]
-        label[[% x; x = x + 1 %]] = "<span class='graph_hst_legend'>[% _hst(hst) | html %]<\/span><span class='graph_percent_legend'>n/a<\/span>";
+        label[[% x; x = x + 1 %]] = "<span class='graph_hst_legend fittext'>[% _hst(hst) | html %]<\/span><span class='graph_percent_legend'>n/a<\/span>";
         [% ELSE %]
-        label[[% x; x = x + 1 %]] = "<span class='graph_hst_legend'>[% _hst(hst) | html %]<\/span><span class='graph_percent_legend[% IF val < param.sla %] sla_nok[% END %]'>[% val %] %<\/span>";
+        label[[% x; x = x + 1 %]] = "<span class='graph_hst_legend fittext'>[% _hst(hst) | html %]<\/span><span class='graph_percent_legend[% IF val < param.sla %] sla_nok[% END %]'>[% val %] %<\/span>";
         [% sla_averages_total = sla_averages_total + val; sla_averages_num = sla_averages_num + 1; %]
         [% END %]
       [% END %]
@@ -41,9 +41,9 @@ jQuery(document).ready(function() {
           label[[% x %]] = "";
           [% val = round_decimals(values.$x.0, param.decimals) %]
           [% IF loop.last && type != 'both' %]
-          label[[% x %]] += "<span class='graph_svc_hst_legend'>[% _hst(hst) | html %]<\/span>";
+          label[[% x %]] += "<span class='graph_svc_hst_legend fittext'>[% _hst(hst) | html %]<\/span>";
           [% END %]
-          label[[% x %]] += "<span class='graph_svc_legend'> - [% _svc(hst, svc) | html %]<\/span>";
+          label[[% x %]] += "<span class='graph_svc_legend fittext'> - [% _svc(hst, svc) | html %]<\/span>";
           [% IF values.$x.0 == -1 %][%# no data at all... #%]
           label[[% x %]] += "<span class='graph_percent_legend'>n/a<\/span>";
           [% ELSE %]
@@ -55,9 +55,9 @@ jQuery(document).ready(function() {
         [% IF type == 'both' %]
           [% val = round_decimals(values.$x.0, param.decimals) %]
           [% IF values.$x.0 == -1 %][%# no data at all... #%]
-          label[[% x; x = x + 1 %]] = "<span class='graph_hst_legend'>[% _hst(hst) | html %]<\/span><span class='graph_percent_legend'>n/a<\/span>";
+          label[[% x; x = x + 1 %]] = "<span class='graph_hst_legend fittext'>[% _hst(hst) | html %]<\/span><span class='graph_percent_legend'>n/a<\/span>";
           [% ELSE %]
-          label[[% x; x = x + 1 %]] = "<span class='graph_hst_legend'>[% _hst(hst) | html %]<\/span><span class='graph_percent_legend[% IF val < param.sla %] sla_nok[% END %]'>[% val %] %<\/span>";
+          label[[% x; x = x + 1 %]] = "<span class='graph_hst_legend fittext'>[% _hst(hst) | html %]<\/span><span class='graph_percent_legend[% IF val < param.sla %] sla_nok[% END %]'>[% val %] %<\/span>";
           [% sla_averages_total = sla_averages_total + val; sla_averages_num = sla_averages_num + 1; %]
           [% END %]
         [% END %]

diff --git a/root/thruk/javascript/thruk-2.44.3.js b/root/thruk/javascript/thruk-2.44.3.js
@@ -88,6 +88,10 @@ function init_page() {
         });
     }
 
+    jQuery(".fittext").each(function(i, el) {
+        fitText(el);
+    });
+
     var newUrl = window.location.href;
     var scroll = newUrl.match(/(\?|\&)scrollTo=([\d\.]+)/);
     if(scroll) {
@@ -3627,6 +3631,16 @@ function updateExportLink(input) {
     input.value = newUrl;
 }
 
+function fitText(el) {
+    el = jQuery(el);
+    var boxWidth  = el.width();
+    var textWidth = el[0].scrollWidth;
+    if(textWidth > boxWidth) {
+        var size = parseInt(el.css("font-size"), 10);
+        el.css("font-size", ""+Math.floor(size * (boxWidth/textWidth))+"px");
+    }
+}
+
 /*******************************************************************************
 *        db        ,ad8888ba, 888888888888 88   ,ad8888ba,   888b      88
 *       d88b      d8"'    `"8b     88      88  d8"'    `"8b  8888b     88