allow custom defined information on the dashboard; fixes #1936

3 files changed, 125 insertions, 54 deletions

diff --git a/web/Makefile.am b/web/Makefile.am
index 6d1130239f..03a4875972 100644
--- a/web/Makefile.am
+++ b/web/Makefile.am
@@ -11,6 +11,7 @@ dist_web_DATA = \
 	dashboard.html \
 	dashboard.js \
 	dashboard_info.js \
+	dashboard_info_custom_example.js \
 	dashboard.css \
 	dashboard.slate.css \
 	favicon.ico \
diff --git a/web/dashboard_info_custom_example.js b/web/dashboard_info_custom_example.js
new file mode 100644
index 0000000000..f9e255d770
--- /dev/null
+++ b/web/dashboard_info_custom_example.js
@@ -0,0 +1,58 @@
+/*
+ * Custom netdata information file
+ * -------------------------------
+ *
+ * Use this file to add custom information on netdata dashboards:
+ *
+ * 1. Copy it to a new filename (so that it will not be overwritten with netdata updates)
+ * 2. Edit it to fit your needs
+ * 3. Set the following option to /etc/netdata/netdata.conf :
+ *
+ *    [web]
+ *      custom dashboard_info.js = your_filename.js
+ *
+ * Using this file you can:
+ *
+ * 1. Overwrite or add messages to menus, submenus and charts.
+ *    Use dashboard_info.js to find out what you can define.
+ *
+ * 2. Inject javascript code into the default netdata dashboard.
+ *
+ */
+
+// ----------------------------------------------------------------------------
+// MENU
+//
+// - title      the menu title as to be rendered at the charts menu
+// - icon       html fragment of the icon to display
+// - info       html fragment for the description above all the menu charts
+
+customDashboard.menu = {
+
+};
+
+
+// ----------------------------------------------------------------------------
+// SUBMENU
+//
+// - title       the submenu title as to be rendered at the charts menu
+// - info        html fragment for the description above all the submenu charts
+
+customDashboard.submenu = {
+
+};
+
+
+// ----------------------------------------------------------------------------
+// CONTEXT (the template each chart is based on)
+//
+// - info        html fragment for the description above the chart
+// - height      a ratio to the default as a decimal number: 1.0 = 100%
+// - colors      a single color or an array of colors to use for the dimensions
+// - valuerange  the y-range of the chart as an array [min, max]
+// - heads       an array of gauge charts to render above the submenu section
+// - mainheads   an array of gauge charts to render at the menu section
+
+customDashboard.context = {
+
+};
diff --git a/web/index.html b/web/index.html
index a254aa8390..250dbfed32 100644
--- a/web/index.html
+++ b/web/index.html
@@ -992,6 +992,14 @@
 
         // ----------------------------------------------------------------------------
 
+        // user editable information
+        var customDashboard = {
+            menu: {},
+            submenu: {},
+            context: {}
+        };
+
+        // netdata standard information
         var netdataDashboard = {
             sparklines_registry: {},
             os: 'unknown',
@@ -1163,12 +1171,16 @@
                     chart.menu = chart.type;
                     if(parts.length > 2 && parts[1] === 'cache')
                         chart.menu_pattern = tmp + '_' + parts[1];
+                    else if(parts.length > 1)
+                        chart.menu_pattern = tmp;
                     break;
 
                 case 'bind':
                     chart.menu = chart.type;
                     if(parts.length > 2 && parts[1] === 'rndc')
                         chart.menu_pattern = tmp + '_' + parts[1];
+                    else if(parts.length > 1)
+                        chart.menu_pattern = tmp;
                     break;
 
                 case 'cgroup':
@@ -1183,12 +1195,16 @@
                     chart.menu = chart.type;
                     if(parts.length > 2 && parts[1] === 'dhcpd')
                         chart.menu_pattern = tmp + '_' + parts[1];
+                    else if(parts.length > 1)
+                        chart.menu_pattern = tmp;
                     break;
 
                 case 'ovpn':
                     chart.menu = chart.type;
                     if(parts.length > 3 && parts[1] === 'status' && parts[2] === 'log')
                         chart.menu_pattern = tmp + '_' + parts[1];
+                    else if(parts.length > 1)
+                        chart.menu_pattern = tmp;
                     break;
 
                 case 'smartd':
@@ -1196,28 +1212,8 @@
                     chart.menu = chart.type;
                     if(parts.length > 2 && parts[1] === 'log')
                         chart.menu_pattern = tmp + '_' + parts[1];
-                    break;
-
-                case 'dovecot':
-                case 'exim':
-                case 'hddtemp':
-                case 'ipfs':
-                case 'memcached':
-                case 'mysql':
-                case 'named':
-                case 'nginx':
-                case 'nut':
-                case 'phpfpm':
-                case 'postfix':
-                case 'postgres':
-                case 'redis':
-                case 'retroshare':
-                case 'smawebbox':
-                case 'snmp':
-                case 'squid':
-                case 'tomcat':
-                    chart.menu = chart.type;
-                    chart.menu_pattern = tmp;
+                    else if(parts.length > 1)
+                        chart.menu_pattern = tmp;
                     break;
 
                 case 'tc':
@@ -1248,6 +1244,8 @@
 
                 default:
                     chart.menu = chart.type;
+                    if(parts.length > 1)
+                        chart.menu_pattern = tmp;
                     break;
             }
 
