add total disk usage to distributions

debomatic-webui/public/javascripts/page_history.js

@@ -244,6 +244,20 @@ function Page_History() {
         }, options);
         _create_graph_tooltip("#disk-chart", '.ct-bar', "MB");
 
+        // WORKAROUND: add total spaces to label
+        // wating for support multilines for label in chartist-js
+        // https://github.com/gionkunz/chartist-js/issues/25
+        $('#disk-chart svg').height("+=20");
+        $('#disk-chart .ct-label.ct-horizontal').each(function (index, elem) {
+            var size = document.createElementNS("http://www.w3.org/2000/svg", 'text');
+            var currentY = Number(elem.getAttribute('dy'));
+            size.setAttribute('dx', Number(elem.getAttribute('dx')));
+            size.setAttribute('dy', currentY + 15);
+            size.setAttribute('class', 'ct-label ct-horizontal ct-size');
+            size.textContent = total_sizes[elem.textContent] + " MB";
+            elem.parentNode.appendChild(size);
+        });
+
     }
 
     function _exportTableToCSV($table, filename) {

debomatic-webui/public/stylesheets/style.css

@@ -290,6 +290,10 @@ footer .info {
   white-space: nowrap;
 }
 
+#disk-usage .ct-label.ct-size {
+  font-size: 0.72em;
+}
+
 /* add more colors to graphs */
 .ct-series-e .ct-bar,
 .ct-chart .ct-series.ct-series-e .ct-line,