web/dashboard.js

   1 // You can set the following variables before loading this script:\r
   2 //\r
   3 // var netdataStopDygraph = 1;                  // do not use dygraph\r
   4 // var netdataStopSparkline = 1;                // do not use sparkline\r
   5 // var netdataStopPeity = 1;                    // do not use peity\r
   6 //\r
   7 // You can also set the default netdata server, using the following.\r
   8 // When this variable is not set, we assume the page is hosted on your\r
   9 // netdata server already.\r
  10 // var netdataServer = "http://yourhost:19999"; // set your NetData server\r
  11 \r
  12 // --------------------------------------------------------------------------------------------------------------------\r
  13 // For google charts you need this in your page:\r
  14 //      <script type="text/javascript" src="https://www.google.com/jsapi"></script>\r
  15 //      <script type='text/javascript'>google.load('visualization', '1.1', {'packages':['corechart', 'controls']});</script>\r
  16 \r
  17 (function(window)\r
  18 {\r
  19         var NETDATA = window.NETDATA || {};\r
  20 \r
  21         // ----------------------------------------------------------------------------------------------------------------\r
  22         // Detect the netdata server\r
  23 \r
  24         // http://stackoverflow.com/questions/984510/what-is-my-script-src-url\r
  25         // http://stackoverflow.com/questions/6941533/get-protocol-domain-and-port-from-url\r
  26         NETDATA._scriptSource = function(scripts) {\r
  27                 var script = null, base = null;\r
  28 \r
  29                 if(typeof document.currentScript != 'undefined') {\r
  30                         script = document.currentScript;\r
  31                 }\r
  32                 else {\r
  33                         var all_scripts = document.getElementsByTagName('script');\r
  34                         script = all_scripts[all_scripts.length - 1];\r
  35                 }\r
  36 \r
  37                 if (script.getAttribute.length != 'undefined')\r
  38                         script = script.src;\r
  39                 else\r
  40                         script = script.getAttribute('src', -1);\r
  41 \r
  42                 var link = document.createElement('a');\r
  43                 link.setAttribute('href', script);\r
  44 \r
  45                 if(!link.protocol || !link.hostname) return null;\r
  46 \r
  47                 base = link.protocol;\r
  48                 if(base) base += "//";\r
  49                 base += link.hostname;\r
  50 \r
  51                 if(link.port) base += ":" + link.port;\r
  52                 base += "/";\r
  53 \r
  54                 return base;\r
  55         };\r
  56 \r
  57         if(typeof netdataServer != 'undefined')\r
  58                 NETDATA.serverDefault = netdataServer + "/";\r
  59         else\r
  60                 NETDATA.serverDefault = NETDATA._scriptSource();\r
  61 \r
  62         NETDATA.jQuery       = NETDATA.serverDefault + 'lib/jquery-1.11.3.min.js';\r
  63         NETDATA.peity_js     = NETDATA.serverDefault + 'lib/jquery.peity.min.js';\r
  64         NETDATA.sparkline_js = NETDATA.serverDefault + 'lib/jquery.sparkline.min.js';\r
  65         NETDATA.dygraph_js   = NETDATA.serverDefault + 'lib/dygraph-combined.js';\r
  66         NETDATA.raphael_js   = NETDATA.serverDefault + 'lib/raphael-min.js';\r
  67         NETDATA.morris_js    = NETDATA.serverDefault + 'lib/morris.min.js';\r
  68         NETDATA.morris_css   = NETDATA.serverDefault + 'css/morris.css';\r
  69         NETDATA.google_js    = 'https://www.google.com/jsapi';\r
  70         NETDATA.colors  = [ '#3366CC', '#DC3912', '#FF9900', '#109618', '#990099', '#3B3EAC', '#0099C6', '#DD4477',\r
  71                 '#66AA00', '#B82E2E', '#316395', '#994499', '#22AA99', '#AAAA11', '#6633CC', '#E67300', '#8B0707',\r
  72                 '#329262', '#5574A6', '#3B3EAC' ];\r
  73 \r
  74         // ----------------------------------------------------------------------------------------------------------------\r
  75         // the defaults for all charts\r
  76 \r
  77         NETDATA.chartDefaults = {\r
  78                 host: NETDATA.serverDefault,    // the server to get data from\r
  79                 width: 100,                                             // the chart width\r
  80                 height: 20,                                             // the chart height\r
  81                 library: 'peity',                               // the graphing library to use\r
  82                 method: 'average',                              // the grouping method\r
  83                 before: 0,                                              // panning\r
  84                 after: -600,                                    // panning\r
  85                 point_width: 1,                                 // the detail of the chart\r
  86         }\r
  87 \r
  88         NETDATA.all_url = 'all2.js';\r
  89         NETDATA_idle_between_charts = 50;\r
  90         NETDATA.debug = 1;\r
  91 \r
  92         if(NETDATA.debug) console.log('welcome to NETDATA');\r
  93 \r
  94 \r
  95         // ----------------------------------------------------------------------------------------------------------------\r
  96         // Error Handling\r
  97 \r
  98         NETDATA.errorCodes = {\r
  99                 100: { message: "Cannot load chart library", alert: true },\r
 100                 101: { message: "Cannot load jQuery", alert: true },\r
 101                 402: { message: "Chart library not found", alert: false },\r
 102                 404: { message: "Chart not found", alert: false },\r
 103         };\r
 104         NETDATA.errorLast = {\r
 105                 code: 0,\r
 106                 message: "",\r
 107                 datetime: 0,\r
 108         };\r
 109 \r
 110         NETDATA.error = function(code, msg) {\r
 111                 NETDATA.errorLast.code = code;\r
 112                 NETDATA.errorLast.message = msg;\r
 113                 NETDATA.errorLast.datetime = new Date().getTime();\r
 114 \r
 115                 console.log("ERROR " + code + ": " + NETDATA.errorCodes[code].message + ": " + msg);\r
 116 \r
 117                 if(NETDATA.errorCodes[code].alert)\r
 118                         alert("ERROR " + code + ": " + NETDATA.errorCodes[code].message + ": " + msg);\r
 119         }\r
 120 \r
 121         NETDATA.errorReset = function() {\r
 122                 NETDATA.errorLast.code = 0;\r
 123                 NETDATA.errorLast.message = "You are doing fine!";\r
 124                 NETDATA.errorLast.datetime = 0;\r
 125         }\r
 126 \r
 127         NETDATA.messageInABox = function(div, width, height, message) {\r
 128                 div.innerHTML = '<table border="0"><tr><td width="' + width + '" height="' + height\r
 129                         + '" valign="middle" align="center">'\r
 130                         + message\r
 131                         + '</td></tr></table>';\r
 132         }\r
 133 \r
 134         // ----------------------------------------------------------------------------------------------------------------\r
 135         // Load a script without jquery\r
 136         // This is used to load jquery - after it is loaded, we use jquery\r
 137 \r
 138         NETDATA._loadjQuery = function(callback) {\r
 139                 if(typeof jQuery == 'undefined') {\r
 140                         var script = document.createElement('script');\r
 141                         script.type = 'text/javascript';\r
 142                         script.async = true;            \r
 143                         script.src = NETDATA.jQuery;\r
 144                         \r
 145                         // script.onabort = onError;\r
 146                         script.onerror = function(err, t) { NETDATA.error(101, NETDATA.jQuery); };\r
 147                         if(typeof callback == "function")\r
 148                                 script.onload = callback;\r
 149                         \r
 150                         var s = document.getElementsByTagName('script')[0];\r
 151                         s.parentNode.insertBefore(script, s);\r
 152                 }\r
 153                 else if(typeof callback == "function")\r
 154                         callback();\r
 155         }\r
 156 \r
 157         NETDATA.generateDataURL = function(args) {\r
 158                 // build the data URL\r
 159                 var url = args.host + args.url;\r
 160                 url += "&points=";\r
 161                 url += args.points.toString();\r
 162                 url += "&group=";\r
 163                 url += args.method;\r
 164                 url += "&after=";\r
 165                 url += args.after || "0";\r
 166                 url += "&before=";\r
 167                 url += args.before || "0";\r
 168                 url += "&options=" + NETDATA.chartLibraries[args.library].options + '|';\r
 169                 url += (args.non_zero)?"nonzero":"";\r
 170                 url += "&format=" + NETDATA.chartLibraries[args.library].format;\r
 171 \r
 172                 if(args.dimensions)\r
 173                         url += "&dimensions=" + args.dimensions;\r
 174 \r
 175                 if(NETDATA.debug) console.log('generateDataURL(' + args + ') = ' + url );\r
 176                 return url;\r
 177         }\r
 178 \r
 179         NETDATA.loadCharts = function(targets, index, callback) {\r
 180                 if(NETDATA.debug) console.log('loadCharts(<targets, ' + index + ')');\r
 181 \r
 182                 var target = targets.get(index);\r
 183 \r
 184                 if(target == null) {\r
 185                         console.log('loaded all charts');\r
 186                         callback();\r
 187                 }\r
 188                 else {\r
 189                         var self = $(target);\r
 190 \r
 191                         if(!self.data('loaded')) {\r
 192                                 var id = self.data('netdata');\r
 193 \r
 194                                 var host = self.data('host') || NETDATA.chartDefaults.host;\r
 195                                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 196                                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 197                                 var method = self.data('method') || NETDATA.chartDefaults.method;\r
 198                                 var after = self.data('after') || NETDATA.chartDefaults.after;\r
 199                                 var before = self.data('before') || NETDATA.chartDefaults.before;\r
 200                                 var host = self.data('host') || NETDATA.chartDefaults.host;\r
 201                                 var library = self.data('chart-library') || NETDATA.chartDefaults.library;\r
 202                                 var dimensions = self.data('dimensions') || null;\r
 203 \r
 204                                 if(typeof NETDATA.chartLibraries[library] == 'undefined') {\r
 205                                         NETDATA.error(402, library);\r
 206                                         NETDATA.messageInABox(target, width, height, 'chart library "' + library + '" is not found');\r
 207                                         self.data('enabled', false);\r
 208                                         NETDATA.loadCharts(targets, ++index, callback);\r
 209                                 }\r
 210                                 else {\r
 211                                         var url = host + "/api/v1/chart?chart=" + id; \r
 212 \r
 213                                         $.ajax( {\r
 214                                                 url:  url,\r
 215                                                 crossDomain: true\r
 216                                         })\r
 217                                         .done(function(chart) {\r
 218 \r
 219                                                 var point_width = self.data('point-width') || NETDATA.chartLibraries[library].pixels;\r
 220                                                 var points = self.data('points') || Math.round(width / point_width);\r
 221 \r
 222                                                 var url = NETDATA.generateDataURL({\r
 223                                                         host: host,\r
 224                                                         url: chart.data_url,\r
 225                                                         dimensions: dimensions,\r
 226                                                         library: library,\r
 227                                                         method: method,\r
 228                                                         before: before,\r
 229                                                         points: points,\r
 230                                                         after: after,\r
 231                                                         non_zero: null\r
 232                                                 });\r
 233 \r
 234                                                 // done processing of this DIV\r
 235                                                 // store the processing result, in\r
 236                                                 // 'data' sections in the DIV\r
 237                                                 self\r
 238                                                         .data('chart', chart)\r
 239                                                         .data('chart-url', url)\r
 240                                                         .data('last-updated', 0)\r
 241                                                         .data('update-every', chart.update_every * 1000)\r
 242                                                         .data('enabled', true);\r
 243                                         })\r
 244                                         .fail(function() {\r
 245                                                 NETDATA.error(404, url);\r
 246                                                 NETDATA.messageInABox(target, width, height, 'chart "' + id + '" not found on url "' + url + '"');\r
 247                                                 self.data('enabled', false);\r
 248                                         })\r
 249                                         .always(function() {\r
 250                                                 NETDATA.loadCharts(targets, ++index, callback);\r
 251                                         });\r
 252                                 }\r
 253                         }\r
 254                 }\r
 255         }\r
 256 \r
 257         function netdataParsePageCharts() {\r
 258                 if(NETDATA.debug) console.log('processing web page defined charts');\r
 259 \r
 260                 // targets\r
 261                 // a list of all DIVs containing netdata charts\r
 262 \r
 263                 var targets = $('div[data-netdata]')\r
 264                 .bind('create', function(event, data) {\r
 265                         var self = $(this);\r
 266                         var lib = self.data('chart-library') || 'dygraph';\r
 267                         var method = lib + 'ChartCreate';\r
 268                         \r
 269                         console.log('Calling ' + method + '()');\r
 270                         NETDATA[method].apply(this, arguments);\r
 271                 })\r
 272                 .bind('update', function() {\r
 273                         var self = $(this);\r
 274                         var lib = self.data('chart-library') || 'dygraph';\r
 275                         var method = lib + 'ChartUpdate';\r
 276                         \r
 277                         console.log('Calling ' + method + '()');\r
 278                         NETDATA[method].apply(this, arguments);\r
 279                 });\r
 280 \r
 281                 NETDATA.loadCharts(targets, 0, function() {\r
 282                         // done processing all netdata DIVs in this page\r
 283                         // call the refresh handler\r
 284                         netdataRefreshTargets(targets, 0);\r
 285                 });\r
 286         }\r
 287 \r
 288         // ----------------------------------------------------------------------------------------------------------------\r
 289         // Charts Libraries Registration\r
 290 \r
 291         NETDATA.chartLibraries = {};\r
 292 \r
 293         NETDATA.registerChartLibrary = function(library, url, format, options, min_pixels_per_point) {\r
 294                 console.log("registering chart library: " + library);\r
 295 \r
 296                 NETDATA.chartLibraries[library] = {\r
 297                         initialized: new Date().getTime(),\r
 298                         url: url,\r
 299                         format: format,\r
 300                         options: options,\r
 301                         pixels: min_pixels_per_point\r
 302                 };\r
 303 \r
 304                 console.log(NETDATA.chartLibraries);\r
 305         }\r
 306 \r
 307         // ----------------------------------------------------------------------------------------------------------------\r
 308 \r
 309         //var chart = function() {\r
 310         //}\r
 311 \r
 312         //chart.prototype.color = function() {\r
 313         //      return 'red';\r
 314         //}\r
 315 \r
 316         //var c = new chart();\r
 317         //c.color();\r
 318 \r
 319         function netdataDownloadChartData(callback) {\r
 320                 var self = $(this);\r
 321                 var last = self.data('last-updated') || 0;\r
 322                 var every = self.data('update-every') || 1;\r
 323 \r
 324                 // check if this chart has to be refreshed now\r
 325                 var now = new Date().getTime();\r
 326                 if(last + every > now) {\r
 327                         if(typeof callback == 'function')\r
 328                                 callback();\r
 329                 }\r
 330                 else {\r
 331                         var url = self.data('chart-url');\r
 332 \r
 333                         if(NETDATA.debug) console.log('netdataDownloadChartData(): downloading ' + url);\r
 334 \r
 335                         $.ajax( {\r
 336                                 url: url,\r
 337                                 crossDomain: true\r
 338                         })\r
 339                         .then(function(data) {\r
 340                                 //var result = $.map(data.rows, function(item) {\r
 341                                         // get from the 3rd column the 'v' member\r
 342                                         //return item.c[3].v;\r
 343                                 //});\r
 344                                 \r
 345                                 // since we downloaded the data\r
 346                                 // update the last-updated time to prevent\r
 347                                 // another download too soon\r
 348                                 self.data('last-updated', new Date().getTime());\r
 349 \r
 350                                 // render it\r
 351                                 var created = self.data('created');\r
 352                                 self.trigger((created ? 'update' : 'create'), [data]).data('created', true)\r
 353                         })\r
 354                         .fail(function() {\r
 355                                 console.log('failed to download chart data');\r
 356                         })\r
 357                         .always(function() {\r
 358                                 var last = self.data('last-updated');\r
 359                                 var now = new Date().getTime();\r
 360                                 var dt = now - last;\r
 361                                 self.data('refresh-dt', dt);\r
 362 \r
 363                                 var element_name = self.data('dt-element-name') || null;\r
 364                                 if(element_name) {\r
 365                                         var element = document.getElementById(element_name) || null;\r
 366                                         if(element) {\r
 367                                                 element.innerHTML = dt.toString();\r
 368                                         }\r
 369                                 }\r
 370 \r
 371                                 if(typeof callback == 'function')\r
 372                                         callback();\r
 373                         });\r
 374                 }\r
 375         };\r
 376 \r
 377         function netdataRefreshTargets(targets, index) {\r
 378                 // if(NETDATA.debug) console.log('netdataRefreshTargets(<targets, ' + index + ')');\r
 379 \r
 380                 var target = targets.get(index);\r
 381 \r
 382                 if(target == null) {\r
 383                         console.log('restart');\r
 384 \r
 385                         // finished, restart\r
 386                         setTimeout(function() {\r
 387                                 netdataRefreshTargets(targets, 0);\r
 388                         }, 1000);\r
 389                 }\r
 390                 else {\r
 391                         var self = $(target);\r
 392 \r
 393                         if(!self.data('enabled')) {\r
 394                                 netdataRefreshTargets(targets, ++index);\r
 395                         }\r
 396                         else {\r
 397                                 setTimeout(function() {\r
 398                                         netdataDownloadChartData.call(target, function() {\r
 399                                                 netdataRefreshTargets(targets, ++index);\r
 400                                         });\r
 401                                 }, NETDATA_idle_between_charts);\r
 402                         }\r
 403                 }\r
 404         }\r
 405 \r
 406 \r
 407         // ----------------------------------------------------------------------------------------------------------------\r
 408         // piety\r
 409 \r
 410         NETDATA.peityInitialize = function(callback) {\r
 411                 if(typeof netdataStopPeity == 'undefined') {\r
 412                         $.getScript(NETDATA.peity_js)\r
 413                                 .done(function() {\r
 414                                         NETDATA.registerChartLibrary('peity', NETDATA.peity_js, 'ssvcomma', 'null2zero|flip|min2max', 2);\r
 415                                 })\r
 416                                 .fail(function() {\r
 417                                         NETDATA.error(100, NETDATA.peity_js);\r
 418                                 })\r
 419                                 .always(function() {\r
 420                                         if(typeof callback == "function")\r
 421                                                 callback();\r
 422                                 })\r
 423                 }\r
 424                 else if(typeof callback == "function")\r
 425                         callback();\r
 426         };\r
 427 \r
 428         NETDATA.peityChartUpdate = function(event, data) {\r
 429                 var self = $(this);\r
 430                 var instance = self.html(data).not('[data-created]');\r
 431                 instance.change();\r
 432         }\r
 433 \r
 434         NETDATA.peityChartCreate = function(event, data) {\r
 435                 var self = $(this);\r
 436                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 437                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 438                 var instance = self.html(data).not('[data-created]');\r
 439 \r
 440                 instance.peity('line', {\r
 441                         width: width,\r
 442                         height: height\r
 443                 })\r
 444                 .data('created', true);\r
 445         }\r
 446 \r
 447         // ----------------------------------------------------------------------------------------------------------------\r
 448         // sparkline\r
 449 \r
 450         NETDATA.sparklineInitialize = function(callback) {\r
 451                 if(typeof netdataStopSparkline == 'undefined') {\r
 452                         $.getScript(NETDATA.sparkline_js)\r
 453                                 .done(function() {\r
 454                                         NETDATA.registerChartLibrary('sparkline', NETDATA.sparkline_js, 'array', 'flip|min2max', 2);\r
 455                                 })\r
 456                                 .fail(function() {\r
 457                                         NETDATA.error(100, NETDATA.sparkline_js);\r
 458                                 })\r
 459                                 .always(function() {\r
 460                                         if(typeof callback == "function")\r
 461                                                 callback();\r
 462                                 })\r
 463                 }\r
 464                 else if(typeof callback == "function")\r
 465                         callback();\r
 466         };\r
 467 \r
 468         NETDATA.sparklineChartUpdate = function(event, data) {\r
 469                 var self = $(this);\r
 470                 var options = self.data('sparkline-options');\r
 471                 self.sparkline(data, options);\r
 472         }\r
 473 \r
 474         NETDATA.sparklineChartCreate = function(event, data) {\r
 475                 var self = $(this);\r
 476                 var chart = self.data('chart');\r
 477                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 478                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 479                 var type = self.data('sparkline-type') || 'line';\r
 480                 var lineColor = self.data('sparkline-lineColor') || undefined;\r
 481                 var fillColor = self.data('sparkline-fillColor') || (chart.chart_type == 'line')?'#FFF':undefined;\r
 482                 var chartRangeMin = self.data('sparkline-chartRangeMin') || undefined;\r
 483                 var chartRangeMax = self.data('sparkline-chartRangeMax') || undefined;\r
 484                 var composite = self.data('sparkline-composite') || undefined;\r
 485                 var enableTagOptions = self.data('sparkline-enableTagOptions') || undefined;\r
 486                 var tagOptionPrefix = self.data('sparkline-tagOptionPrefix') || undefined;\r
 487                 var tagValuesAttribute = self.data('sparkline-tagValuesAttribute') || undefined;\r
 488                 var disableHiddenCheck = self.data('sparkline-disableHiddenCheck') || undefined;\r
 489                 var defaultPixelsPerValue = self.data('sparkline-defaultPixelsPerValue') || undefined;\r
 490                 var spotColor = self.data('sparkline-spotColor') || undefined;\r
 491                 var minSpotColor = self.data('sparkline-minSpotColor') || undefined;\r
 492                 var maxSpotColor = self.data('sparkline-maxSpotColor') || undefined;\r
 493                 var spotRadius = self.data('sparkline-spotRadius') || undefined;\r
 494                 var valueSpots = self.data('sparkline-valueSpots') || undefined;\r
 495                 var highlightSpotColor = self.data('sparkline-highlightSpotColor') || undefined;\r
 496                 var highlightLineColor = self.data('sparkline-highlightLineColor') || undefined;\r
 497                 var lineWidth = self.data('sparkline-lineWidth') || undefined;\r
 498                 var normalRangeMin = self.data('sparkline-normalRangeMin') || undefined;\r
 499                 var normalRangeMax = self.data('sparkline-normalRangeMax') || undefined;\r
 500                 var drawNormalOnTop = self.data('sparkline-drawNormalOnTop') || undefined;\r
 501                 var xvalues = self.data('sparkline-xvalues') || undefined;\r
 502                 var chartRangeClip = self.data('sparkline-chartRangeClip') || undefined;\r
 503                 var xvalues = self.data('sparkline-xvalues') || undefined;\r
 504                 var chartRangeMinX = self.data('sparkline-chartRangeMinX') || undefined;\r
 505                 var chartRangeMaxX = self.data('sparkline-chartRangeMaxX') || undefined;\r
 506                 var disableInteraction = self.data('sparkline-disableInteraction') || false;\r
 507                 var disableTooltips = self.data('sparkline-disableTooltips') || false;\r
 508                 var disableHighlight = self.data('sparkline-disableHighlight') || false;\r
 509                 var highlightLighten = self.data('sparkline-highlightLighten') || 1.4;\r
 510                 var highlightColor = self.data('sparkline-highlightColor') || undefined;\r
 511                 var tooltipContainer = self.data('sparkline-tooltipContainer') || undefined;\r
 512                 var tooltipClassname = self.data('sparkline-tooltipClassname') || undefined;\r
 513                 var tooltipFormat = self.data('sparkline-tooltipFormat') || undefined;\r
 514                 var tooltipPrefix = self.data('sparkline-tooltipPrefix') || undefined;\r
 515                 var tooltipSuffix = self.data('sparkline-tooltipSuffix') || ' ' + chart.units;\r
 516                 var tooltipSkipNull = self.data('sparkline-tooltipSkipNull') || true;\r
 517                 var tooltipValueLookups = self.data('sparkline-tooltipValueLookups') || undefined;\r
 518                 var tooltipFormatFieldlist = self.data('sparkline-tooltipFormatFieldlist') || undefined;\r
 519                 var tooltipFormatFieldlistKey = self.data('sparkline-tooltipFormatFieldlistKey') || undefined;\r
 520                 var numberFormatter = self.data('sparkline-numberFormatter') || function(n){ return n.toFixed(2); };\r
 521                 var numberDigitGroupSep = self.data('sparkline-numberDigitGroupSep') || undefined;\r
 522                 var numberDecimalMark = self.data('sparkline-numberDecimalMark') || undefined;\r
 523                 var numberDigitGroupCount = self.data('sparkline-numberDigitGroupCount') || undefined;\r
 524                 var animatedZooms = self.data('sparkline-animatedZooms') || false;\r
 525  \r
 526                 var options = {\r
 527                         type: type,\r
 528                         lineColor: lineColor,\r
 529                         fillColor: fillColor,\r
 530                         chartRangeMin: chartRangeMin,\r
 531                         chartRangeMax: chartRangeMax,\r
 532                         composite: composite,\r
 533                         enableTagOptions: enableTagOptions,\r
 534                         tagOptionPrefix: tagOptionPrefix,\r
 535                         tagValuesAttribute: tagValuesAttribute,\r
 536                         disableHiddenCheck: disableHiddenCheck,\r
 537                         defaultPixelsPerValue: defaultPixelsPerValue,\r
 538                         spotColor: spotColor,\r
 539                         minSpotColor: minSpotColor,\r
 540                         maxSpotColor: maxSpotColor,\r
 541                         spotRadius: spotRadius,\r
 542                         valueSpots: valueSpots,\r
 543                         highlightSpotColor: highlightSpotColor,\r
 544                         highlightLineColor: highlightLineColor,\r
 545                         lineWidth: lineWidth,\r
 546                         normalRangeMin: normalRangeMin,\r
 547                         normalRangeMax: normalRangeMax,\r
 548                         drawNormalOnTop: drawNormalOnTop,\r
 549                         xvalues: xvalues,\r
 550                         chartRangeClip: chartRangeClip,\r
 551                         chartRangeMinX: chartRangeMinX,\r
 552                         chartRangeMaxX: chartRangeMaxX,\r
 553                         disableInteraction: disableInteraction,\r
 554                         disableTooltips: disableTooltips,\r
 555                         disableHighlight: disableHighlight,\r
 556                         highlightLighten: highlightLighten,\r
 557                         highlightColor: highlightColor,\r
 558                         tooltipContainer: tooltipContainer,\r
 559                         tooltipClassname: tooltipClassname,\r
 560                         tooltipChartTitle: chart.title,\r
 561                         tooltipFormat: tooltipFormat,\r
 562                         tooltipPrefix: tooltipPrefix,\r
 563                         tooltipSuffix: tooltipSuffix,\r
 564                         tooltipSkipNull: tooltipSkipNull,\r
 565                         tooltipValueLookups: tooltipValueLookups,\r
 566                         tooltipFormatFieldlist: tooltipFormatFieldlist,\r
 567                         tooltipFormatFieldlistKey: tooltipFormatFieldlistKey,\r
 568                         numberFormatter: numberFormatter,\r
 569                         numberDigitGroupSep: numberDigitGroupSep,\r
 570                         numberDecimalMark: numberDecimalMark,\r
 571                         numberDigitGroupCount: numberDigitGroupCount,\r
 572                         animatedZooms: animatedZooms,\r
 573                         width: width,\r
 574                         height: height\r
 575                 };\r
 576 \r
 577                 self.sparkline(data, options);\r
 578                 self.data('sparkline-options', options)\r
 579                 .data('created', true);\r
 580         };\r
 581 \r
 582         // ----------------------------------------------------------------------------------------------------------------\r
 583         // dygraph\r
 584 \r
 585         NETDATA.dygraphAllCharts = [];\r
 586         NETDATA.dygraphInitSync = function(callback) {\r
 587                 //$.getScript(NETDATA.serverDefault + 'dygraph-synchronizer.js')\r
 588                 //      .always(function() {\r
 589                                 if(typeof callback == "function")\r
 590                                         callback();\r
 591                 //      })\r
 592         }\r
 593 \r
 594         NETDATA.dygraphSync = null;\r
 595         NETDATA.dygraphSyncAll = function() {\r
 596                 if(NETDATA.dygraphSync) {\r
 597                         NETDATA.dygraphSync.detach();\r
 598                         NETDATA.dygraphSync = null;\r
 599                 }\r
 600 \r
 601                 NETDATA.dygraphSync = Dygraph.synchronize(NETDATA.dygraphAllCharts, {\r
 602                         selection: true,\r
 603                         zoom: false\r
 604                 });\r
 605         }\r
 606 \r
 607         NETDATA.dygraphInitialize = function(callback) {\r
 608                 if(typeof netdataStopDygraph == 'undefined') {\r
 609                         $.getScript(NETDATA.dygraph_js)\r
 610                                 .done(function() {\r
 611                                         NETDATA.registerChartLibrary('dygraph', NETDATA.dygraph_js, 'json', 'ms|flip', 2);\r
 612                                 })\r
 613                                 .fail(function() {\r
 614                                         NETDATA.error(100, NETDATA.dygraph_js);\r
 615                                 })\r
 616                                 .always(function() {\r
 617                                         NETDATA.dygraphInitSync(callback);\r
 618                                 })\r
 619                 }\r
 620                 else if(typeof callback == "function")\r
 621                         callback();\r
 622         };\r
 623 \r
 624         NETDATA.dygraphChartUpdate = function(event, data) {\r
 625                 var self = $(this);\r
 626                 var dygraph = self.data('dygraph-instance');\r
 627 \r
 628                 if(typeof data.update_every != 'undefined')\r
 629                         self.data('update-every', data.update_every * 1000);\r
 630 \r
 631                 if(dygraph != null) {\r
 632                         console.log('updating dygraphs');\r
 633                         dygraph.updateOptions( { 'file': data.data, 'labels': data.labels } );\r
 634                 }\r
 635                 else\r
 636                         console.log('not updating dygraphs');\r
 637         };\r
 638  \r
 639         NETDATA.dygraphChartCreate = function(event, data) {\r
 640                 var self = $(this);\r
 641                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 642                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 643                 var chart = self.data('chart');\r
 644                 var title = self.data('dygraph-title') || chart.title;\r
 645                 var titleHeight = self.data('dygraph-titleHeight') || 20;\r
 646                 var labelsDiv = self.data('dygraph-labelsDiv') || undefined;\r
 647                 var connectSeparatedPoints = self.data('dygraph-connectSeparatedPoints') || false;\r
 648                 var yLabelWidth = self.data('dygraph-yLabelWidth') || 12;\r
 649                 var stackedGraph = self.data('dygraph-stackedGraph') || (chart.chart_type == 'stacked')?true:false;\r
 650                 var stackedGraphNaNFill = self.data('dygraph-stackedGraphNaNFill') || 'none';\r
 651                 var hideOverlayOnMouseOut = self.data('dygraph-hideOverlayOnMouseOut') || true;\r
 652                 var fillGraph = self.data('dygraph-fillGraph') || (chart.chart_type == 'area')?true:false;\r
 653                 var drawPoints = self.data('dygraph-drawPoints') || false;\r
 654                 var labelsDivStyles = self.data('dygraph-labelsDivStyles') || { 'fontSize':'10' };\r
 655                 var labelsDivWidth = self.data('dygraph-labelsDivWidth') || 250;\r
 656                 var labelsSeparateLines = self.data('dygraph-labelsSeparateLines') || false;\r
 657                 var labelsShowZeroValues = self.data('dygraph-labelsShowZeroValues') || true;\r
 658                 var legend = self.data('dygraph-legend') || 'onmouseover';\r
 659                 var showLabelsOnHighlight = self.data('dygraph-showLabelsOnHighlight') || true;\r
 660                 var gridLineColor = self.data('dygraph-gridLineColor') || '#EEE';\r
 661                 var axisLineColor = self.data('dygraph-axisLineColor') || '#EEE';\r
 662                 var maxNumberWidth = self.data('dygraph-maxNumberWidth') || 8;\r
 663                 var sigFigs = self.data('dygraph-sigFigs') || null;\r
 664                 var digitsAfterDecimal = self.data('dygraph-digitsAfterDecimal') || 2;\r
 665                 var axisLabelFontSize = self.data('dygraph-axisLabelFontSize') || 10;\r
 666                 var axisLineWidth = self.data('dygraph-axisLineWidth') || 0.3;\r
 667                 var drawAxis = self.data('dygraph-drawAxis') || true;\r
 668                 var strokeWidth = self.data('dygraph-strokeWidth') || 1.0;\r
 669                 var drawGapEdgePoints = self.data('dygraph-drawGapEdgePoints') || true;\r
 670                 var colors = self.data('dygraph-colors') || NETDATA.colors;\r
 671                 var pointSize = self.data('dygraph-pointSize') || 1;\r
 672                 var stepPlot = self.data('dygraph-stepPlot') || false;\r
 673                 var strokeBorderColor = self.data('dygraph-strokeBorderColor') || 'white';\r
 674                 var strokeBorderWidth = self.data('dygraph-strokeBorderWidth') || (chart.chart_type == 'stacked')?1.0:0.0;\r
 675                 var strokePattern = self.data('dygraph-strokePattern') || undefined;\r
 676                 var highlightCircleSize = self.data('dygraph-highlightCircleSize') || 3;\r
 677                 var highlightSeriesOpts = self.data('dygraph-highlightSeriesOpts') || { strokeWidth: 1.5 };\r
 678                 var highlightSeriesBackgroundAlpha = self.data('dygraph-highlightSeriesBackgroundAlpha') || (chart.chart_type == 'stacked')?0.7:0.5;\r
 679                 var pointClickCallback = self.data('dygraph-pointClickCallback') || undefined;\r
 680                 var showRangeSelector = self.data('dygraph-showRangeSelector') || false;\r
 681                 var showRoller = self.data('dygraph-showRoller') || false;\r
 682                 var valueFormatter = self.data('dygraph-valueFormatter') || undefined; //function(x){ return x.toFixed(2); };\r
 683                 var rightGap = self.data('dygraph-rightGap') || 5;\r
 684                 var drawGrid = self.data('dygraph-drawGrid') || true;\r
 685                 var drawXGrid = self.data('dygraph-drawXGrid') || undefined;\r
 686                 var drawYGrid = self.data('dygraph-drawYGrid') || undefined;\r
 687                 var gridLinePattern = self.data('dygraph-gridLinePattern') || null;\r
 688                 var gridLineWidth = self.data('dygraph-gridLineWidth') || 0.3;\r
 689   \r
 690                 var options = {\r
 691                         title: title,\r
 692                         titleHeight: titleHeight,\r
 693                         ylabel: chart.units,\r
 694                         yLabelWidth: yLabelWidth,\r
 695                         connectSeparatedPoints: connectSeparatedPoints,\r
 696                         drawPoints: drawPoints,\r
 697                         fillGraph: fillGraph,\r
 698                         stackedGraph: stackedGraph,\r
 699                         stackedGraphNaNFill: stackedGraphNaNFill,\r
 700                         drawGrid: drawGrid,\r
 701                         drawXGrid: drawXGrid,\r
 702                         drawYGrid: drawYGrid,\r
 703                         gridLinePattern: gridLinePattern,\r
 704                         gridLineWidth: gridLineWidth,\r
 705                         gridLineColor: gridLineColor,\r
 706                         axisLineColor: axisLineColor,\r
 707                         axisLineWidth: axisLineWidth,\r
 708                         drawAxis: drawAxis,\r
 709                         hideOverlayOnMouseOut: hideOverlayOnMouseOut,\r
 710                         labelsDiv: labelsDiv,\r
 711                         labelsDivStyles: labelsDivStyles,\r
 712                         labelsDivWidth: labelsDivWidth,\r
 713                         labelsSeparateLines: labelsSeparateLines,\r
 714                         labelsShowZeroValues: labelsShowZeroValues,\r
 715                         labelsKMB: false,\r
 716                         labelsKMG2: false,\r
 717                         legend: legend,\r
 718                         showLabelsOnHighlight: showLabelsOnHighlight,\r
 719                         maxNumberWidth: maxNumberWidth,\r
 720                         sigFigs: sigFigs,\r
 721                         digitsAfterDecimal: digitsAfterDecimal,\r
 722                         axisLabelFontSize: axisLabelFontSize,\r
 723                         colors: colors,\r
 724                         strokeWidth: strokeWidth,\r
 725                         drawGapEdgePoints: drawGapEdgePoints,\r
 726                         pointSize: pointSize,\r
 727                         stepPlot: stepPlot,\r
 728                         strokeBorderColor: strokeBorderColor,\r
 729                         strokeBorderWidth: strokeBorderWidth,\r
 730                         strokePattern: strokePattern,\r
 731                         highlightCircleSize: highlightCircleSize,\r
 732                         highlightSeriesOpts: highlightSeriesOpts,\r
 733                         highlightSeriesBackgroundAlpha: highlightSeriesBackgroundAlpha,\r
 734                         pointClickCallback: pointClickCallback,\r
 735                         showRangeSelector: showRangeSelector,\r
 736                         showRoller: showRoller,\r
 737                         valueFormatter: valueFormatter,\r
 738                         rightGap: rightGap,\r
 739                         width: width,\r
 740                         height: height,\r
 741                         labels: data.labels,\r
 742                         axes: {\r
 743                                 x: {\r
 744                                         pixelsPerLabel: 50,\r
 745                                         ticker: Dygraph.dateTicker,\r
 746                                         axisLabelFormatter: function (d, gran) {\r
 747                                                 return Dygraph.zeropad(d.getHours()) + ":" + Dygraph.zeropad(d.getMinutes()) + ":" + Dygraph.zeropad(d.getSeconds());\r
 748                                         },\r
 749                                         valueFormatter :function (ms) {\r
 750                                                 var d = new Date(ms);\r
 751                                                 return Dygraph.zeropad(d.getHours()) + ":" + Dygraph.zeropad(d.getMinutes()) + ":" + Dygraph.zeropad(d.getSeconds());\r
 752                                         }\r
 753                                 },\r
 754                                 y: {\r
 755                                         pixelsPerLabel: 15,\r
 756                                 }\r
 757                         }\r
 758                 };\r
 759 \r
 760                 self.html('<div id="dygraph-' + chart.id + '"></div>');\r
 761 \r
 762                 var dchart = new Dygraph(document.getElementById('dygraph-' + chart.id),\r
 763                         data.data, options);\r
 764 \r
 765                 self.data('dygraph-instance', dchart)\r
 766                 .data('dygraph-options', options)\r
 767                 .data('created', true);\r
 768 \r
 769                 //NETDATA.dygraphAllCharts.push(dchart);\r
 770                 //if(NETDATA.dygraphAllCharts.length > 1)\r
 771                 //      NETDATA.dygraphSyncAll();\r
 772         };\r
 773 \r
 774         // ----------------------------------------------------------------------------------------------------------------\r
 775         // morris\r
 776 \r
 777         NETDATA.morrisInitialize = function(callback) {\r
 778                 if(typeof netdataStopMorris == 'undefined') {\r
 779                         var fileref = document.createElement("link");\r
 780                         fileref.setAttribute("rel", "stylesheet");\r
 781                         fileref.setAttribute("type", "text/css");\r
 782                         fileref.setAttribute("href", NETDATA.morris_css);\r
 783 \r
 784                         if (typeof fileref != "undefined")\r
 785                                 document.getElementsByTagName("head")[0].appendChild(fileref);\r
 786 \r
 787                         $.getScript(NETDATA.morris_js)\r
 788                                 .done(function() {\r
 789                                         NETDATA.registerChartLibrary('morris', NETDATA.morris_js, 'json', 'objectrows|ms', 10);\r
 790                                 })\r
 791                                 .fail(function() {\r
 792                                         NETDATA.error(100, NETDATA.morris_js);\r
 793                                 })\r
 794                                 .always(function() {\r
 795                                         if(typeof callback == "function")\r
 796                                                 callback();\r
 797                                 })\r
 798                 }\r
 799                 else if(typeof callback == "function")\r
 800                         callback();\r
 801         };\r
 802 \r
 803         NETDATA.morrisChartUpdate = function(event, data) {\r
 804                 var self = $(this);\r
 805                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 806                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 807                 var morris = self.data('morris-instance');\r
 808 \r
 809                 if(typeof data.update_every != 'undefined')\r
 810                         self.data('update-every', data.update_every * 1000);\r
 811 \r
 812                 if(morris != null) {\r
 813                         console.log('updating morris');\r
 814                         morris.setData(data.data);\r
 815                 }\r
 816                 else\r
 817                         console.log('not updating morris');\r
 818         };\r
 819 \r
 820         NETDATA.morrisChartCreate = function(event, data) {\r
 821                 var self = $(this);\r
 822                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 823                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 824                 var chart = self.data('chart');\r
 825                 \r
 826                 self.html('<div id="morris-' + chart.id + '" style="width: ' + width + 'px; height: ' + height + 'px;"></div>');\r
 827 \r
 828                 // remove the 'time' element from the labels\r
 829                 data.labels.splice(0, 1);\r
 830 \r
 831                 var options = {\r
 832                                 element: 'morris-' + chart.id,\r
 833                                 data: data.data,\r
 834                                 xkey: 'time',\r
 835                                 ykeys: data.labels,\r
 836                                 labels: data.labels,\r
 837                                 lineWidth: 2,\r
 838                                 pointSize: 2,\r
 839                                 smooth: true,\r
 840                                 hideHover: 'auto',\r
 841                                 parseTime: true,\r
 842                                 continuousLine: false,\r
 843                                 behaveLikeLine: false,\r
 844                                 width: width,\r
 845                                 height: height\r
 846                 };\r
 847 \r
 848                 var morris;\r
 849                 if(chart.chart_type == 'line')\r
 850                         morris = new Morris.Line(options);\r
 851 \r
 852                 else if(chart.chart_type == 'area') {\r
 853                         options.behaveLikeLine = true;\r
 854                         morris = new Morris.Area(options);\r
 855                 }\r
 856                 else // stacked\r
 857                         morris = new Morris.Area(options);\r
 858 \r
 859                 self.data('morris-instance', morris)\r
 860                 .data('created', true);\r
 861         };\r
 862 \r
 863         // ----------------------------------------------------------------------------------------------------------------\r
 864         // raphael\r
 865 \r
 866         NETDATA.raphaelInitialize = function(callback) {\r
 867                 if(typeof netdataStopRaphael == 'undefined') {\r
 868                         $.getScript(NETDATA.raphael_js)\r
 869                                 .done(function() {\r
 870                                         NETDATA.registerChartLibrary('raphael', NETDATA.raphael_js, 'json', 'flip|min2max', 1);\r
 871                                 })\r
 872                                 .fail(function() {\r
 873                                         NETDATA.error(100, NETDATA.raphael_js);\r
 874                                 })\r
 875                                 .always(function() {\r
 876                                         if(typeof callback == "function")\r
 877                                                 callback();\r
 878                                 })\r
 879                 }\r
 880                 else if(typeof callback == "function")\r
 881                         callback();\r
 882         };\r
 883 \r
 884         NETDATA.raphaelChartUpdate = function(event, data) {\r
 885                 var self = $(this);\r
 886                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 887                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 888                 \r
 889                 self.raphael(data, {\r
 890                         width: width,\r
 891                         height: height\r
 892                 })\r
 893         };\r
 894 \r
 895         NETDATA.raphaelChartCreate = function(event, data) {\r
 896                 var self = $(this);\r
 897                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 898                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 899                 \r
 900                 self.raphael(data, {\r
 901                         width: width,\r
 902                         height: height\r
 903                 })\r
 904                 .data('created', true);\r
 905         };\r
 906 \r
 907         // ----------------------------------------------------------------------------------------------------------------\r
 908         // google charts\r
 909 \r
 910         NETDATA.googleInitialize = function(callback) {\r
 911                 if(typeof netdataStopGoogleCharts == 'undefined' && typeof google != 'undefined') {\r
 912                         NETDATA.registerChartLibrary('google', NETDATA.google_js, 'datatable', '', 3);\r
 913                         if(typeof callback == "function")\r
 914                                 callback();\r
 915                 }\r
 916                 else if(typeof callback == "function")\r
 917                         callback();\r
 918         };\r
 919 \r
 920         NETDATA.googleChartUpdate = function(event, data) {\r
 921                 var self = $(this);\r
 922                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 923                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 924                 var gchart = self.data('google-instance');\r
 925                 var options = self.data('google-options');\r
 926 \r
 927                 if(typeof data.update_every != 'undefined')\r
 928                         self.data('update-every', data.update_every * 1000);\r
 929 \r
 930                 var datatable = new google.visualization.DataTable(data);\r
 931 \r
 932                 gchart.draw(datatable, options);\r
 933         };\r
 934 \r
 935         NETDATA.googleChartCreate = function(event, data) {\r
 936                 var self = $(this);\r
 937                 var width = self.data('width') || NETDATA.chartDefaults.width;\r
 938                 var height = self.data('height') || NETDATA.chartDefaults.height;\r
 939                 var chart = self.data('chart');\r
 940                 \r
 941                 var datatable = new google.visualization.DataTable(data);\r
 942                 var gchart;\r
 943 \r
 944                 var options = {\r
 945                         width: width,\r
 946                         height: height,\r
 947                         lineWidth: 1,\r
 948                         title: chart.title,\r
 949                         fontSize: 11,\r
 950                         hAxis: {\r
 951                         //      title: "Time of Day",\r
 952                         //      format:'HH:mm:ss',\r
 953                                 viewWindowMode: 'maximized',\r
 954                                 slantedText: false,\r
 955                                 format:'HH:mm:ss',\r
 956                                 textStyle: {\r
 957                                         fontSize: 9\r
 958                                 },\r
 959                                 gridlines: {\r
 960                                         color: '#EEE'\r
 961                                 }\r
 962                         },\r
 963                         vAxis: {\r
 964                                 title: chart.units,\r
 965                                 viewWindowMode: 'pretty',\r
 966                                 minValue: -0.1,\r
 967                                 maxValue: 0.1,\r
 968                                 direction: 1,\r
 969                                 textStyle: {\r
 970                                         fontSize: 9\r
 971                                 },\r
 972                                 gridlines: {\r
 973                                         color: '#EEE'\r
 974                                 }\r
 975                         },\r
 976                         chartArea: {\r
 977                                 width: '65%',\r
 978                                 height: '80%'\r
 979                         },\r
 980                         focusTarget: 'category',\r
 981                         annotation: {\r
 982                                 '1': {\r
 983                                         style: 'line'\r
 984                                 }\r
 985                         },\r
 986                         pointsVisible: 0,\r
 987                         titlePosition: 'out',\r
 988                         titleTextStyle: {\r
 989                                 fontSize: 11\r
 990                         },\r
 991                         tooltip: {\r
 992                                 isHtml: false,\r
 993                                 ignoreBounds: true,\r
 994                                 textStyle: {\r
 995                                         fontSize: 9\r
 996                                 }\r
 997                         },\r
 998                         curveType: 'function',\r
 999                         areaOpacity: 0.3,\r
1000                         isStacked: false\r
1001                 };\r
1002 \r
1003                 switch(chart.chart_type) {\r
1004                         case "area":\r
1005                                 options.vAxis.viewWindowMode = 'maximized';\r
1006                                 gchart = new google.visualization.AreaChart(this);\r
1007                                 break;\r
1008 \r
1009                         case "stacked":\r
1010                                 options.isStacked = true;\r
1011                                 options.areaOpacity = 0.85;\r
1012                                 options.vAxis.viewWindowMode = 'maximized';\r
1013                                 options.vAxis.minValue = null;\r
1014                                 options.vAxis.maxValue = null;\r
1015                                 gchart = new google.visualization.AreaChart(this);\r
1016                                 break;\r
1017 \r
1018                         default:\r
1019                         case "line":\r
1020                                 options.lineWidth = 2;\r
1021                                 gchart = new google.visualization.LineChart(this);\r
1022                                 break;\r
1023                 }\r
1024 \r
1025                 gchart.draw(datatable, options);\r
1026 \r
1027                 self.data('google-instance', gchart)\r
1028                 .data('google-options', options)\r
1029                 .data('created', true);\r
1030         };\r
1031 \r
1032         // ----------------------------------------------------------------------------------------------------------------\r
1033         // load all libraries and initialize\r
1034 \r
1035         NETDATA.errorReset();\r
1036 \r
1037         NETDATA._loadjQuery(function() {                \r
1038                 NETDATA.raphaelInitialize(function() {\r
1039                         NETDATA.morrisInitialize(function() {\r
1040                                 NETDATA.peityInitialize(function() {\r
1041                                         NETDATA.sparklineInitialize(function() {\r
1042                                                 NETDATA.dygraphInitialize(function() {\r
1043                                                         NETDATA.googleInitialize(function() {\r
1044                                                                 netdataParsePageCharts();\r
1045                                                         }) // google\r
1046                                                 }) // dygraph.js\r
1047                                         }) // sparkline.js\r
1048                                 }) // piety.js\r
1049                         }) // morris.js\r
1050                 }) // raphael.js\r
1051         });\r
1052 \r
1053 })(window);\r
1054 \r