@@ -2288,6 +2286,43 @@
                 document.getElementById('alarms_count_badge').innerHTML = '';
         }
 
+        function initializeDynamicDashboardWithData(data) {
+            if(data !== null) {
+                options.hostname = data.hostname;
+                options.data = data;
+                options.version = data.version;
+                netdataDashboard.os = data.os;
+
+                if(typeof data.hosts != 'undefined')
+                    options.hosts = data.hosts;
+
+                // update the dashboard hostname
+                document.getElementById('hostname').innerHTML = options.hostname;
+                document.getElementById('hostname').href = NETDATA.serverDefault;
+                document.getElementById('netdataVersion').innerHTML = options.version;
+
+                // update the dashboard title
+                document.title = options.hostname + ' netdata dashboard';
+
+                // close the splash screen
+                $("#loadOverlay").css("display","none");
+
+                // create a chart_by_name index
+                data.charts_by_name = {};
+                var charts = data.charts;
+                var x;
+                for(x in charts) {
+                    if(!charts.hasOwnProperty(x)) continue;
+
+                    var chart = charts[x];
+                    data.charts_by_name[chart.name] = chart;
+                }
+
+                // render all charts
+                renderChartsAndMenu(data);
+            }
+        }
+
         function initializeDynamicDashboard(netdata_url) {
             if(typeof netdata_url === 'undefined' || netdata_url === null)
                 netdata_url = NETDATA.serverDefault;
@@ -2302,39 +2337,16 @@
 
                 // download all the charts the server knows
                 NETDATA.chartRegistry.downloadAll(netdata_url, function(data) {
-                    if(data !== null) {
-                        options.hostname = data.hostname;
-                        options.data = data;
-                        options.version = data.version;
-                        netdataDashboard.os = data.os;
-
-                        if(typeof data.hosts != 'undefined')
-                            options.hosts = data.hosts;
-
-                        // update the dashboard hostname
-                        document.getElementById('hostname').innerHTML = options.hostname;
-                        document.getElementById('hostname').href = NETDATA.serverDefault;
-                        document.getElementById('netdataVersion').innerHTML = options.version;
-
-                        // update the dashboard title
-                        document.title = options.hostname + ' netdata dashboard';
-
-                        // close the splash screen
-                        $("#loadOverlay").css("display","none");
-
-                        // create a chart_by_name index
-                        data.charts_by_name = {};
-                        var charts = data.charts;
-                        var x;
-                        for(x in charts) {
-                            if(!charts.hasOwnProperty(x)) continue;
-
-                            var chart = charts[x];
-                            data.charts_by_name[chart.name] = chart;
+                    if(data != null) {
+                        if(typeof data.custom_info !== 'undefined' && data.custom_info !== "") {
+                            loadJs(data.custom_info, function () {
+                                $.extend(true, netdataDashboard, customDashboard);
+                                initializeDynamicDashboardWithData(data);
+                            });
+                        }
+                        else {
+                            initializeDynamicDashboardWithData(data);
                         }
-
-                        // render all charts
-                        renderChartsAndMenu(data);
                     }
                 });
             });