]> arthur.barton.de Git - netdata.git/blobdiff - web/index.html
fix nginx entry in web dashboard
[netdata.git] / web / index.html
index a52fa02153607176cc67820c9e7be089fa16371b..f0a3b75de60cf57ce562377d81771e474c02a471 100644 (file)
@@ -2,6 +2,7 @@
 <html lang="en">
 <head>
        <title>netdata dashboard</title>
+       <meta name="application-name" content="netdata">
 
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta charset="utf-8">
                                while(len--) {
                                        var u = machines[len];
                                        found++;
-                                       el += '<li id="registry_server_' + u.guid + '"><a href="#" onClick="return gotoServerModalHandler(\'' + u.guid + '\');">' + u.name + '</a></li>';
+                                       el += '<li id="registry_server_' + u.guid + '"><a class="registry_link" href="' + u.url + '" onClick="return gotoServerModalHandler(\'' + u.guid + '\');">' + u.name + '</a></li>';
                                        a1 += '<li id="registry_action_' + u.guid + '"><a href="#" onclick="deleteRegistryModalHandler(\'' + u.guid + '\',\'' + u.name + '\',\'' + u.url + '\'); return false;"><i class="fa fa-trash-o" aria-hidden="true" style="color: #999;"></i></a></li>';
                                }
                        }
                        document.getElementById('mynetdata_servers').innerHTML = el;
                        document.getElementById('mynetdata_servers2').innerHTML = el;
                        document.getElementById('mynetdata_actions1').innerHTML = a1;
+
+                       gotoServerInit();
                };
 
        </script>
 
        <!-- load the dashboard manager - it will do the rest -->
-       <script type="text/javascript" src="dashboard.js?v37"></script>
+       <script type="text/javascript" src="dashboard.js?v40"></script>
 </head>
 
 <body data-spy="scroll" data-target="#sidebar">
@@ -1019,6 +1022,8 @@ if(isdemo()) {
        document.getElementById('masthead').style.display = 'block';
 }
 var gotoServerValidateRemaining = 0;
