diff options
Diffstat (limited to 'web/gui/src/dashboard.js')
| -rw-r--r-- | web/gui/src/dashboard.js/charting/_c3.js | 114 | ||||
| -rw-r--r-- | web/gui/src/dashboard.js/charting/_morris.js | 81 | ||||
| -rw-r--r-- | web/gui/src/dashboard.js/charting/_raphael.js | 48 | ||||
| -rw-r--r-- | web/gui/src/dashboard.js/charting/google-charts.js | 3 | ||||
| -rw-r--r-- | web/gui/src/dashboard.js/main.js | 101 | ||||
| -rw-r--r-- | web/gui/src/dashboard.js/registry.js | 2 |
6 files changed, 55 insertions, 294 deletions
diff --git a/web/gui/src/dashboard.js/charting/_c3.js b/web/gui/src/dashboard.js/charting/_c3.js deleted file mode 100644 index 6688bbcce..000000000 --- a/web/gui/src/dashboard.js/charting/_c3.js +++ /dev/null @@ -1,114 +0,0 @@ - -// DEPRECATED: will be removed! - -// c3 - -NETDATA.c3Initialize = function(callback) { - if (typeof netdataNoC3 === 'undefined' || !netdataNoC3) { - - // C3 requires D3 - if (!NETDATA.chartLibraries.d3.initialized) { - if (NETDATA.chartLibraries.d3.enabled) { - NETDATA.d3Initialize(function() { - NETDATA.c3Initialize(callback); - }); - } else { - NETDATA.chartLibraries.c3.enabled = false; - if (typeof callback === "function") - return callback(); - } - } else { - NETDATA._loadCSS(NETDATA.c3_css); - - $.ajax({ - url: NETDATA.c3_js, - cache: true, - dataType: "script", - xhrFields: { withCredentials: true } // required for the cookie - }) - .done(function() { - NETDATA.registerChartLibrary('c3', NETDATA.c3_js); - }) - .fail(function() { - NETDATA.chartLibraries.c3.enabled = false; - NETDATA.error(100, NETDATA.c3_js); - }) - .always(function() { - if (typeof callback === "function") - return callback(); - }); - } - } else { - NETDATA.chartLibraries.c3.enabled = false; - if (typeof callback === "function") - return callback(); - } -}; - -NETDATA.c3ChartUpdate = function(state, data) { - state.c3_instance.destroy(); - return NETDATA.c3ChartCreate(state, data); - - //state.c3_instance.load({ - // rows: data.result, - // unload: true - //}); - - //return true; -}; - -NETDATA.c3ChartCreate = function(state, data) { - - state.element_chart.id = 'c3-' + state.uuid; - // console.log('id = ' + state.element_chart.id); - - state.c3_instance = c3.generate({ - bindto: '#' + state.element_chart.id, - size: { - width: state.chartWidth(), - height: state.chartHeight() - }, - color: { - pattern: state.chartColors() - }, - data: { - x: 'time', - rows: data.result, - type: (state.chart.chart_type === 'line')?'spline':'area-spline' - }, - axis: { - x: { - type: 'timeseries', - tick: { - format: function(x) { - return NETDATA.dateTime.xAxisTimeString(x); - } - } - } - }, - grid: { - x: { - show: true - }, - y: { - show: true - } - }, - point: { - show: false - }, - line: { - connectNull: false - }, - transition: { - duration: 0 - }, - interaction: { - enabled: true - } - }); - - // console.log(state.c3_instance); - - return true; -}; diff --git a/web/gui/src/dashboard.js/charting/_morris.js b/web/gui/src/dashboard.js/charting/_morris.js deleted file mode 100644 index 30789e4e2..000000000 --- a/web/gui/src/dashboard.js/charting/_morris.js +++ /dev/null @@ -1,81 +0,0 @@ - -// DEPRECATED: will be removed! - -// morris - -NETDATA.morrisInitialize = function(callback) { - if (typeof netdataNoMorris === 'undefined' || !netdataNoMorris) { - - // morris requires raphael - if (!NETDATA.chartLibraries.raphael.initialized) { - if (NETDATA.chartLibraries.raphael.enabled) { - NETDATA.raphaelInitialize(function() { - NETDATA.morrisInitialize(callback); - }); - } else { - NETDATA.chartLibraries.morris.enabled = false; - if (typeof callback === "function") - return callback(); - } - } else { - NETDATA._loadCSS(NETDATA.morris_css); - - $.ajax({ - url: NETDATA.morris_js, - cache: true, - dataType: "script", - xhrFields: { withCredentials: true } // required for the cookie - }) - .done(function() { - NETDATA.registerChartLibrary('morris', NETDATA.morris_js); - }) - .fail(function() { - NETDATA.chartLibraries.morris.enabled = false; - NETDATA.error(100, NETDATA.morris_js); - }) - .always(function() { - if (typeof callback === "function") - return callback(); - }); - } - } else { - NETDATA.chartLibraries.morris.enabled = false; - if (typeof callback === "function") - return callback(); - } -}; - -NETDATA.morrisChartUpdate = function(state, data) { - state.morris_instance.setData(data.result.data); - return true; -}; - -NETDATA.morrisChartCreate = function(state, data) { - - state.morris_options = { - element: state.element_chart.id, - data: data.result.data, - xkey: 'time', - ykeys: data.dimension_names, - labels: data.dimension_names, - lineWidth: 2, - pointSize: 3, - smooth: true, - hideHover: 'auto', - parseTime: true, - continuousLine: false, - behaveLikeLine: false - }; - - if (state.chart.chart_type === 'line') - state.morris_instance = new Morris.Line(state.morris_options); - - else if (state.chart.chart_type === 'area') { - state.morris_options.behaveLikeLine = true; - state.morris_instance = new Morris.Area(state.morris_options); - } - else // stacked - state.morris_instance = new Morris.Area(state.morris_options); - - return true; -}; diff --git a/web/gui/src/dashboard.js/charting/_raphael.js b/web/gui/src/dashboard.js/charting/_raphael.js deleted file mode 100644 index 2d89a22a8..000000000 --- a/web/gui/src/dashboard.js/charting/_raphael.js +++ /dev/null @@ -1,48 +0,0 @@ - -// DEPRECATED: will be removed! - -// raphael - -NETDATA.raphaelInitialize = function(callback) { - if (typeof netdataStopRaphael === 'undefined' || !netdataStopRaphael) { - $.ajax({ - url: NETDATA.raphael_js, - cache: true, - dataType: "script", - xhrFields: { withCredentials: true } // required for the cookie - }) - .done(function() { - NETDATA.registerChartLibrary('raphael', NETDATA.raphael_js); - }) - .fail(function() { - NETDATA.chartLibraries.raphael.enabled = false; - NETDATA.error(100, NETDATA.raphael_js); - }) - .always(function() { - if (typeof callback === "function") - return callback(); - }); - } else { - NETDATA.chartLibraries.raphael.enabled = false; - if (typeof callback === "function") - return callback(); - } -}; - -NETDATA.raphaelChartUpdate = function(state, data) { - $(state.element_chart).raphael(data.result, { - width: state.chartWidth(), - height: state.chartHeight() - }); - - return false; -}; - -NETDATA.raphaelChartCreate = function(state, data) { - $(state.element_chart).raphael(data.result, { - width: state.chartWidth(), - height: state.chartHeight() - }); - - return false; -}; diff --git a/web/gui/src/dashboard.js/charting/google-charts.js b/web/gui/src/dashboard.js/charting/google-charts.js index 432c84a1d..7497dafd8 100644 --- a/web/gui/src/dashboard.js/charting/google-charts.js +++ b/web/gui/src/dashboard.js/charting/google-charts.js @@ -1,5 +1,8 @@ // google charts +// Codacy declarations +/* global google */ + NETDATA.googleInitialize = function (callback) { if (typeof netdataNoGoogleCharts === 'undefined' || !netdataNoGoogleCharts) { $.ajax({ diff --git a/web/gui/src/dashboard.js/main.js b/web/gui/src/dashboard.js/main.js index 1d050d613..13f3b4c7d 100644 --- a/web/gui/src/dashboard.js/main.js +++ b/web/gui/src/dashboard.js/main.js @@ -3,6 +3,7 @@ // Codacy declarations /* global clipboard */ +/* global Ps */ if (NETDATA.options.debug.main_loop) { console.log('welcome to NETDATA'); @@ -1271,6 +1272,55 @@ let chartState = function (element) { this.tm.last_dom_created = 0; }; + const maxMessageFontSize = () => { + let screenHeight = screen.height; + let el = this.element; + + // normally we want a font size, as tall as the element + let h = el.clientHeight; + + // but give it some air, 20% let's say, or 5 pixels min + let lost = Math.max(h * 0.2, 5); + h -= lost; + + // center the text, vertically + let paddingTop = (lost - 5) / 2; + + // but check the width too + // it should fit 10 characters in it + let w = el.clientWidth / 10; + if (h > w) { + paddingTop += (h - w) / 2; + h = w; + } + + // and don't make it too huge + // 5% of the screen size is good + if (h > screenHeight / 20) { + paddingTop += (h - (screenHeight / 20)) / 2; + h = screenHeight / 20; + } + + // set it + this.element_message.style.fontSize = h.toString() + 'px'; + this.element_message.style.paddingTop = paddingTop.toString() + 'px'; + }; + + const showMessageIcon = (icon) => { + this.element_message.innerHTML = icon; + maxMessageFontSize(); + $(this.element_message).removeClass('hidden'); + this.tmp.___messageHidden___ = undefined; + }; + + const showLoading = () => { + if (!this.chart_created) { + showMessageIcon(NETDATA.icons.loading + ' netdata'); + return true; + } + return false; + }; + let createDOM = () => { if (!this.enabled) { return; @@ -1344,47 +1394,6 @@ let chartState = function (element) { } }; - const maxMessageFontSize = () => { - let screenHeight = screen.height; - let el = this.element; - - // normally we want a font size, as tall as the element - let h = el.clientHeight; - - // but give it some air, 20% let's say, or 5 pixels min - let lost = Math.max(h * 0.2, 5); - h -= lost; - - // center the text, vertically - let paddingTop = (lost - 5) / 2; - - // but check the width too - // it should fit 10 characters in it - let w = el.clientWidth / 10; - if (h > w) { - paddingTop += (h - w) / 2; - h = w; - } - - // and don't make it too huge - // 5% of the screen size is good - if (h > screenHeight / 20) { - paddingTop += (h - (screenHeight / 20)) / 2; - h = screenHeight / 20; - } - - // set it - this.element_message.style.fontSize = h.toString() + 'px'; - this.element_message.style.paddingTop = paddingTop.toString() + 'px'; - }; - - const showMessageIcon = (icon) => { - this.element_message.innerHTML = icon; - maxMessageFontSize(); - $(this.element_message).removeClass('hidden'); - this.tmp.___messageHidden___ = undefined; - }; - const hideMessage = () => { if (typeof this.tmp.___messageHidden___ === 'undefined') { this.tmp.___messageHidden___ = true; @@ -1408,14 +1417,6 @@ let chartState = function (element) { showMessageIcon(icon + ' netdata' + invisibleSearchableText()); }; - const showLoading = () => { - if (!this.chart_created) { - showMessageIcon(NETDATA.icons.loading + ' netdata'); - return true; - } - return false; - }; - const isHidden = () => { return (typeof this.tmp.___chartIsHidden___ !== 'undefined'); }; @@ -3843,7 +3844,7 @@ NETDATA.resetAllCharts = function (state) { // if (NETDATA.globalPanAndZoom.isMaster(state) === false) { // master = false; // } - const master = NETDATA.globalPanAndZoom.isMaster(state) + const master = NETDATA.globalPanAndZoom.isMaster(state); // clear the global Pan and Zoom // this will also refresh the master diff --git a/web/gui/src/dashboard.js/registry.js b/web/gui/src/dashboard.js/registry.js index 77a822b7b..7894eaa21 100644 --- a/web/gui/src/dashboard.js/registry.js +++ b/web/gui/src/dashboard.js/registry.js @@ -75,7 +75,7 @@ NETDATA.registry = { NETDATA.registry.hello(NETDATA.serverDefault, function (data) { if (data) { NETDATA.registry.server = data.registry; - if (data.cloud_base_url != "") { + if (data.cloud_base_url !== "") { NETDATA.registry.isCloudEnabled = true; NETDATA.registry.cloudBaseURL = data.cloud_base_url; } else { |