+var gotoServerMiddleClick = false;
+var gotoServerStop = false;
 function gotoServerValidateUrl(id, guid, url) {
        var penaldy = 0;
        if(document.location.toString().startsWith('http://') && url.toString().startsWith('https://'))
@@ -1028,25 +1033,41 @@ function gotoServerValidateUrl(id, guid, url) {
 
        setTimeout(function() {
                document.getElementById('gotoServerList').innerHTML += '<tr><td style="padding-left: 20px;"><a href="' + url + '" target="_blank">' + url + '</a></td><td style="padding-left: 30px;"><code id="' + guid + '-' + id + '-status">checking...</code></td></tr>';
+
                NETDATA.registry.hello(url, function(data) {
                        if (data) {
-                               console.log('OK ' + id + ' URL: ' + url);
+                               // console.log('OK ' + id + ' URL: ' + url);
                                document.getElementById(guid + '-' + id + '-status').innerHTML = "OK";
-                               document.location = url;
+                               var hash = document.location.hash || '';
+
+                               if(!gotoServerStop) {
+                                       gotoServerStop = true;
+
+                                       if(gotoServerMiddleClick) {
+                                               window.open(url + hash, '_blank');
+                                               gotoServerMiddleClick = false;
+                                               document.getElementById('gotoServerResponse').innerHTML = '<b>Opening new window to ' + NETDATA.registry.machines[guid].name + '<br/><a href="' + url + hash + '">' + url + hash + '</a></b><br/>(check your pop-up blocker if it fails)';
+                                       }
+                                       else
+                                               document.location = url + hash;
+                               }
                        }
                        else {
                                document.getElementById(guid + '-' + id + '-status').innerHTML = "failed!";
                                gotoServerValidateRemaining--;
-                               if(gotoServerValidateRemaining <= 0)
+                               if(gotoServerValidateRemaining <= 0) {
+                                       gotoServerMiddleClick = false;
                                        document.getElementById('gotoServerResponse').innerHTML = '<b>Sorry! I cannot find any operational URL for this server</b>';
+                               }
                        }
                });
        }, (id * 50) + penaldy);
 }
 
 function gotoServerModalHandler(guid) {
-       console.log('goto server: ' + guid);
+       // console.log('goto server: ' + guid);
 
+       gotoServerStop = false;
        var len = NETDATA.registry.machines[guid].alternate_urls.length;
 
        document.getElementById('gotoServerResponse').innerHTML = '';
@@ -1061,6 +1082,20 @@ function gotoServerModalHandler(guid) {
        return false;
 }
 
+function gotoServerInit() {
+       $(".registry_link").on('click', function(e) {
+               if(e.which === 2) {
+                       e.preventDefault();
+                       gotoServerMiddleClick = true;
+               }
+               else {
+                       gotoServerMiddleClick = false;
+               }
+
+               return true;
+       });
+}
+
 function switchRegistryModalHandler() {
        document.getElementById('switchRegistryPersonGUID').value = NETDATA.registry.person_guid;
        document.getElementById('switchRegistryURL').innerHTML = NETDATA.registry.server;
@@ -1124,7 +1159,7 @@ var options = {
        chartsPerRow: 0,
        chartsMinWidth: 1450,
        chartsHeight: 180,
-       sparklinesHeight: 60
+       sparklinesHeight: 60,
 };
 
 // generate a sparkline
@@ -1184,6 +1219,21 @@ function sortObjectByPriority(object) {
        return sorted;
 }
 
+
+// ----------------------------------------------------------------------------
+// scroll to a section, without changing the browser history
+
+function scrollToId(hash) {
+       if(hash && hash != '') {
+               var offset = $('#' + hash).offset();
+               if(typeof offset !== 'undefined')
+                       $('html, body').animate({ scrollTop: offset.top }, 0);
+       }
+
+       // we must return false to prevent the default action
+       return false;
+}
+
 // ----------------------------------------------------------------------------
 
 function gaugeChart(title, width, dimensions, colors) {
@@ -1276,19 +1326,19 @@ var menuData = {
 
        'apps': {
                title: 'Applications',
-               info: 'Per application statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through the entire <code>/proc</code> filesystem and aggregates statistics for applications of interest, defined in <code>/etc/netdata/apps_groups.conf</code> (the default is <a href="https://github.com/firehol/netdata/blob/master/conf.d/apps_groups.conf" target="_blank">here</a>). The plugin internally builds a process tree (much like <code>ps fax</code> does), and groups processes together (evaluating both child and parent processes) so that the result is always a chart with a predefined set of dimensions (of course, only application groups found running are reported).<br/><b>IMPORTANT</b>: The values shown here are not 100% accurate. They only include values for the processes running. If an application is spawning children continuously, which are terminated in just a few milliseconds (like shell scripts do), the values reported will be inaccurate. Linux does report the values for the exited children of a process. However, these values are reported to the parent process <b>only when the child exits</b>. If these values, of the exited child processes, were also aggregated in the charts below, the charts would have been full of spikes, presenting unrealistic utilization for each process group. So, we decided to ignore these values and present only the utilization of <b>the currently running processes</b>.',
+               info: 'Per application statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through the entire <code>/proc</code> filesystem and aggregates statistics for applications of interest, defined in <code>/etc/netdata/apps_groups.conf</code> (the default is <a href="https://github.com/firehol/netdata/blob/master/conf.d/apps_groups.conf" target="_blank">here</a>). The plugin internally builds a process tree (much like <code>ps fax</code> does), and groups processes together (evaluating both child and parent processes) so that the result is always a chart with a predefined set of dimensions (of course, only application groups found running are reported). The reported values are compatible with <code>top</code>, although the netdata plugin counts also the resources of exited children (unlike <code>top</code> which shows only the resources of the currently running processes). So for processes like shell scripts, the reported values include the resources used by the commands these scripts run within each timeframe.',
                height: 1.5
        },
 
        'users': {
                title: 'Users',
-               info: 'Per user statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through the entire <code>/proc</code> filesystem and aggregates statistics per user.<br/><b>IMPORTANT</b>: The values shown here are not 100% accurate. They only include values for the processes running. If an application is spawning children continuously, which are terminated in just a few milliseconds (like shell scripts do), the values reported will be inaccurate. Linux does report the values for the exited children of a process. However, these values are reported to the parent process <b>only when the child exits</b>. If these values, of the exited child processes, were also aggregated in the charts below, the charts would have been full of spikes, presenting unrealistic utilization for each process group. So, we decided to ignore these values and present only the utilization of <b>the currently running processes</b>.',
+               info: 'Per user statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through the entire <code>/proc</code> filesystem and aggregates statistics per user. The reported values are compatible with <code>top</code>, although the netdata plugin counts also the resources of exited children (unlike <code>top</code> which shows only the resources of the currently running processes). So for processes like shell scripts, the reported values include the resources used by the commands these scripts run within each timeframe.',
                height: 1.5
        },
 
        'groups': {
                title: 'User Groups',
-               info: 'Per user group statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through the entire <code>/proc</code> filesystem and aggregates statistics per user group.<br/><b>IMPORTANT</b>: The values shown here are not 100% accurate. They only include values for the processes running. If an application is spawning children continuously, which are terminated in just a few milliseconds (like shell scripts do), the values reported will be inaccurate. Linux does report the values for the exited children of a process. However, these values are reported to the parent process <b>only when the child exits</b>. If these values, of the exited child processes, were also aggregated in the charts below, the charts would have been full of spikes, presenting unrealistic utilization for each process group. So, we decided to ignore these values and present only the utilization of <b>the currently running processes</b>.',
+               info: 'Per user group statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through the entire <code>/proc</code> filesystem and aggregates statistics per user group. The reported values are compatible with <code>top</code>, although the netdata plugin counts also the resources of exited children (unlike <code>top</code> which shows only the resources of the currently running processes). So for processes like shell scripts, the reported values include the resources used by the commands these scripts run within each timeframe.',
                height: 1.5
        },
 
@@ -1312,10 +1362,25 @@ var menuData = {
                info: undefined
        },
 
+       'phpfpm': {
+               title: 'PHP-FPM',
+               info: undefined,
+       },
+
+       'nginx': {
+               title: 'nginx',
+               info: undefined,
+       },
+/*
+       'apache': {
+               title: 'Apache',
+               info: undefined,
+       },*/
+
        'named': {
                title: 'named',
                info: undefined
-       },
+       }
 };
 
 var submenuData = {
@@ -1751,6 +1816,9 @@ function enrichChartData(chart) {
                        break;
 
                case 'mysql':
+               case 'phpfpm':
+/*             case 'nginx':
+               case 'apache':*/
                case 'named':
                case 'cgroup':
                        chart.menu = chart.type;
@@ -1953,7 +2021,7 @@ function renderPage(menus, data) {
                // generate an entry at the main menu
 
                var menuid = name2id(menu);
-               sidebar += '<li class=""><a href="#' + menuid + '">' + menus[menu].title + '</a><ul class="nav">';
+               sidebar += '<li class=""><a href="#' + menuid + '" onClick="return scrollToId(\'' + menuid + '\');">' + menus[menu].title + '</a><ul class="nav">';
                html += '<div role="section"><div role="sectionhead"><h1 id="' + menuid + '" role="heading">' + menus[menu].title + '</h1></div><div id="menu_' + menuid + '" role="document">';
 
                if(menus[menu].info !== null)
@@ -1973,7 +2041,7 @@ function renderPage(menus, data) {
 
                        // generate an entry at the submenu
                        var submenuid = name2id(menu + '_' + submenu);
-                       sidebar += '<li class><a href="#' + submenuid + '">' + menus[menu].submenus[submenu].title + '</a></li>';
+                       sidebar += '<li class><a href="#' + submenuid + '" onClick="return scrollToId(\'' + submenuid + '\');">' + menus[menu].submenus[submenu].title + '</a></li>';
                        shtml += '<div class="netdata-group-container" id="submenu_' + submenuid + '" style="display: inline-block; width: ' + pcent_width.toString() + '%"><h2 id="' + submenuid + '" class="netdata-chart-alignment" role="heading">' + menus[menu].submenus[submenu].title + '</h2>';
 
                        if(menus[menu].submenus[submenu].info !== null)
@@ -2091,7 +2159,7 @@ function downloadAllCharts(netdata_url) {
                        options.hostname = data.hostname;
                        document.getElementById('hostname').innerHTML = options.hostname;
                        document.getElementById('hostname').href = NETDATA.serverDefault;
-                       document.title = options.hostname + ' dashboard';
+                       document.title = options.hostname + ' netdata dashboard';
 
                        renderChartsAndMenu(data);
 
@@ -2397,14 +2465,7 @@ function finalizePage() {
        NETDATA.unpause();
 
        // check if we have to jump to a specific section
-       var hash = location.hash.replace('#','');
-       if(hash != '') {
-               // Clear the hash in the URL
-               // location.hash = '';   // delete front "//" if you want to change the address bar
-               var offset = $(location.hash).offset();
-               if(typeof offset !== 'undefined')
-                       $('html, body').animate({ scrollTop: offset.top }, 0);
-       }
+       scrollToId(location.hash.replace('#',''));
 
        /* activate bootstrap sidebar (affix) */
        $('#sidebar').affix({
@@ -2427,19 +2488,15 @@ function finalizePage() {
                offset: $(window).height() / 3 // controls the diff of the <hX> element to the top, to select it
        });
 
-       $('#sidebar').on('activate.bs.scrollspy', function (e)\r
-       {\r
-               var el = $(e.target);\r
-               if (el.find('ul').size() == 0)\r
-               {\r
-                       var href = el.find('a').attr('href');\r
-                       history.pushState(null, document.title, href);\r
-               };\r
+       // change the URL based on the current position of the screen
+       $('#sidebar').on('activate.bs.scrollspy', function (e) {
+               var el = $(e.target);
+               if(el.find('ul').size() == 0)
+                       history.replaceState(null, document.title, el.find('a').attr('href'));
        });
 
        document.getElementById('footer').style.display = 'block';
 
-
        var update_options_modal = function() {
                // console.log('update_options_modal');