diff --git a/applications/luci-app-netdata/Makefile b/applications/luci-app-netdata/Makefile
new file mode 100755
index 0000000..c494e8f
--- /dev/null
+++ b/applications/luci-app-netdata/Makefile
@@ -0,0 +1,22 @@
+# Copyright (C) 2016 Openwrt.org
+# Copyright (C) 2020-2021 sirpdboy <herboy2008@gmail.com>
+# https://github.com/sirpdboy/luci-app-netdata for v 1.30.1 cn
+# This is free software, licensed under the Apache License, Version 2.0 .
+#
+
+include $(TOPDIR)/rules.mk
+
+LUCI_TITLE:=LuCI support for Netdata
+LUCI_DEPENDS:=+netdata
+LUCI_PKGARCH:=all
+PKG_VERSION:=1.0
+PKG_RELEASE:=20210610
+
+define Build/Compile
+endef
+
+
+include $(TOPDIR)/feeds/luci/luci.mk
+
+# call BuildPackage - OpenWrt buildroot signature
+
diff --git a/applications/luci-app-netdata/README.md b/applications/luci-app-netdata/README.md
new file mode 100755
index 0000000..06a486b
--- /dev/null
+++ b/applications/luci-app-netdata/README.md
@@ -0,0 +1,30 @@
+luci-app-netdata for OpenWRT/Lede
+
+
+Install to OpenWRT/LEDE
+
+git clone https://github.com/sirpdboy/luci-app-netdata
+
+cp -r luci-app-netdata LEDE_DIR/package/luci-app-netdata
+
+cd LEDE_DIR
+
+./scripts/feeds update -a
+
+./scripts/feeds install -a
+
+make menuconfig
+
+LuCI --->
+
+ 1. Collections --->
+
+ <*> luci
+
+ 3. Applications --->
+
+ <*> luci-app-netdata.........................LuCI support for Netdata
+
+
+make package/new/luci-app-netdata/compile V=s
+
diff --git a/applications/luci-app-netdata/luasrc/controller/netdata.lua b/applications/luci-app-netdata/luasrc/controller/netdata.lua
new file mode 100755
index 0000000..29d81e9
--- /dev/null
+++ b/applications/luci-app-netdata/luasrc/controller/netdata.lua
@@ -0,0 +1,12 @@
+module("luci.controller.netdata", package.seeall)
+
+function index()
+ if not (luci.sys.call("pidof netdata > /dev/null") == 0) then
+ return
+ end
+ local fs = require "nixio.fs"
+
+ entry({"admin","status","netdata"},template("netdata"),_("NetData"),10).leaf=true
+
+
+end
\ No newline at end of file
diff --git a/applications/luci-app-netdata/luasrc/model/cgi/netdate.lua b/applications/luci-app-netdata/luasrc/model/cgi/netdate.lua
new file mode 100755
index 0000000..134e2be
--- /dev/null
+++ b/applications/luci-app-netdata/luasrc/model/cgi/netdate.lua
@@ -0,0 +1,25 @@
+-- Copyright 2018 Nick Peng (pymumu@gmail.com)
+
+function index()
+
+
+o = Map("netdate", "<font color='green'>" .. translate("实时监控") .."</font>", "<font color='purple'>" .. translate( "强大的实时监控数据，需要中文版请点击：【升级中文版】") .."</font>")
+
+t = o:section(TypedSection, "netdate")
+t.anonymous = true
+t.description = translate(string.format("%s<br /><br />", status))
+
+t:tab("base",translate("Basic Settings"))
+
+e = t:taboption("base", Button, "restart", translate("手动更新"))
+e.inputtitle = translate("升级中文版")
+e.inputstyle = "reload"
+e.write = function()
+ luci.sys.call("/usr/share/netdata/netdatacn 2>&1 >/dev/null")
+ luci.http.redirect(luci.dispatcher.build_url("admin","status","netdata"))
+end
+
+t=o:section(TypedSection,"rss_rules",translate("技术支持"))
+t.anonymous = true
+t:append(Template("feedback"))
+return o
diff --git a/applications/luci-app-netdata/luasrc/view/netdata.htm b/applications/luci-app-netdata/luasrc/view/netdata.htm
new file mode 100755
index 0000000..159f8dc
--- /dev/null
+++ b/applications/luci-app-netdata/luasrc/view/netdata.htm
@@ -0,0 +1,22 @@
+<%#
+ Copyright 2008-2020 sirpdboy Wich <sirpdboy@qq.com>
+ https://github.com/sirpdboy/luci-app-netdata
+ Licensed to the public under the Apache License 2.0.
+-%>
+
+<%+header%>
+<div class="cbi-map">
+ <h2 name="content"><%=translate("NetData")%></h2>
+<script type="text/javascript">//<![CDATA[
+ function upnetdata(button) {
+
+ (new XHR()).post('<%=controller%>/admin/status/netdata/call', { token: '<%=token%>' }, check);
+ }
+//]]></script>
+
+ <iframe id="netdata" style="width: 100%; min-height: 1200px; border: none; border-radius: 3px;"></iframe>
+</div>
+<script type="text/javascript">
+ document.getElementById("netdata").src = window.location.protocol + "//" + window.location.hostname + ":19999";
+</script>
+<%+footer%>
diff --git a/applications/luci-app-netdata/po/zh-cn/netdata.po b/applications/luci-app-netdata/po/zh-cn/netdata.po
new file mode 100755
index 0000000..e8966b8
--- /dev/null
+++ b/applications/luci-app-netdata/po/zh-cn/netdata.po
@@ -0,0 +1,5 @@
+msgid ""
+msgstr "Content-Type: text/plain; charset=UTF-8"
+
+msgid "NetData"
+msgstr "实时监控"
diff --git a/applications/luci-app-netdata/readme.txt b/applications/luci-app-netdata/readme.txt
new file mode 100755
index 0000000..72da425
--- /dev/null
+++ b/applications/luci-app-netdata/readme.txt
@@ -0,0 +1,21 @@
+luci-app-netdata for OpenWRT/Lede(����)
+
+
+Install to OpenWRT/LEDE
+
+git clone https://github.com/sirpdboy/luci-app-netdata
+cp -r luci-app-netdata LEDE_DIR/package/luci-app-netdata
+
+cd LEDE_DIR
+./scripts/feeds update -a
+./scripts/feeds install -a
+
+make menuconfig
+LuCI --->
+ 1. Collections --->
+ <*> luci
+ 3. Applications --->
+ <*> luci-app-netdata.........................LuCI support for Netdata
+
+
+make package/luci-app-netdata/compile V=s
\ No newline at end of file
diff --git a/applications/luci-app-netdata/root/etc/netdata/apps_groups.conf b/applications/luci-app-netdata/root/etc/netdata/apps_groups.conf
new file mode 100755
index 0000000..d326be7
--- /dev/null
+++ b/applications/luci-app-netdata/root/etc/netdata/apps_groups.conf
@@ -0,0 +1,314 @@
+#
+# apps.plugin process grouping
+#
+# The apps.plugin displays charts with information about the processes running.
+# This config allows grouping processes together, so that several processes
+# will be reported as one.
+#
+# Only groups in this file are reported. All other processes will be reported
+# as 'other'.
+#
+# For each process given, its whole process tree will be grouped, not just
+# the process matched. The plugin will include both parents and childs.
+#
+# The format is:
+#
+# group: process1 process2 process3 ...
+#
+# Each group can be given multiple times, to add more processes to it.
+#
+# The process names are the ones returned by:
+#
+# - ps -e or /proc/PID/stat
+# - in case of substring mode (see below): /proc/PID/cmdline
+#
+# To add process names with spaces, enclose them in quotes (single or double)
+# example: 'Plex Media Serv' "my other process".
+#
+# Wildcard support:
+# You can add an asterisk (*) at the beginning and/or the end of a process:
+#
+# *name suffix mode: will search for processes ending with 'name'
+# (/proc/PID/stat)
+#
+# name* prefix mode: will search for processes beginning with 'name'
+# (/proc/PID/stat)
+#
+# *name* substring mode: will search for 'name' in the whole command line
+# (/proc/PID/cmdline)
+#
+# If you enter even just one *name* (substring), apps.plugin will process
+# /proc/PID/cmdline for all processes, just once (when they are first seen).
+#
+# To add processes with single quotes, enclose them in double quotes
+# example: "process with this ' single quote"
+#
+# To add processes with double quotes, enclose them in single quotes:
+# example: 'process with this " double quote'
+#
+# If a group or process name starts with a -, the dimension will be hidden
+# (cpu chart only).
+#
+# If a process starts with a +, debugging will be enabled for it
+# (debugging produces a lot of output - do not enable it in production systems)
+#
+# You can add any number of groups you like. Only the ones found running will
+# affect the charts generated. However, producing charts with hundreds of
+# dimensions may slow down your web browser.
+#
+# The order of the entries in this list is important: the first that matches
+# a process is used, so put important ones at the top. Processes not matched
+# by any row, will inherit it from their parents or children.
+#
+# The order also controls the order of the dimensions on the generated charts
+# (although applications started after apps.plugin is started, will be appended
+# to the existing list of dimensions the netdata daemon maintains).
+
+# -----------------------------------------------------------------------------
+# NETDATA processes accounting
+
+# netdata main process
+netdata: netdata
+
+# netdata known plugins
+# plugins not defined here will be accumulated in netdata, above
+apps.plugin: apps.plugin
+freeipmi.plugin: freeipmi.plugin
+nfacct.plugin: nfacct.plugin
+cups.plugin: cups.plugin
+xenstat.plugin: xenstat.plugin
+perf.plugin: perf.plugin
+charts.d.plugin: *charts.d.plugin*
+node.d.plugin: *node.d.plugin*
+python.d.plugin: *python.d.plugin*
+tc-qos-helper: *tc-qos-helper.sh*
+fping: fping
+ioping: ioping
+go.d.plugin: *go.d.plugin*
+slabinfo.plugin: slabinfo.plugin
+ebpf.plugin: *ebpf.plugin*
+
+# agent-service-discovery
+agent_sd: agent_sd
+
+# -----------------------------------------------------------------------------
+# authentication/authorization related servers
+
+auth: radius* openldap* ldap* slapd authelia
+fail2ban: fail2ban*
+
+# -----------------------------------------------------------------------------
+# web/ftp servers
+
+httpd: apache* httpd nginx* lighttpd hiawatha
+proxy: squid* c-icap squidGuard varnish*
+php: php* lsphp*
+ftpd: proftpd in.tftpd vsftpd
+uwsgi: uwsgi
+unicorn: *unicorn*
+puma: *puma*
+
+# -----------------------------------------------------------------------------
+# database servers
+
+sql: mysqld* mariad* postgres* postmaster* oracle_* ora_* sqlservr
+nosql: mongod redis* memcached *couchdb*
+timedb: prometheus *carbon-cache.py* *carbon-aggregator.py* *graphite/manage.py* *net.opentsdb.tools.TSDMain* influxd*
+columndb: clickhouse-server*
+
+# -----------------------------------------------------------------------------
+# email servers
+
+email: dovecot imapd pop3d amavis* master zmstat* zmmailboxdmgr qmgr oqmgr saslauthd opendkim clamd freshclam tlsmgr postfwd2 postscreen postfix smtp* lmtp* sendmail
+
+# -----------------------------------------------------------------------------
+# network, routing, VPN
+
+ppp: ppp*
+vpn: openvpn pptp* cjdroute gvpe tincd
+wifi: hostapd wpa_supplicant NetworkManager
+routing: ospfd* ospf6d* bgpd bfdd fabricd isisd eigrpd sharpd staticd ripd ripngd pimd pbrd nhrpd ldpd zebra vrrpd vtysh bird*
+modem: ModemManager
+tor: tor
+
+# -----------------------------------------------------------------------------
+# high availability and balancers
+
+camo: *camo*
+balancer: ipvs_* haproxy
+ha: corosync hs_logd ha_logd stonithd pacemakerd lrmd crmd
+
+# -----------------------------------------------------------------------------
+# telephony
+
+pbx: asterisk safe_asterisk *vicidial*
+sip: opensips* stund
+
+# -----------------------------------------------------------------------------
+# chat
+
+chat: irssi *vines* *prosody* murmurd
+
+# -----------------------------------------------------------------------------
+# monitoring
+
+logs: ulogd* syslog* rsyslog* logrotate systemd-journald rotatelogs
+nms: snmpd vnstatd smokeping zabbix* monit munin* mon openhpid watchdog tailon nrpe
+splunk: splunkd
+azure: mdsd *waagent* *omiserver* *omiagent* hv_kvp_daemon hv_vss_daemon *auoms* *omsagent*
+
+# -----------------------------------------------------------------------------
+# storage, file systems and file servers
+
+ceph: ceph-* ceph_* radosgw* rbd-* cephfs-* osdmaptool crushtool
+samba: smbd nmbd winbindd ctdbd ctdb-* ctdb_*
+nfs: rpcbind rpc.* nfs*
+zfs: spl_* z_* txg_* zil_* arc_* l2arc*
+btrfs: btrfs*
+iscsi: iscsid iscsi_eh
+
+# -----------------------------------------------------------------------------
+# kubernetes
+
+kubelet: kubelet
+kube-dns: kube-dns
+kube-proxy: kube-proxy
+metrics-server: metrics-server
+heapster: heapster
+
+# -----------------------------------------------------------------------------
+# containers & virtual machines
+
+containers: lxc* docker* balena*
+VMs: vbox* VBox* qemu*
+
+# -----------------------------------------------------------------------------
+# ssh servers and clients
+
+ssh: ssh* scp dropbear
+
+# -----------------------------------------------------------------------------
+# print servers and clients
+
+print: cups* lpd lpq
+
+# -----------------------------------------------------------------------------
+# time servers and clients
+
+time: ntp* systemd-timesyn* chronyd
+
+# -----------------------------------------------------------------------------
+# dhcp servers and clients
+
+dhcp: *dhcp*
+
+# -----------------------------------------------------------------------------
+# name servers and clients
+
+dns: named unbound nsd pdns_server knotd gdnsd yadifad dnsmasq systemd-resolve*
+dnsdist: dnsdist
+
+# -----------------------------------------------------------------------------
+# installation / compilation / debugging
+
+build: cc1 cc1plus as gcc* cppcheck ld make cmake automake autoconf autoreconf
+build: git gdb valgrind*
+
+# -----------------------------------------------------------------------------
+# antivirus
+
+antivirus: clam* *clam imunify360*
+
+# -----------------------------------------------------------------------------
+# torrent clients
+
+torrents: *deluge* transmission* *SickBeard* *CouchPotato* *rtorrent*
+
+# -----------------------------------------------------------------------------
+# backup servers and clients
+
+backup: rsync lsyncd bacula* borg rclone
+
+# -----------------------------------------------------------------------------
+# cron
+
+cron: cron* atd anacron systemd-cron*
+
+# -----------------------------------------------------------------------------
+# UPS
+
+ups: upsmon upsd */nut/*
+
+# -----------------------------------------------------------------------------
+# media players, servers, clients
+
+media: mplayer vlc xine mediatomb omxplayer* kodi* xbmc* mediacenter eventlircd
+media: mpd minidlnad mt-daapd avahi* Plex* jellyfin squeeze* jackett Ombi
+
+# -----------------------------------------------------------------------------
+# java applications
+
+hdfsdatanode: *org.apache.hadoop.hdfs.server.datanode.DataNode*
+hdfsnamenode: *org.apache.hadoop.hdfs.server.namenode.NameNode*
+hdfsjournalnode: *org.apache.hadoop.hdfs.qjournal.server.JournalNode*
+hdfszkfc: *org.apache.hadoop.hdfs.tools.DFSZKFailoverController*
+
+yarnnode: *org.apache.hadoop.yarn.server.nodemanager.NodeManager*
+yarnmgr: *org.apache.hadoop.yarn.server.resourcemanager.ResourceManager*
+yarnproxy: *org.apache.hadoop.yarn.server.webproxy.WebAppProxyServer*
+
+sparkworker: *org.apache.spark.deploy.worker.Worker*
+sparkmaster: *org.apache.spark.deploy.master.Master*
+
+hbaseregion: *org.apache.hadoop.hbase.regionserver.HRegionServer*
+hbaserest: *org.apache.hadoop.hbase.rest.RESTServer*
+hbasethrift: *org.apache.hadoop.hbase.thrift.ThriftServer*
+hbasemaster: *org.apache.hadoop.hbase.master.HMaster*
+
+zookeeper: *org.apache.zookeeper.server.quorum.QuorumPeerMain*
+
+hive2: *org.apache.hive.service.server.HiveServer2*
+hivemetastore: *org.apache.hadoop.hive.metastore.HiveMetaStore*
+
+solr: *solr.install.dir*
+
+airflow: *airflow*
+
+# -----------------------------------------------------------------------------
+# X
+
+X: X Xorg xinit lightdm xdm pulseaudio gkrellm xfwm4 xfdesktop xfce* Thunar
+X: xfsettingsd xfconfd gnome-* gdm gconf* dconf* xfconf* *gvfs gvfs* slim
+X: kdeinit* kdm plasmashell
+X: evolution-* firefox chromium opera vivaldi-bin epiphany WebKit*
+X: '*systemd --user*' chrome *chrome-sandbox* *google-chrome* *chromium* *firefox*
+
+# -----------------------------------------------------------------------------
+# Kernel / System
+
+ksmd: ksmd
+
+system: systemd-* udisks* udevd* *udevd connmand ipv6_addrconf dbus-* rtkit*
+system: inetd xinetd mdadm polkitd acpid uuidd packagekitd upowerd colord
+system: accounts-daemon rngd haveged
+
+kernel: kthreadd kauditd lockd khelper kdevtmpfs khungtaskd rpciod
+kernel: fsnotify_mark kthrotld deferwq scsi_*
+
+# -----------------------------------------------------------------------------
+# other application servers
+
+kafka: *kafka.Kafka*
+
+rabbitmq: *rabbitmq*
+
+sidekiq: *sidekiq*
+java: java
+ipfs: ipfs
+
+node: node*
+factorio: factorio
+
+p4: p4*
+
+git-services: gitea gitlab-runner
diff --git a/applications/luci-app-netdata/root/etc/netdata/ebpf.conf b/applications/luci-app-netdata/root/etc/netdata/ebpf.conf
new file mode 100755
index 0000000..d9b6b93
--- /dev/null
+++ b/applications/luci-app-netdata/root/etc/netdata/ebpf.conf
@@ -0,0 +1,7 @@
+[global]
+ ebpf load mode = entry
+ disable apps = no
+
+[ebpf programs]
+ process = yes
+ network viewer = yes
diff --git a/applications/luci-app-netdata/root/etc/netdata/exporting.conf b/applications/luci-app-netdata/root/etc/netdata/exporting.conf
new file mode 100755
index 0000000..9c1e7ff
--- /dev/null
+++ b/applications/luci-app-netdata/root/etc/netdata/exporting.conf
@@ -0,0 +1,88 @@
+[exporting:global]
+ enabled = no
+ # send configured labels = yes
+ # send automatic labels = no
+ # update every = 10
+
+[prometheus:exporter]
+ # send names instead of ids = yes
+ # send configured labels = yes
+ # send automatic labels = no
+ # send charts matching = *
+ # send hosts matching = localhost *
+ # prefix = netdata
+
+# An example configuration for graphite, json, opentsdb exporting connectors
+# [graphite:my_graphite_instance]
+ # enabled = no
+ # destination = localhost
+ # data source = average
+ # prefix = netdata
+ # hostname = my_hostname
+ # update every = 10
+ # buffer on failures = 10
+ # timeout ms = 20000
+ # send names instead of ids = yes
+ # send charts matching = *
+ # send hosts matching = localhost *
+
+# [prometheus_remote_write:my_prometheus_remote_write_instance]
+ # enabled = no
+ # destination = localhost
+ # remote write URL path = /receive
+ # data source = average
+ # prefix = netdata
+ # hostname = my_hostname
+ # update every = 10
+ # buffer on failures = 10
+ # timeout ms = 20000
+ # send names instead of ids = yes
+ # send charts matching = *
+ # send hosts matching = localhost *
+
+# [kinesis:my_kinesis_instance]
+ # enabled = no
+ # destination = us-east-1
+ # stream name = netdata
+ # aws_access_key_id = my_access_key_id
+ # aws_secret_access_key = my_aws_secret_access_key
+ # data source = average
+ # prefix = netdata
+ # hostname = my_hostname
+ # update every = 10
+ # buffer on failures = 10
+ # timeout ms = 20000
+ # send names instead of ids = yes
+ # send charts matching = *
+ # send hosts matching = localhost *
+
+# [pubsub:my_pubsub_instance]
+ # enabled = no
+ # destination = pubsub.googleapis.com
+ # credentials file = /etc/netdata/pubsub_credentials.json
+ # project id = my_project
+ # topic id = my_topic
+ # data source = average
+ # prefix = netdata
+ # hostname = my_hostname
+ # update every = 10
+ # buffer on failures = 10
+ # timeout ms = 20000
+ # send names instead of ids = yes
+ # send charts matching = *
+ # send hosts matching = localhost *
+
+# [mongodb:my_mongodb_instance]
+ # enabled = no
+ # destination = localhost
+ # database = my_database
+ # collection = my_collection
+ # data source = average
+ # prefix = netdata
+ # hostname = my_hostname
+ # update every = 10
+ # buffer on failures = 10
+ # timeout ms = 20000
+ # send names instead of ids = yes
+ # send charts matching = *
+ # send hosts matching = localhost *
diff --git a/applications/luci-app-netdata/root/etc/netdata/netdata.conf b/applications/luci-app-netdata/root/etc/netdata/netdata.conf
new file mode 100755
index 0000000..4b0f5a3
--- /dev/null
+++ b/applications/luci-app-netdata/root/etc/netdata/netdata.conf
@@ -0,0 +1,43 @@
+
+[global]
+ update every = 2
+ memory deduplication (ksm) = no
+ debug log = syslog
+ error log = syslog
+ access log = none
+ run as user = root
+
+[web]
+ allow connections from = localhost 10.* 192.168.* 172.16.* 172.17.* 172.18.* 172.19.* 172.20.* 172.21.* 172.22.* 172.23.* 172.24.* 172.25.* 172.26.* 172.27.* 172.28.* 172.29.* 172.30.* 172.31.*
+ allow dashboard from = localhost 10.* 192.168.* 172.16.* 172.17.* 172.18.* 172.19.* 172.20.* 172.21.* 172.22.* 172.23.* 172.24.* 172.25.* 172.26.* 172.27.* 172.28.* 172.29.* 172.30.* 172.31.*
+
+[plugins]
+ cgroups = no
+ apps = no
+ charts.d = no
+ fping = no
+ node.d = no
+ python.d = no
+
+
+[plugin:proc]
+ ipc =no
+ /proc/sysvipc/shm = no
+ /sys/devices/system/edac/mc = no
+ /sys/devices/system/node = no
+ /proc/net/sockstat = no
+ /proc/net/netstat = no
+ /proc/net/snmp = no
+ /proc/net/softnet_stat = no
+ /proc/net/sctp/snmp = no
+ /proc/net/ip_vs/stats = no
+ /proc/net/stat/synproxy = no
+ /sys/kernel/mm/ksm = no
+ /dev/mapper = no
+
+[plugin:proc:/proc/diskstats]
+ path to /dev/vx/dsk =
+ path to /dev/disk/by-label =</font>
+
+[health]
+ enabled = no
diff --git a/applications/luci-app-netdata/root/etc/netdata/stream.conf b/applications/luci-app-netdata/root/etc/netdata/stream.conf
new file mode 100755
index 0000000..b514263
--- /dev/null
+++ b/applications/luci-app-netdata/root/etc/netdata/stream.conf
@@ -0,0 +1,205 @@
+# netdata configuration for aggregating data from remote hosts
+#
+# API keys authorize a pair of sending-receiving netdata servers.
+# Once their communication is authorized, they can exchange metrics for any
+# number of hosts.
+#
+# You can generate API keys, with the linux command: uuidgen
+
+
+# -----------------------------------------------------------------------------
+# 1. ON CHILD NETDATA - THE ONE THAT WILL BE SENDING METRICS
+
+[stream]
+ # Enable this on child nodes, to have them send metrics.
+ enabled = no
+
+ # Where is the receiving netdata?
+ # A space separated list of:
+ #
+ # [PROTOCOL:]HOST[%INTERFACE][:PORT][:SSL]
+ #
+ # If many are given, the first available will get the metrics.
+ #
+ # PROTOCOL = tcp, udp, or unix (only tcp and unix are supported by parent nodes)
+ # HOST = an IPv4, IPv6 IP, or a hostname, or a unix domain socket path.
+ # IPv6 IPs should be given with brackets [ip:address]
+ # INTERFACE = the network interface to use (only for IPv6)
+ # PORT = the port number or service name (/etc/services)
+ # SSL = when this word appear at the end of the destination string
+ # the Netdata will encrypt the connection with the parent.
+ #
+ # This communication is not HTTP (it cannot be proxied by web proxies).
+ destination =
+
+ # Skip Certificate verification?
+ #
+ # The netdata child is configurated to avoid invalid SSL/TLS certificate,
+ # so certificates that are self-signed or expired will stop the streaming.
+ # Case the server certificate is not valid, you can enable the use of
+ # 'bad' certificates setting the next option as 'yes'.
+ #
+ #ssl skip certificate verification = yes
+
+ # Certificate Authority Path
+ #
+ # OpenSSL has a default directory where the known certificates are stored,
+ # case it is necessary it is possible to change this rule using the variable
+ # "CApath"
+ #
+ #CApath = /etc/ssl/certs/
+
+ # Certificate Authority file
+ #
+ # When the Netdata parent has certificate, that is not recognized as valid,
+ # we can add this certificate in the list of known certificates in CApath
+ # and give for Netdata as argument.
+ #
+ #CAfile = /etc/ssl/certs/cert.pem
+
+ # The API_KEY to use (as the sender)
+ api key =
+
+ # The timeout to connect and send metrics
+ timeout seconds = 60
+
+ # If the destination line above does not specify a port, use this
+ default port = 19999
+
+ # filter the charts to be streamed
+ # netdata SIMPLE PATTERN:
+ # - space separated list of patterns (use \ to include spaces in patterns)
+ # - use * as wildcard, any number of times within each pattern
+ # - prefix a pattern with ! for a negative match (ie not stream the charts it matches)
+ # - the order of patterns is important (left to right)
+ # To send all except a few, use: !this !that * (ie append a wildcard pattern)
+ send charts matching = *
+
+ # The buffer to use for sending metrics.
+ # 1MB is good for 10-20 seconds of data, so increase this if you expect latencies.
+ # The buffer is flushed on reconnects (this will not prevent gaps at the charts).
+ buffer size bytes = 1048576
+
+ # If the connection fails, or it disconnects,
+ # retry after that many seconds.
+ reconnect delay seconds = 5
+
+ # Sync the clock of the charts for that many iterations, when starting.
+ initial clock resync iterations = 60
+
+# -----------------------------------------------------------------------------
+# 2. ON PARENT NETDATA - THE ONE THAT WILL BE RECEIVING METRICS
+
+# You can have one API key per child,
+# or the same API key for all child nodes.
+#
+# netdata searches for options in this order:
+#
+# a) parent netdata settings (netdata.conf)
+# b) [stream] section (above)
+# c) [API_KEY] section (below, settings for the API key)
+# d) [MACHINE_GUID] section (below, settings for each machine)
+#
+# You can combine the above (the more specific setting will be used).
+
+# API key authentication
+# If the key is not listed here, it will not be able to push metrics.
+
+# [API_KEY] is [YOUR-API-KEY], i.e [11111111-2222-3333-4444-555555555555]
+[API_KEY]
+ # Default settings for this API key
+
+ # You can disable the API key, by setting this to: no
+ # The default (for unknown API keys) is: no
+ enabled = no
+
+ # A list of simple patterns matching the IPs of the servers that
+ # will be pushing metrics using this API key.
+ # The metrics are received via the API port, so the same IPs
+ # should also be matched at netdata.conf [web].allow connections from
+ allow from = *
+
+ # The default history in entries, for all hosts using this API key.
+ # You can also set it per host below.
+ # If you don't set it here, the history size of the central netdata
+ # will be used.
+ default history = 3600
+
+ # The default memory mode to be used for all hosts using this API key.
+ # You can also set it per host below.
+ # If you don't set it here, the memory mode of netdata.conf will be used.
+ # Valid modes:
+ # save save on exit, load on start
+ # map like swap (continuously syncing to disks - you need SSD)
+ # ram keep it in RAM, don't touch the disk
+ # none no database at all (use this on headless proxies)
+ # dbengine like a traditional database
+ default memory mode = ram
+
+ # Shall we enable health monitoring for the hosts using this API key?
+ # 3 possible values:
+ # yes enable alarms
+ # no do not enable alarms
+ # auto enable alarms, only when the sending netdata is connected. For ephemeral child nodes or child system restarts,
+ # ensure that the netdata process on the child is gracefully stopped, to prevent invalid last_collected alarms
+ # You can also set it per host, below.
+ # The default is taken from [health].enabled of netdata.conf
+ health enabled by default = auto
+
+ # postpone alarms for a short period after the sender is connected
+ default postpone alarms on connect seconds = 60
+
+ # need to route metrics differently? set these.
+ # the defaults are the ones at the [stream] section (above)
+ #default proxy enabled = yes | no
+ #default proxy destination = IP:PORT IP:PORT ...
+ #default proxy api key = API_KEY
+ #default proxy send charts matching = *
+
+
+# -----------------------------------------------------------------------------
+# 3. PER SENDING HOST SETTINGS, ON PARENT NETDATA
+# THIS IS OPTIONAL - YOU DON'T HAVE TO CONFIGURE IT
+
+# This section exists to give you finer control of the parent settings for each
+# child host, when the same API key is used by many netdata child nodes / proxies.
+#
+# Each netdata has a unique GUID - generated the first time netdata starts.
+# You can find it at /var/lib/netdata/registry/netdata.public.unique.id
+# (at the child).
+#
+# The host sending data will have one. If the host is not ephemeral,
+# you can give settings for each sending host here.
+
+[MACHINE_GUID]
+ # enable this host: yes | no
+ # When disabled, the parent will not receive metrics for this host.
+ # THIS IS NOT A SECURITY MECHANISM - AN ATTACKER CAN SET ANY OTHER GUID.
+ # Use only the API key for security.
+ enabled = no
+
+ # A list of simple patterns matching the IPs of the servers that
+ # will be pushing metrics using this MACHINE GUID.
+ # The metrics are received via the API port, so the same IPs
+ # should also be matched at netdata.conf [web].allow connections from
+ # and at stream.conf [API_KEY].allow from
+ allow from = *
+
+ # The number of entries in the database
+ history = 3600
+
+ # The memory mode of the database: save | map | ram | none | dbengine
+ memory mode = save
+
+ # Health / alarms control: yes | no | auto
+ health enabled = yes
+
+ # postpone alarms when the sender connects
+ postpone alarms on connect seconds = 60
+
+ # need to route metrics differently?
+ # the defaults are the ones at the [API KEY] section
+ #proxy enabled = yes | no
+ #proxy destination = IP:PORT IP:PORT ...
+ #proxy api key = API_KEY
+ #proxy send charts matching = *
diff --git a/applications/luci-app-netdata/root/etc/uci-defaults/40_luci-app-netdata b/applications/luci-app-netdata/root/etc/uci-defaults/40_luci-app-netdata
new file mode 100755
index 0000000..a6e6d84
--- /dev/null
+++ b/applications/luci-app-netdata/root/etc/uci-defaults/40_luci-app-netdata
@@ -0,0 +1,8 @@
+#!/bin/sh
+[ -f /usr/share/netdata/webcn/dashboard.js ] && mv -f /usr/share/netdata/webcn/dashboard.js /usr/share/netdata/web/dashboard.js
+[ -f /usr/share/netdata/webcn/dashboard_info.js ] && mv -f /usr/share/netdata/webcn/dashboard_info.js /usr/share/netdata/web/dashboard_info.js
+[ -f /usr/share/netdata/webcn/main.js ] && mv -f /usr/share/netdata/webcn/dashboard.js /usr/share/netdata/web/main.js
+[ -f /usr/share/netdata/webcn/index.html ] && mv -f /usr/share/netdata/webcn/index.html /usr/share/netdata/web/index.html
+
+rm -rf /tmp/luci-modulecache /tmp/luci-indexcache*
+exit 0
diff --git a/applications/luci-app-netdata/root/usr/share/netdata/webcn/dashboard.js b/applications/luci-app-netdata/root/usr/share/netdata/webcn/dashboard.js
new file mode 100755
index 0000000..f20f352
--- /dev/null
+++ b/applications/luci-app-netdata/root/usr/share/netdata/webcn/dashboard.js
@@ -0,0 +1,10378 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// DO NOT EDIT: This file is automatically generated from the source files in src/
+
+// ----------------------------------------------------------------------------
+// You can set the following variables before loading this script:
+
+// 'use strict';
+
+/*global netdataNoDygraphs *//* boolean, disable dygraph charts
+ * (default: false) */
+/*global netdataNoSparklines *//* boolean, disable sparkline charts
+ * (default: false) */
+/*global netdataNoPeitys *//* boolean, disable peity charts
+ * (default: false) */
+/*global netdataNoGoogleCharts *//* boolean, disable google charts
+ * (default: false) */
+/*global netdataNoMorris *//* boolean, disable morris charts
+ * (default: false) */
+/*global netdataNoEasyPieChart *//* boolean, disable easypiechart charts
+ * (default: false) */
+/*global netdataNoGauge *//* boolean, disable gauge.js charts
+ * (default: false) */
+/*global netdataNoD3 *//* boolean, disable d3 charts
+ * (default: false) */
+/*global netdataNoC3 *//* boolean, disable c3 charts
+ * (default: false) */
+/*global netdataNoD3pie *//* boolean, disable d3pie charts
+ * (default: false) */
+/*global netdataNoBootstrap *//* boolean, disable bootstrap - disables help too
+ * (default: false) */
+/*global netdataNoFontAwesome *//* boolean, disable fontawesome (do not load it)
+ * (default: false) */
+/*global netdataIcons *//* object, overwrite netdata fontawesome icons
+ * (default: null) */
+/*global netdataDontStart *//* boolean, do not start the thread to process the charts
+ * (default: false) */
+/*global netdataErrorCallback *//* function, callback to be called when the dashboard encounters an error
+ * (default: null) */
+/*global netdataRegistry:true *//* boolean, use the netdata registry
+ * (default: false) */
+/*global netdataNoRegistry *//* boolean, included only for compatibility with existing custom dashboard
+ * (obsolete - do not use this any more) */
+/*global netdataRegistryCallback *//* function, callback that will be invoked with one param: the URLs from the registry
+ * (default: null) */
+/*global netdataShowHelp:true *//* boolean, disable charts help
+ * (default: true) */
+/*global netdataShowAlarms:true *//* boolean, enable alarms checks and notifications
+ * (default: false) */
+/*global netdataRegistryAfterMs:true *//* ms, delay registry use at started
+ * (default: 1500) */
+/*global netdataCallback *//* function, callback to be called when netdata is ready to start
+ * (default: null)
+ * netdata will be running while this is called
+ * (call NETDATA.pause to stop it) */
+/*global netdataPrepCallback *//* function, callback to be called before netdata does anything else
+ * (default: null) */
+/*global netdataServer *//* string, the URL of the netdata server to use
+ * (default: the URL the page is hosted at) */
+/*global netdataServerStatic *//* string, the URL of the netdata server to use for static files
+ * (default: netdataServer) */
+/*global netdataSnapshotData *//* object, a netdata snapshot loaded
+ * (default: null) */
+/*global netdataAlarmsRecipients *//* array, an array of alarm recipients to show notifications for
+ * (default: null) */
+/*global netdataAlarmsRemember *//* boolen, keep our position in the alarm log at browser local storage
+ * (default: true) */
+/*global netdataAlarmsActiveCallback *//* function, a hook for the alarm logs
+ * (default: undefined) */
+/*global netdataAlarmsNotifCallback *//* function, a hook for alarm notifications
+ * (default: undefined) */
+/*global netdataIntersectionObserver *//* boolean, enable or disable the use of intersection observer
+ * (default: true) */
+/*global netdataCheckXSS *//* boolean, enable or disable checking for XSS issues
+ * (default: false) */
+
+// ----------------------------------------------------------------------------
+// global namespace
+
+// Should stay var!
+var NETDATA = window.NETDATA || {};
+
+(function(window, document, $, undefined) {
+
+// *** src/dashboard.js/utils.js
+
+NETDATA.name2id = function (s) {
+ return s
+ .replace(/ /g, '_')
+ .replace(/:/g, '_')
+ .replace(/\(/g, '_')
+ .replace(/\)/g, '_')
+ .replace(/\./g, '_')
+ .replace(/\//g, '_');
+};
+
+NETDATA.encodeURIComponent = function (s) {
+ if (typeof(s) === 'string') {
+ return encodeURIComponent(s);
+ }
+
+ return s;
+};
+
+/// A heuristic for detecting slow devices.
+let isSlowDeviceResult = undefined;
+const isSlowDevice = function () {
+ if (!isSlowDeviceResult) {
+ return isSlowDeviceResult;
+ }
+
+ try {
+ let ua = navigator.userAgent.toLowerCase();
+
+ let iOS = /ipad|iphone|ipod/.test(ua) && !window.MSStream;
+ let android = /android/.test(ua) && !window.MSStream;
+ isSlowDeviceResult = (iOS || android);
+ } catch (e) {
+ isSlowDeviceResult = false;
+ }
+
+ return isSlowDeviceResult;
+};
+
+NETDATA.guid = function () {
+ function s4() {
+ return Math.floor((1 + Math.random()) * 0x10000)
+ .toString(16)
+ .substring(1);
+ }
+
+ return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+};
+
+NETDATA.zeropad = function (x) {
+ if (x > -10 && x < 10) {
+ return '0' + x.toString();
+ } else {
+ return x.toString();
+ }
+};
+
+NETDATA.seconds4human = function (seconds, options) {
+ let defaultOptions = {
+ now: '现在',
+ space: ' ',
+ negative_suffix: '前',
+ day: '日',
+ days: '日',
+ hour: '小时',
+ hours: '小时',
+ minute: '分钟',
+ minutes: '分钟',
+ second: '秒',
+ seconds: '秒',
+ and: '及'
+ };
+
+ if (typeof options !== 'object') {
+ options = defaultOptions;
+ } else {
+ for (var x in defaultOptions) {
+ if (typeof options[x] !== 'string') {
+ options[x] = defaultOptions[x];
+ }
+ }
+ }
+
+ if (typeof seconds === 'string') {
+ seconds = parseInt(seconds, 10);
+ }
+
+ if (seconds === 0) {
+ return options.now;
+ }
+
+ let suffix = '';
+ if (seconds < 0) {
+ seconds = -seconds;
+ if (options.negative_suffix !== '') {
+ suffix = options.space + options.negative_suffix;
+ }
+ }
+
+ let days = Math.floor(seconds / 86400);
+ seconds -= (days * 86400);
+
+ let hours = Math.floor(seconds / 3600);
+ seconds -= (hours * 3600);
+
+ let minutes = Math.floor(seconds / 60);
+ seconds -= (minutes * 60);
+
+ let strings = [];
+
+ if (days > 1) {
+ strings.push(days.toString() + options.space + options.days);
+ } else if (days === 1) {
+ strings.push(days.toString() + options.space + options.day);
+ }
+
+ if (hours > 1) {
+ strings.push(hours.toString() + options.space + options.hours);
+ } else if (hours === 1) {
+ strings.push(hours.toString() + options.space + options.hour);
+ }
+
+ if (minutes > 1) {
+ strings.push(minutes.toString() + options.space + options.minutes);
+ } else if (minutes === 1) {
+ strings.push(minutes.toString() + options.space + options.minute);
+ }
+
+ if (seconds > 1) {
+ strings.push(Math.floor(seconds).toString() + options.space + options.seconds);
+ } else if (seconds === 1) {
+ strings.push(Math.floor(seconds).toString() + options.space + options.second);
+ }
+
+ if (strings.length === 1) {
+ return strings.pop() + suffix;
+ }
+
+ let last = strings.pop();
+ return strings.join(", ") + " " + options.and + " " + last + suffix;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// element data attributes
+
+NETDATA.dataAttribute = function (element, attribute, def) {
+ let key = 'data-' + attribute.toString();
+ if (element.hasAttribute(key)) {
+ let data = element.getAttribute(key);
+
+ if (data === 'true') {
+ return true;
+ }
+ if (data === 'false') {
+ return false;
+ }
+ if (data === 'null') {
+ return null;
+ }
+
+ // Only convert to a number if it doesn't change the string
+ if (data === +data + '') {
+ return +data;
+ }
+
+ if (/^(?:\{[\w\W]*\}|\[[\w\W]*\])$/.test(data)) {
+ return JSON.parse(data);
+ }
+
+ return data;
+ } else {
+ return def;
+ }
+};
+
+NETDATA.dataAttributeBoolean = function (element, attribute, def) {
+ let value = NETDATA.dataAttribute(element, attribute, def);
+
+ if (value === true || value === false) // gmosx: Love this :)
+ {
+ return value;
+ }
+
+ if (typeof(value) === 'string') {
+ if (value === 'yes' || value === 'on') {
+ return true;
+ }
+
+ if (value === '' || value === 'no' || value === 'off' || value === 'null') {
+ return false;
+ }
+
+ return def;
+ }
+
+ if (typeof(value) === 'number') {
+ return value !== 0;
+ }
+
+ return def;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// fast numbers formatting
+
+NETDATA.fastNumberFormat = {
+ formattersFixed: [],
+ formattersZeroBased: [],
+
+ // this is the fastest and the preferred
+ getIntlNumberFormat: function (min, max) {
+ let key = max;
+ if (min === max) {
+ if (typeof this.formattersFixed[key] === 'undefined') {
+ this.formattersFixed[key] = new Intl.NumberFormat(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+
+ return this.formattersFixed[key];
+ } else if (min === 0) {
+ if (typeof this.formattersZeroBased[key] === 'undefined') {
+ this.formattersZeroBased[key] = new Intl.NumberFormat(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+
+ return this.formattersZeroBased[key];
+ } else {
+ // this is never used
+ // it is added just for completeness
+ return new Intl.NumberFormat(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+ },
+
+ // this respects locale
+ getLocaleString: function (min, max) {
+ let key = max;
+ if (min === max) {
+ if (typeof this.formattersFixed[key] === 'undefined') {
+ this.formattersFixed[key] = {
+ format: function (value) {
+ return value.toLocaleString(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+ };
+ }
+
+ return this.formattersFixed[key];
+ } else if (min === 0) {
+ if (typeof this.formattersZeroBased[key] === 'undefined') {
+ this.formattersZeroBased[key] = {
+ format: function (value) {
+ return value.toLocaleString(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+ };
+ }
+
+ return this.formattersZeroBased[key];
+ } else {
+ return {
+ format: function (value) {
+ return value.toLocaleString(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+ };
+ }
+ },
+
+ // the fallback
+ getFixed: function (min, max) {
+ let key = max;
+ if (min === max) {
+ if (typeof this.formattersFixed[key] === 'undefined') {
+ this.formattersFixed[key] = {
+ format: function (value) {
+ if (value === 0) {
+ return "0";
+ }
+ return value.toFixed(max);
+ }
+ };
+ }
+
+ return this.formattersFixed[key];
+ } else if (min === 0) {
+ if (typeof this.formattersZeroBased[key] === 'undefined') {
+ this.formattersZeroBased[key] = {
+ format: function (value) {
+ if (value === 0) {
+ return "0";
+ }
+ return value.toFixed(max);
+ }
+ };
+ }
+
+ return this.formattersZeroBased[key];
+ } else {
+ return {
+ format: function (value) {
+ if (value === 0) {
+ return "0";
+ }
+ return value.toFixed(max);
+ }
+ };
+ }
+ },
+
+ testIntlNumberFormat: function () {
+ let value = 1.12345;
+ let e1 = "1.12", e2 = "1,12";
+ let s = "";
+
+ try {
+ let x = new Intl.NumberFormat(undefined, {
+ useGrouping: true,
+ minimumFractionDigits: 2,
+ maximumFractionDigits: 2
+ });
+
+ s = x.format(value);
+ } catch (e) {
+ s = "";
+ }
+
+ // console.log('NumberFormat: ', s);
+ return (s === e1 || s === e2);
+ },
+
+ testLocaleString: function () {
+ let value = 1.12345;
+ let e1 = "1.12", e2 = "1,12";
+ let s = "";
+
+ try {
+ s = value.toLocaleString(undefined, {
+ useGrouping: true,
+ minimumFractionDigits: 2,
+ maximumFractionDigits: 2
+ });
+ } catch (e) {
+ s = "";
+ }
+
+ // console.log('localeString: ', s);
+ return (s === e1 || s === e2);
+ },
+
+ // on first run we decide which formatter to use
+ get: function (min, max) {
+ if (this.testIntlNumberFormat()) {
+ // console.log('numberformat');
+ this.get = this.getIntlNumberFormat;
+ } else if (this.testLocaleString()) {
+ // console.log('localestring');
+ this.get = this.getLocaleString;
+ } else {
+ // console.log('fixed');
+ this.get = this.getFixed;
+ }
+ return this.get(min, max);
+ }
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// Detect the netdata server
+
+// http://stackoverflow.com/questions/984510/what-is-my-script-src-url
+// http://stackoverflow.com/questions/6941533/get-protocol-domain-and-port-from-url
+NETDATA._scriptSource = function () {
+ let script = null;
+
+ if (typeof document.currentScript !== 'undefined') {
+ script = document.currentScript;
+ } else {
+ const all_scripts = document.getElementsByTagName('script');
+ script = all_scripts[all_scripts.length - 1];
+ }
+
+ if (typeof script.getAttribute.length !== 'undefined') {
+ script = script.src;
+ } else {
+ script = script.getAttribute('src', -1);
+ }
+
+ return script;
+};
+
+// *** src/dashboard.js/server-detection.js
+
+if (typeof netdataServer !== 'undefined') {
+ NETDATA.serverDefault = netdataServer;
+} else {
+ let s = NETDATA._scriptSource();
+ if (s) {
+ NETDATA.serverDefault = s.replace(/\/dashboard.js(\?.*)?$/g, "");
+ } else {
+ console.log('WARNING: Cannot detect the URL of the netdata server.');
+ NETDATA.serverDefault = null;
+ }
+}
+
+if (NETDATA.serverDefault === null) {
+ NETDATA.serverDefault = '';
+} else if (NETDATA.serverDefault.slice(-1) !== '/') {
+ NETDATA.serverDefault += '/';
+}
+
+if (typeof netdataServerStatic !== 'undefined' && netdataServerStatic !== null && netdataServerStatic !== '') {
+ NETDATA.serverStatic = netdataServerStatic;
+ if (NETDATA.serverStatic.slice(-1) !== '/') {
+ NETDATA.serverStatic += '/';
+ }
+} else {
+ NETDATA.serverStatic = NETDATA.serverDefault;
+}
+
+// *** src/dashboard.js/dependencies.js
+
+// default URLs for all the external files we need
+// make them RELATIVE so that the whole thing can also be
+// installed under a web server
+NETDATA.jQuery = NETDATA.serverStatic + 'lib/jquery-2.2.4.min.js';
+NETDATA.peity_js = NETDATA.serverStatic + 'lib/jquery.peity-3.2.0.min.js';
+NETDATA.sparkline_js = NETDATA.serverStatic + 'lib/jquery.sparkline-2.1.2.min.js';
+NETDATA.easypiechart_js = NETDATA.serverStatic + 'lib/jquery.easypiechart-97b5824.min.js';
+NETDATA.gauge_js = NETDATA.serverStatic + 'lib/gauge-1.3.2.min.js';
+NETDATA.dygraph_js = NETDATA.serverStatic + 'lib/dygraph-c91c859.min.js';
+NETDATA.dygraph_smooth_js = NETDATA.serverStatic + 'lib/dygraph-smooth-plotter-c91c859.js';
+// NETDATA.raphael_js = NETDATA.serverStatic + 'lib/raphael-2.2.4-min.js';
+// NETDATA.c3_js = NETDATA.serverStatic + 'lib/c3-0.4.18.min.js';
+// NETDATA.c3_css = NETDATA.serverStatic + 'css/c3-0.4.18.min.css';
+NETDATA.d3pie_js = NETDATA.serverStatic + 'lib/d3pie-0.2.1-netdata-3.js';
+NETDATA.d3_js = NETDATA.serverStatic + 'lib/d3-4.12.2.min.js';
+// NETDATA.morris_js = NETDATA.serverStatic + 'lib/morris-0.5.1.min.js';
+// NETDATA.morris_css = NETDATA.serverStatic + 'css/morris-0.5.1.css';
+NETDATA.google_js = 'https://www.google.com/jsapi';
+// Error Handling
+
+NETDATA.errorCodes = {
+ 100: {message: "Cannot load chart library", alert: true},
+ 101: {message: "Cannot load jQuery", alert: true},
+ 402: {message: "Chart library not found", alert: false},
+ 403: {message: "Chart library not enabled/is failed", alert: false},
+ 404: {message: "Chart not found", alert: false},
+ 405: {message: "Cannot download charts index from server", alert: true},
+ 406: {message: "Invalid charts index downloaded from server", alert: true},
+ 407: {message: "Cannot HELLO netdata server", alert: false},
+ 408: {message: "Netdata servers sent invalid response to HELLO", alert: false},
+ 409: {message: "Cannot ACCESS netdata registry", alert: false},
+ 410: {message: "Netdata registry ACCESS failed", alert: false},
+ 411: {message: "Netdata registry server send invalid response to DELETE ", alert: false},
+ 412: {message: "Netdata registry DELETE failed", alert: false},
+ 413: {message: "Netdata registry server send invalid response to SWITCH ", alert: false},
+ 414: {message: "Netdata registry SWITCH failed", alert: false},
+ 415: {message: "Netdata alarms download failed", alert: false},
+ 416: {message: "Netdata alarms log download failed", alert: false},
+ 417: {message: "Netdata registry server send invalid response to SEARCH ", alert: false},
+ 418: {message: "Netdata registry SEARCH failed", alert: false}
+};
+
+NETDATA.errorLast = {
+ code: 0,
+ message: "",
+ datetime: 0
+};
+
+NETDATA.error = function (code, msg) {
+ NETDATA.errorLast.code = code;
+ NETDATA.errorLast.message = msg;
+ NETDATA.errorLast.datetime = Date.now();
+
+ console.log("ERROR " + code + ": " + NETDATA.errorCodes[code].message + ": " + msg);
+
+ let ret = true;
+ if (typeof netdataErrorCallback === 'function') {
+ ret = netdataErrorCallback('system', code, msg);
+ }
+
+ if (ret && NETDATA.errorCodes[code].alert) {
+ alert("ERROR " + code + ": " + NETDATA.errorCodes[code].message + ": " + msg);
+ }
+};
+
+NETDATA.errorReset = function () {
+ NETDATA.errorLast.code = 0;
+ NETDATA.errorLast.message = "You are doing fine!";
+ NETDATA.errorLast.datetime = 0;
+};
+// *** src/dashboard.js/compatibility.js
+
+// Compatibility fixes.
+
+// fix IE issue with console
+if (!window.console) {
+ window.console = {
+ log: function () {
+ }
+ };
+}
+
+// if string.endsWith is not defined, define it
+if (typeof String.prototype.endsWith !== 'function') {
+ String.prototype.endsWith = function (s) {
+ if (s.length > this.length) {
+ return false;
+ }
+ return this.slice(-s.length) === s;
+ };
+}
+
+// if string.startsWith is not defined, define it
+if (typeof String.prototype.startsWith !== 'function') {
+ String.prototype.startsWith = function (s) {
+ if (s.length > this.length) {
+ return false;
+ }
+ return this.slice(s.length) === s;
+ };
+}
+// ----------------------------------------------------------------------------------------------------------------
+// XSS checks
+
+NETDATA.xss = {
+ enabled: (typeof netdataCheckXSS === 'undefined') ? false : netdataCheckXSS,
+ enabled_for_data: (typeof netdataCheckXSS === 'undefined') ? false : netdataCheckXSS,
+
+ string: function (s) {
+ return s.toString()
+ .replace(/</g, '<')
+ .replace(/>/g, '>')
+ .replace(/"/g, '"')
+ .replace(/'/g, ''');
+ },
+
+ object: function (name, obj, ignore_regex) {
+ if (typeof ignore_regex !== 'undefined' && ignore_regex.test(name)) {
+ // console.log('XSS: ignoring "' + name + '"');
+ return obj;
+ }
+
+ switch (typeof(obj)) {
+ case 'string':
+ const ret = this.string(obj);
+ if (ret !== obj) {
+ console.log('XSS protection changed string ' + name + ' from "' + obj + '" to "' + ret + '"');
+ }
+ return ret;
+
+ case 'object':
+ if (obj === null) {
+ return obj;
+ }
+
+ if (Array.isArray(obj)) {
+ // console.log('checking array "' + name + '"');
+
+ let len = obj.length;
+ while (len--) {
+ obj[len] = this.object(name + '[' + len + ']', obj[len], ignore_regex);
+ }
+ } else {
+ // console.log('checking object "' + name + '"');
+
+ for (var i in obj) {
+ if (obj.hasOwnProperty(i) === false) {
+ continue;
+ }
+ if (this.string(i) !== i) {
+ console.log('XSS protection removed invalid object member "' + name + '.' + i + '"');
+ delete obj[i];
+ } else {
+ obj[i] = this.object(name + '.' + i, obj[i], ignore_regex);
+ }
+ }
+ }
+ return obj;
+
+ default:
+ return obj;
+ }
+ },
+
+ checkOptional: function (name, obj, ignore_regex) {
+ if (this.enabled) {
+ //console.log('XSS: checking optional "' + name + '"...');
+ return this.object(name, obj, ignore_regex);
+ }
+ return obj;
+ },
+
+ checkAlways: function (name, obj, ignore_regex) {
+ //console.log('XSS: checking always "' + name + '"...');
+ return this.object(name, obj, ignore_regex);
+ },
+
+ checkData: function (name, obj, ignore_regex) {
+ if (this.enabled_for_data) {
+ //console.log('XSS: checking data "' + name + '"...');
+ return this.object(name, obj, ignore_regex);
+ }
+ return obj;
+ }
+};
+NETDATA.colorHex2Rgb = function (hex) {
+ // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
+ let shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
+ hex = hex.replace(shorthandRegex, function (m, r, g, b) {
+ return r + r + g + g + b + b;
+ });
+
+ let result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+ return result ? {
+ r: parseInt(result[1], 16),
+ g: parseInt(result[2], 16),
+ b: parseInt(result[3], 16)
+ } : null;
+};
+
+NETDATA.colorLuminance = function (hex, lum) {
+ // validate hex string
+ hex = String(hex).replace(/[^0-9a-f]/gi, '');
+ if (hex.length < 6) {
+ hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+ }
+
+ lum = lum || 0;
+
+ // convert to decimal and change luminosity
+ let rgb = "#";
+ for (let i = 0; i < 3; i++) {
+ let c = parseInt(hex.substr(i * 2, 2), 16);
+ c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
+ rgb += ("00" + c).substr(c.length);
+ }
+
+ return rgb;
+};
+NETDATA.unitsConversion = {
+ keys: {}, // keys for data-common-units
+ latest: {}, // latest selected units for data-common-units
+
+ globalReset: function () {
+ this.keys = {};
+ this.latest = {};
+ },
+
+ scalableUnits: {
+ 'packets/s': {
+ 'pps': 1,
+ 'Kpps': 1000,
+ 'Mpps': 1000000
+ },
+ 'pps': {
+ 'pps': 1,
+ 'Kpps': 1000,
+ 'Mpps': 1000000
+ },
+ 'kilobits/s': {
+ 'bits/s': 1 / 1000,
+ 'kilobits/s': 1,
+ 'megabits/s': 1000,
+ 'gigabits/s': 1000000,
+ 'terabits/s': 1000000000
+ },
+ 'bytes/s': {
+ 'bytes/s': 1,
+ 'kilobytes/s': 1024,
+ 'megabytes/s': 1024 * 1024,
+ 'gigabytes/s': 1024 * 1024 * 1024,
+ 'terabytes/s': 1024 * 1024 * 1024 * 1024
+ },
+ 'kilobytes/s': {
+ 'bytes/s': 1 / 1024,
+ 'kilobytes/s': 1,
+ 'megabytes/s': 1024,
+ 'gigabytes/s': 1024 * 1024,
+ 'terabytes/s': 1024 * 1024 * 1024
+ },
+ 'B/s': {
+ 'B/s': 1,
+ 'KiB/s': 1024,
+ 'MiB/s': 1024 * 1024,
+ 'GiB/s': 1024 * 1024 * 1024,
+ 'TiB/s': 1024 * 1024 * 1024 * 1024
+ },
+ 'KB/s': {
+ 'B/s': 1 / 1024,
+ 'KB/s': 1,
+ 'MB/s': 1024,
+ 'GB/s': 1024 * 1024,
+ 'TB/s': 1024 * 1024 * 1024
+ },
+ 'KiB/s': {
+ 'B/s': 1 / 1024,
+ 'KiB/s': 1,
+ 'MiB/s': 1024,
+ 'GiB/s': 1024 * 1024,
+ 'TiB/s': 1024 * 1024 * 1024
+ },
+ 'B': {
+ 'B': 1,
+ 'KiB': 1024,
+ 'MiB': 1024 * 1024,
+ 'GiB': 1024 * 1024 * 1024,
+ 'TiB': 1024 * 1024 * 1024 * 1024,
+ 'PiB': 1024 * 1024 * 1024 * 1024 * 1024
+ },
+ 'KB': {
+ 'B': 1 / 1024,
+ 'KB': 1,
+ 'MB': 1024,
+ 'GB': 1024 * 1024,
+ 'TB': 1024 * 1024 * 1024
+ },
+ 'KiB': {
+ 'B': 1 / 1024,
+ 'KiB': 1,
+ 'MiB': 1024,
+ 'GiB': 1024 * 1024,
+ 'TiB': 1024 * 1024 * 1024
+ },
+ 'MB': {
+ 'B': 1 / (1024 * 1024),
+ 'KB': 1 / 1024,
+ 'MB': 1,
+ 'GB': 1024,
+ 'TB': 1024 * 1024,
+ 'PB': 1024 * 1024 * 1024
+ },
+ 'MiB': {
+ 'B': 1 / (1024 * 1024),
+ 'KiB': 1 / 1024,
+ 'MiB': 1,
+ 'GiB': 1024,
+ 'TiB': 1024 * 1024,
+ 'PiB': 1024 * 1024 * 1024
+ },
+ 'GB': {
+ 'B': 1 / (1024 * 1024 * 1024),
+ 'KB': 1 / (1024 * 1024),
+ 'MB': 1 / 1024,
+ 'GB': 1,
+ 'TB': 1024,
+ 'PB': 1024 * 1024,
+ 'EB': 1024 * 1024 * 1024
+ },
+ 'GiB': {
+ 'B': 1 / (1024 * 1024 * 1024),
+ 'KiB': 1 / (1024 * 1024),
+ 'MiB': 1 / 1024,
+ 'GiB': 1,
+ 'TiB': 1024,
+ 'PiB': 1024 * 1024,
+ 'EiB': 1024 * 1024 * 1024
+ },
+ 'num': {
+ 'num': 1,
+ 'num (K)': 1000,
+ 'num (M)': 1000000,
+ 'num (G)': 1000000000,
+ 'num (T)': 1000000000000
+ }
+ /*
+ 'milliseconds': {
+ 'seconds': 1000
+ },
+ 'seconds': {
+ 'milliseconds': 0.001,
+ 'seconds': 1,
+ 'minutes': 60,
+ 'hours': 3600,
+ 'days': 86400
+ }
+ */
+ },
+
+ convertibleUnits: {
+ 'Celsius': {
+ 'Fahrenheit': {
+ check: function (max) {
+ void(max);
+ return NETDATA.options.current.temperature === 'fahrenheit';
+ },
+ convert: function (value) {
+ return value * 9 / 5 + 32;
+ }
+ }
+ },
+ 'celsius': {
+ 'fahrenheit': {
+ check: function (max) {
+ void(max);
+ return NETDATA.options.current.temperature === 'fahrenheit';
+ },
+ convert: function (value) {
+ return value * 9 / 5 + 32;
+ }
+ }
+ },
+ 'seconds': {
+ 'time': {
+ check: function (max) {
+ void(max);
+ return NETDATA.options.current.seconds_as_time;
+ },
+ convert: function (seconds) {
+ return NETDATA.unitsConversion.seconds2time(seconds);
+ }
+ }
+ },
+ 'milliseconds': {
+ 'milliseconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time && max < 1000;
+ },
+ convert: function (milliseconds) {
+ let tms = Math.round(milliseconds * 10);
+ milliseconds = Math.floor(tms / 10);
+
+ tms -= milliseconds * 10;
+
+ return (milliseconds).toString() + '.' + tms.toString();
+ }
+ },
+ 'seconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time && max >= 1000 && max < 60000;
+ },
+ convert: function (milliseconds) {
+ milliseconds = Math.round(milliseconds);
+
+ let seconds = Math.floor(milliseconds / 1000);
+ milliseconds -= seconds * 1000;
+
+ milliseconds = Math.round(milliseconds / 10);
+
+ return seconds.toString() + '.'
+ + NETDATA.zeropad(milliseconds);
+ }
+ },
+ 'M:SS.ms': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time && max >= 60000;
+ },
+ convert: function (milliseconds) {
+ milliseconds = Math.round(milliseconds);
+
+ let minutes = Math.floor(milliseconds / 60000);
+ milliseconds -= minutes * 60000;
+
+ let seconds = Math.floor(milliseconds / 1000);
+ milliseconds -= seconds * 1000;
+
+ milliseconds = Math.round(milliseconds / 10);
+
+ return minutes.toString() + ':'
+ + NETDATA.zeropad(seconds) + '.'
+ + NETDATA.zeropad(milliseconds);
+ }
+ }
+ },
+ 'nanoseconds': {
+ 'nanoseconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time && max < 1000;
+ },
+ convert: function (nanoseconds) {
+ let tms = Math.round(nanoseconds * 10);
+ nanoseconds = Math.floor(tms / 10);
+
+ tms -= nanoseconds * 10;
+
+ return (nanoseconds).toString() + '.' + tms.toString();
+ }
+ },
+ 'microseconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time
+ && max >= 1000 && max < 1000 * 1000;
+ },
+ convert: function (nanoseconds) {
+ nanoseconds = Math.round(nanoseconds);
+
+ let microseconds = Math.floor(nanoseconds / 1000);
+ nanoseconds -= microseconds * 1000;
+
+ nanoseconds = Math.round(nanoseconds / 10 );
+
+ return microseconds.toString() + '.'
+ + NETDATA.zeropad(nanoseconds);
+ }
+ },
+ 'milliseconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time
+ && max >= 1000 * 1000 && max < 1000 * 1000 * 1000;
+ },
+ convert: function (nanoseconds) {
+ nanoseconds = Math.round(nanoseconds);
+
+ let milliseconds = Math.floor(nanoseconds / 1000 / 1000);
+ nanoseconds -= milliseconds * 1000 * 1000;
+
+ nanoseconds = Math.round(nanoseconds / 1000 / 10);
+
+ return milliseconds.toString() + '.'
+ + NETDATA.zeropad(nanoseconds);
+ }
+ },
+ 'seconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time
+ && max >= 1000 * 1000 * 1000;
+ },
+ convert: function (nanoseconds) {
+ nanoseconds = Math.round(nanoseconds);
+
+ let seconds = Math.floor(nanoseconds / 1000 / 1000 / 1000);
+ nanoseconds -= seconds * 1000 * 1000 * 1000;
+
+ nanoseconds = Math.round(nanoseconds / 1000 / 1000 / 10);
+
+ return seconds.toString() + '.'
+ + NETDATA.zeropad(nanoseconds);
+ }
+ },
+ }
+ },
+
+ seconds2time: function (seconds) {
+ seconds = Math.abs(seconds);
+
+ let days = Math.floor(seconds / 86400);
+ seconds -= days * 86400;
+
+ let hours = Math.floor(seconds / 3600);
+ seconds -= hours * 3600;
+
+ let minutes = Math.floor(seconds / 60);
+ seconds -= minutes * 60;
+
+ seconds = Math.round(seconds);
+
+ let ms_txt = '';
+ /*
+ let ms = seconds - Math.floor(seconds);
+ seconds -= ms;
+ ms = Math.round(ms * 1000);
+
+ if (ms > 1) {
+ if (ms < 10)
+ ms_txt = '.00' + ms.toString();
+ else if (ms < 100)
+ ms_txt = '.0' + ms.toString();
+ else
+ ms_txt = '.' + ms.toString();
+ }
+ */
+
+ return ((days > 0) ? days.toString() + 'd:' : '').toString()
+ + NETDATA.zeropad(hours) + ':'
+ + NETDATA.zeropad(minutes) + ':'
+ + NETDATA.zeropad(seconds)
+ + ms_txt;
+ },
+
+ // get a function that converts the units
+ // + every time units are switched call the callback
+ get: function (uuid, min, max, units, desired_units, common_units_name, switch_units_callback) {
+ // validate the parameters
+ if (typeof units === 'undefined') {
+ units = 'undefined';
+ }
+
+ // check if we support units conversion
+ if (typeof this.scalableUnits[units] === 'undefined' && typeof this.convertibleUnits[units] === 'undefined') {
+ // we can't convert these units
+ //console.log('DEBUG: ' + uuid.toString() + ' can\'t convert units: ' + units.toString());
+ return function (value) {
+ return value;
+ };
+ }
+
+ // check if the caller wants the original units
+ if (typeof desired_units === 'undefined' || desired_units === null || desired_units === 'original' || desired_units === units) {
+ //console.log('DEBUG: ' + uuid.toString() + ' original units wanted');
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+
+ // now we know we can convert the units
+ // and the caller wants some kind of conversion
+
+ let tunits = null;
+ let tdivider = 0;
+
+ if (typeof this.scalableUnits[units] !== 'undefined') {
+ // units that can be scaled
+ // we decide a divider
+
+ // console.log('NETDATA.unitsConversion.get(' + units.toString() + ', ' + desired_units.toString() + ', function()) decide divider with min = ' + min.toString() + ', max = ' + max.toString());
+
+ if (desired_units === 'auto') {
+ // the caller wants to auto-scale the units
+
+ // find the absolute maximum value that is rendered on the chart
+ // based on this we decide the scale
+ min = Math.abs(min);
+ max = Math.abs(max);
+ if (min > max) {
+ max = min;
+ }
+
+ // find the smallest scale that provides integers
+ // for (x in this.scalableUnits[units]) {
+ // if (this.scalableUnits[units].hasOwnProperty(x)) {
+ // let m = this.scalableUnits[units][x];
+ // if (m <= max && m > tdivider) {
+ // tunits = x;
+ // tdivider = m;
+ // }
+ // }
+ // }
+ const sunit = this.scalableUnits[units];
+ for (var x of Object.keys(sunit)) {
+ let m = sunit[x];
+ if (m <= max && m > tdivider) {
+ tunits = x;
+ tdivider = m;
+ }
+ }
+
+ if (tunits === null || tdivider <= 0) {
+ // we couldn't find one
+ //console.log('DEBUG: ' + uuid.toString() + ' cannot find an auto-scaling candidate for units: ' + units.toString() + ' (max: ' + max.toString() + ')');
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+
+ if (typeof common_units_name === 'string' && typeof uuid === 'string') {
+ // the caller wants several charts to have the same units
+ // data-common-units
+
+ let common_units_key = common_units_name + '-' + units;
+
+ // add our divider into the list of keys
+ let t = this.keys[common_units_key];
+ if (typeof t === 'undefined') {
+ this.keys[common_units_key] = {};
+ t = this.keys[common_units_key];
+ }
+ t[uuid] = {
+ units: tunits,
+ divider: tdivider
+ };
+
+ // find the max divider of all charts
+ let common_units = t[uuid];
+ for (var x in t) {
+ if (t.hasOwnProperty(x) && t[x].divider > common_units.divider) {
+ common_units = t[x];
+ }
+ }
+
+ // save our common_max to the latest keys
+ let latest = this.latest[common_units_key];
+ if (typeof latest === 'undefined') {
+ this.latest[common_units_key] = {};
+ latest = this.latest[common_units_key];
+ }
+ latest.units = common_units.units;
+ latest.divider = common_units.divider;
+
+ tunits = latest.units;
+ tdivider = latest.divider;
+
+ //console.log('DEBUG: ' + uuid.toString() + ' converted units: ' + units.toString() + ' to units: ' + tunits.toString() + ' with divider ' + tdivider.toString() + ', common-units=' + common_units_name.toString() + ((t[uuid].divider !== tdivider)?' USED COMMON, mine was ' + t[uuid].units:' set common').toString());
+
+ // apply it to this chart
+ switch_units_callback(tunits);
+ return function (value) {
+ if (tdivider !== latest.divider) {
+ // another chart switched our common units
+ // we should switch them too
+ //console.log('DEBUG: ' + uuid + ' switching units due to a common-units change, from ' + tunits.toString() + ' to ' + latest.units.toString());
+ tunits = latest.units;
+ tdivider = latest.divider;
+ switch_units_callback(tunits);
+ }
+
+ return value / tdivider;
+ };
+ } else {
+ // the caller did not give data-common-units
+ // this chart auto-scales independently of all others
+ //console.log('DEBUG: ' + uuid.toString() + ' converted units: ' + units.toString() + ' to units: ' + tunits.toString() + ' with divider ' + tdivider.toString() + ', autonomously');
+
+ switch_units_callback(tunits);
+ return function (value) {
+ return value / tdivider;
+ };
+ }
+ } else {
+ // the caller wants specific units
+
+ if (typeof this.scalableUnits[units][desired_units] !== 'undefined') {
+ // all good, set the new units
+ tdivider = this.scalableUnits[units][desired_units];
+ // console.log('DEBUG: ' + uuid.toString() + ' converted units: ' + units.toString() + ' to units: ' + desired_units.toString() + ' with divider ' + tdivider.toString() + ', by reference');
+ switch_units_callback(desired_units);
+ return function (value) {
+ return value / tdivider;
+ };
+ } else {
+ // oops! switch back to original units
+ console.log('Units conversion from ' + units.toString() + ' to ' + desired_units.toString() + ' is not supported.');
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+ }
+ } else if (typeof this.convertibleUnits[units] !== 'undefined') {
+ // units that can be converted
+ if (desired_units === 'auto') {
+ for (var x in this.convertibleUnits[units]) {
+ if (this.convertibleUnits[units].hasOwnProperty(x)) {
+ if (this.convertibleUnits[units][x].check(max)) {
+ //console.log('DEBUG: ' + uuid.toString() + ' converting ' + units.toString() + ' to: ' + x.toString());
+ switch_units_callback(x);
+ return this.convertibleUnits[units][x].convert;
+ }
+ }
+ }
+
+ // none checked ok
+ //console.log('DEBUG: ' + uuid.toString() + ' no conversion available for ' + units.toString() + ' to: ' + desired_units.toString());
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ } else if (typeof this.convertibleUnits[units][desired_units] !== 'undefined') {
+ switch_units_callback(desired_units);
+ return this.convertibleUnits[units][desired_units].convert;
+ } else {
+ console.log('Units conversion from ' + units.toString() + ' to ' + desired_units.toString() + ' is not supported.');
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+ } else {
+ // hm... did we forget to implement the new type?
+ console.log(`Unmatched unit conversion method for units ${units.toString()}`);
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+ }
+};
+
+NETDATA.icons = {
+ left: '<i class="fas fa-backward"></i>',
+ reset: '<i class="fas fa-play"></i>',
+ right: '<i class="fas fa-forward"></i>',
+ zoomIn: '<i class="fas fa-plus"></i>',
+ zoomOut: '<i class="fas fa-minus"></i>',
+ resize: '<i class="fas fa-sort"></i>',
+ lineChart: '<i class="fas fa-chart-line"></i>',
+ areaChart: '<i class="fas fa-chart-area"></i>',
+ noChart: '<i class="fas fa-chart-area"></i>',
+ loading: '<i class="fas fa-sync-alt"></i>',
+ noData: '<i class="fas fa-exclamation-triangle"></i>'
+};
+
+if (typeof netdataIcons === 'object') {
+ // for (let icon in NETDATA.icons) {
+ // if (NETDATA.icons.hasOwnProperty(icon) && typeof(netdataIcons[icon]) === 'string')
+ // NETDATA.icons[icon] = netdataIcons[icon];
+ // }
+ for (var icon of Object.keys(NETDATA.icons)) {
+ if (typeof(netdataIcons[icon]) === 'string') {
+ NETDATA.icons[icon] = netdataIcons[icon]
+ }
+ }
+}
+
+if (typeof netdataSnapshotData === 'undefined') {
+ netdataSnapshotData = null;
+}
+
+if (typeof netdataShowHelp === 'undefined') {
+ netdataShowHelp = true;
+}
+
+if (typeof netdataShowAlarms === 'undefined') {
+ netdataShowAlarms = false;
+}
+
+if (typeof netdataRegistryAfterMs !== 'number' || netdataRegistryAfterMs < 0) {
+ netdataRegistryAfterMs = 0; // 1500;
+}
+
+if (typeof netdataRegistry === 'undefined') {
+ // backward compatibility
+ netdataRegistry = (typeof netdataNoRegistry !== 'undefined' && netdataNoRegistry === false);
+}
+
+if (netdataRegistry === false && typeof netdataRegistryCallback === 'function') {
+ netdataRegistry = true;
+}
+
+// ----------------------------------------------------------------------------------------------------------------
+// the defaults for all charts
+
+// if the user does not specify any of these, the following will be used
+
+NETDATA.chartDefaults = {
+ width: '100%', // the chart width - can be null
+ height: '100%', // the chart height - can be null
+ min_width: null, // the chart minimum width - can be null
+ library: 'dygraph', // the graphing library to use
+ method: 'average', // the grouping method
+ before: 0, // panning
+ after: -600, // panning
+ pixels_per_point: 1, // the detail of the chart
+ fill_luminance: 0.8 // luminance of colors in solid areas
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// global options
+
+NETDATA.options = {
+ pauseCallback: null, // a callback when we are really paused
+
+ pause: false, // when enabled we don't auto-refresh the charts
+
+ targets: [], // an array of all the state objects that are
+ // currently active (independently of their
+ // viewport visibility)
+
+ updated_dom: true, // when true, the DOM has been updated with
+ // new elements we have to check.
+
+ auto_refresher_fast_weight: 0, // this is the current time in ms, spent
+ // rendering charts continuously.
+ // used with .current.fast_render_timeframe
+
+ page_is_visible: true, // when true, this page is visible
+
+ auto_refresher_stop_until: 0, // timestamp in ms - used internally, to stop the
+ // auto-refresher for some time (when a chart is
+ // performing pan or zoom, we need to stop refreshing
+ // all other charts, to have the maximum speed for
+ // rendering the chart that is panned or zoomed).
+ // Used with .current.global_pan_sync_time
+
+ on_scroll_refresher_stop_until: 0, // timestamp in ms - used to stop evaluating
+ // charts for some time, after a page scroll
+
+ last_page_resize: Date.now(), // the timestamp of the last resize request
+
+ last_page_scroll: 0, // the timestamp the last time the page was scrolled
+
+ browser_timezone: 'unknown', // timezone detected by javascript
+ server_timezone: 'unknown', // timezone reported by the server
+
+ force_data_points: 0, // force the number of points to be returned for charts
+ fake_chart_rendering: false, // when set to true, the dashboard will download data but will not render the charts
+
+ passive_events: null, // true if the browser supports passive events
+
+ // the current profile
+ // we may have many...
+ current: {
+ units: 'auto', // can be 'auto' or 'original'
+ temperature: 'celsius', // can be 'celsius' or 'fahrenheit'
+ seconds_as_time: true, // show seconds as DDd:HH:MM:SS ?
+ timezone: 'default', // the timezone to use, or 'default'
+ user_set_server_timezone: 'default', // as set by the user on the dashboard
+
+ legend_toolbox: true, // show the legend toolbox on charts
+ resize_charts: true, // show the resize handler on charts
+
+ pixels_per_point: isSlowDevice() ? 5 : 1, // the minimum pixels per point for all charts
+ // increase this to speed javascript up
+ // each chart library has its own limit too
+ // the max of this and the chart library is used
+ // the final is calculated every time, so a change
+ // here will have immediate effect on the next chart
+ // update
+
+ idle_between_charts: 100, // ms - how much time to wait between chart updates
+
+ fast_render_timeframe: 200, // ms - render continuously until this time of continuous
+ // rendering has been reached
+ // this setting is used to make it render e.g. 10
+ // charts at once, sleep idle_between_charts time
+ // and continue for another 10 charts.
+
+ idle_between_loops: 500, // ms - if all charts have been updated, wait this
+ // time before starting again.
+
+ idle_parallel_loops: 100, // ms - the time between parallel refresher updates
+
+ idle_lost_focus: 500, // ms - when the window does not have focus, check
+ // if focus has been regained, every this time
+
+ global_pan_sync_time: 300, // ms - when you pan or zoom a chart, the background
+ // auto-refreshing of charts is paused for this amount
+ // of time
+
+ sync_selection_delay: 400, // ms - when you pan or zoom a chart, wait this amount
+ // of time before setting up synchronized selections
+ // on hover.
+
+ sync_selection: true, // enable or disable selection sync
+
+ pan_and_zoom_delay: 50, // when panning or zooming, how ofter to update the chart
+
+ sync_pan_and_zoom: true, // enable or disable pan and zoom sync
+
+ pan_and_zoom_data_padding: true, // fetch more data for the master chart when panning or zooming
+
+ update_only_visible: true, // enable or disable visibility management / used for printing
+
+ parallel_refresher: !isSlowDevice(), // enable parallel refresh of charts
+
+ concurrent_refreshes: true, // when parallel_refresher is enabled, sync also the charts
+
+ destroy_on_hide: isSlowDevice(), // destroy charts when they are not visible
+
+ show_help: netdataShowHelp, // when enabled the charts will show some help
+ show_help_delay_show_ms: 500,
+ show_help_delay_hide_ms: 0,
+
+ eliminate_zero_dimensions: true, // do not show dimensions with just zeros
+
+ stop_updates_when_focus_is_lost: true, // boolean - shall we stop auto-refreshes when document does not have user focus
+ stop_updates_while_resizing: 1000, // ms - time to stop auto-refreshes while resizing the charts
+
+ double_click_speed: 500, // ms - time between clicks / taps to detect double click/tap
+
+ smooth_plot: !isSlowDevice(), // enable smooth plot, where possible
+
+ color_fill_opacity_line: 1.0,
+ color_fill_opacity_area: 0.2,
+ color_fill_opacity_stacked: 0.8,
+
+ pan_and_zoom_factor: 0.25, // the increment when panning and zooming with the toolbox
+ pan_and_zoom_factor_multiplier_control: 2.0,
+ pan_and_zoom_factor_multiplier_shift: 3.0,
+ pan_and_zoom_factor_multiplier_alt: 4.0,
+
+ abort_ajax_on_scroll: false, // kill pending ajax page scroll
+ async_on_scroll: false, // sync/async onscroll handler
+ onscroll_worker_duration_threshold: 30, // time in ms, for async scroll handler
+
+ retries_on_data_failures: 3, // how many retries to make if we can't fetch chart data from the server
+
+ setOptionCallback: function () {
+ }
+ },
+
+ debug: {
+ show_boxes: false,
+ main_loop: false,
+ focus: false,
+ visibility: false,
+ chart_data_url: false,
+ chart_errors: true, // remember to set it to false before merging
+ chart_timing: false,
+ chart_calls: false,
+ libraries: false,
+ dygraph: false,
+ globalSelectionSync: false,
+ globalPanAndZoom: false
+ }
+};
+
+NETDATA.statistics = {
+ refreshes_total: 0,
+ refreshes_active: 0,
+ refreshes_active_max: 0
+};
+
+// local storage options
+
+NETDATA.localStorage = {
+ default: {},
+ current: {},
+ callback: {} // only used for resetting back to defaults
+};
+
+NETDATA.localStorageTested = -1;
+NETDATA.localStorageTest = function () {
+ if (NETDATA.localStorageTested !== -1) {
+ return NETDATA.localStorageTested;
+ }
+
+ if (typeof Storage !== "undefined" && typeof localStorage === 'object') {
+ let test = 'test';
+ try {
+ localStorage.setItem(test, test);
+ localStorage.removeItem(test);
+ NETDATA.localStorageTested = true;
+ } catch (e) {
+ NETDATA.localStorageTested = false;
+ }
+ } else {
+ NETDATA.localStorageTested = false;
+ }
+
+ return NETDATA.localStorageTested;
+};
+
+NETDATA.localStorageGet = function (key, def, callback) {
+ let ret = def;
+
+ if (typeof NETDATA.localStorage.default[key.toString()] === 'undefined') {
+ NETDATA.localStorage.default[key.toString()] = def;
+ NETDATA.localStorage.callback[key.toString()] = callback;
+ }
+
+ if (NETDATA.localStorageTest()) {
+ try {
+ // console.log('localStorage: loading "' + key.toString() + '"');
+ ret = localStorage.getItem(key.toString());
+ // console.log('netdata loaded: ' + key.toString() + ' = ' + ret.toString());
+ if (ret === null || ret === 'undefined') {
+ // console.log('localStorage: cannot load it, saving "' + key.toString() + '" with value "' + JSON.stringify(def) + '"');
+ localStorage.setItem(key.toString(), JSON.stringify(def));
+ ret = def;
+ } else {
+ // console.log('localStorage: got "' + key.toString() + '" with value "' + ret + '"');
+ ret = JSON.parse(ret);
+ // console.log('localStorage: loaded "' + key.toString() + '" as value ' + ret + ' of type ' + typeof(ret));
+ }
+ } catch (error) {
+ console.log('localStorage: failed to read "' + key.toString() + '", using default: "' + def.toString() + '"');
+ ret = def;
+ }
+ }
+
+ if (typeof ret === 'undefined' || ret === 'undefined') {
+ console.log('localStorage: LOADED UNDEFINED "' + key.toString() + '" as value ' + ret + ' of type ' + typeof(ret));
+ ret = def;
+ }
+
+ NETDATA.localStorage.current[key.toString()] = ret;
+ return ret;
+};
+
+NETDATA.localStorageSet = function (key, value, callback) {
+ if (typeof value === 'undefined' || value === 'undefined') {
+ console.log('localStorage: ATTEMPT TO SET UNDEFINED "' + key.toString() + '" as value ' + value + ' of type ' + typeof(value));
+ }
+
+ if (typeof NETDATA.localStorage.default[key.toString()] === 'undefined') {
+ NETDATA.localStorage.default[key.toString()] = value;
+ NETDATA.localStorage.current[key.toString()] = value;
+ NETDATA.localStorage.callback[key.toString()] = callback;
+ }
+
+ if (NETDATA.localStorageTest()) {
+ // console.log('localStorage: saving "' + key.toString() + '" with value "' + JSON.stringify(value) + '"');
+ try {
+ localStorage.setItem(key.toString(), JSON.stringify(value));
+ } catch (e) {
+ console.log('localStorage: failed to save "' + key.toString() + '" with value: "' + value.toString() + '"');
+ }
+ }
+
+ NETDATA.localStorage.current[key.toString()] = value;
+ return value;
+};
+
+NETDATA.localStorageGetRecursive = function (obj, prefix, callback) {
+ let keys = Object.keys(obj);
+ let len = keys.length;
+ while (len--) {
+ let i = keys[len];
+
+ if (typeof obj[i] === 'object') {
+ //console.log('object ' + prefix + '.' + i.toString());
+ NETDATA.localStorageGetRecursive(obj[i], prefix + '.' + i.toString(), callback);
+ continue;
+ }
+
+ obj[i] = NETDATA.localStorageGet(prefix + '.' + i.toString(), obj[i], callback);
+ }
+};
+
+NETDATA.setOption = function (key, value) {
+ if (key.toString() === 'setOptionCallback') {
+ if (typeof NETDATA.options.current.setOptionCallback === 'function') {
+ NETDATA.options.current[key.toString()] = value;
+ NETDATA.options.current.setOptionCallback();
+ }
+ } else if (NETDATA.options.current[key.toString()] !== value) {
+ let name = 'options.' + key.toString();
+
+ if (typeof NETDATA.localStorage.default[name.toString()] === 'undefined') {
+ console.log('localStorage: setOption() on unsaved option: "' + name.toString() + '", value: ' + value);
+ }
+
+ //console.log(NETDATA.localStorage);
+ //console.log('setOption: setting "' + key.toString() + '" to "' + value + '" of type ' + typeof(value) + ' original type ' + typeof(NETDATA.options.current[key.toString()]));
+ //console.log(NETDATA.options);
+ NETDATA.options.current[key.toString()] = NETDATA.localStorageSet(name.toString(), value, null);
+
+ if (typeof NETDATA.options.current.setOptionCallback === 'function') {
+ NETDATA.options.current.setOptionCallback();
+ }
+ }
+
+ return true;
+};
+
+NETDATA.getOption = function (key) {
+ return NETDATA.options.current[key.toString()];
+};
+
+// read settings from local storage
+NETDATA.localStorageGetRecursive(NETDATA.options.current, 'options', null);
+
+// always start with this option enabled.
+NETDATA.setOption('stop_updates_when_focus_is_lost', true);
+
+NETDATA.resetOptions = function () {
+ let keys = Object.keys(NETDATA.localStorage.default);
+ let len = keys.length;
+
+ while (len--) {
+ let i = keys[len];
+ let a = i.split('.');
+
+ if (a[0] === 'options') {
+ if (a[1] === 'setOptionCallback') {
+ continue;
+ }
+ if (typeof NETDATA.localStorage.default[i] === 'undefined') {
+ continue;
+ }
+ if (NETDATA.options.current[i] === NETDATA.localStorage.default[i]) {
+ continue;
+ }
+
+ NETDATA.setOption(a[1], NETDATA.localStorage.default[i]);
+ } else if (a[0] === 'chart_heights') {
+ if (typeof NETDATA.localStorage.callback[i] === 'function' && typeof NETDATA.localStorage.default[i] !== 'undefined') {
+ NETDATA.localStorage.callback[i](NETDATA.localStorage.default[i]);
+ }
+ }
+ }
+
+ NETDATA.dateTime.init(NETDATA.options.current.timezone);
+};
+
+// *** src/dashboard.js/timeout.js
+
+// TODO: Better name needed
+
+NETDATA.timeout = {
+ // by default, these are just wrappers to setTimeout() / clearTimeout()
+
+ step: function (callback) {
+ return window.setTimeout(callback, 1000 / 60);
+ },
+
+ set: function (callback, delay) {
+ return window.setTimeout(callback, delay);
+ },
+
+ clear: function (id) {
+ return window.clearTimeout(id);
+ },
+
+ init: function () {
+ let custom = true;
+
+ if (window.requestAnimationFrame) {
+ this.step = function (callback) {
+ return window.requestAnimationFrame(callback);
+ };
+
+ this.clear = function (handle) {
+ return window.cancelAnimationFrame(handle.value);
+ };
+ // } else if (window.webkitRequestAnimationFrame) {
+ // this.step = function (callback) {
+ // return window.webkitRequestAnimationFrame(callback);
+ // };
+
+ // if (window.webkitCancelAnimationFrame) {
+ // this.clear = function (handle) {
+ // return window.webkitCancelAnimationFrame(handle.value);
+ // };
+ // } else if (window.webkitCancelRequestAnimationFrame) {
+ // this.clear = function (handle) {
+ // return window.webkitCancelRequestAnimationFrame(handle.value);
+ // };
+ // }
+ // } else if (window.mozRequestAnimationFrame) {
+ // this.step = function (callback) {
+ // return window.mozRequestAnimationFrame(callback);
+ // };
+
+ // this.clear = function (handle) {
+ // return window.mozCancelRequestAnimationFrame(handle.value);
+ // };
+ // } else if (window.oRequestAnimationFrame) {
+ // this.step = function (callback) {
+ // return window.oRequestAnimationFrame(callback);
+ // };
+
+ // this.clear = function (handle) {
+ // return window.oCancelRequestAnimationFrame(handle.value);
+ // };
+ // } else if (window.msRequestAnimationFrame) {
+ // this.step = function (callback) {
+ // return window.msRequestAnimationFrame(callback);
+ // };
+
+ // this.clear = function (handle) {
+ // return window.msCancelRequestAnimationFrame(handle.value);
+ // };
+ } else {
+ custom = false;
+ }
+
+ if (custom) {
+ // we have installed custom .step() / .clear() functions
+ // overwrite the .set() too
+
+ this.set = function (callback, delay) {
+ let start = Date.now(),
+ handle = new Object();
+
+ const loop = () => {
+ let current = Date.now(),
+ delta = current - start;
+
+ if (delta >= delay) {
+ callback.call();
+ } else {
+ handle.value = this.step(loop);
+ }
+ }
+
+ handle.value = this.step(loop);
+ return handle;
+ };
+ }
+ }
+};
+
+NETDATA.timeout.init();
+// Codacy declarations
+/* global netdataTheme */
+
+NETDATA.themes = {
+ white: {
+ bootstrap_css: NETDATA.serverStatic + 'css/bootstrap-3.3.7.css',
+ dashboard_css: NETDATA.serverStatic + 'dashboard.css?v20190902-0',
+ background: '#FFFFFF',
+ foreground: '#000000',
+ grid: '#F0F0F0',
+ axis: '#F0F0F0',
+ highlight: '#F5F5F5',
+ colors: ['#3366CC', '#DC3912', '#109618', '#FF9900', '#990099', '#DD4477',
+ '#3B3EAC', '#66AA00', '#0099C6', '#B82E2E', '#AAAA11', '#5574A6',
+ '#994499', '#22AA99', '#6633CC', '#E67300', '#316395', '#8B0707',
+ '#329262', '#3B3EAC'],
+ easypiechart_track: '#f0f0f0',
+ easypiechart_scale: '#dfe0e0',
+ gauge_pointer: '#C0C0C0',
+ gauge_stroke: '#F0F0F0',
+ gauge_gradient: false,
+ d3pie: {
+ title: '#333333',
+ subtitle: '#666666',
+ footer: '#888888',
+ other: '#aaaaaa',
+ mainlabel: '#333333',
+ percentage: '#dddddd',
+ value: '#aaaa22',
+ tooltip_bg: '#000000',
+ tooltip_fg: '#efefef',
+ segment_stroke: "#ffffff",
+ gradient_color: '#000000'
+ }
+ },
+ slate: {
+ bootstrap_css: NETDATA.serverStatic + 'css/bootstrap-slate-flat-3.3.7.css?v20161229-1',
+ dashboard_css: NETDATA.serverStatic + 'dashboard.slate.css?v20190902-0',
+ background: '#272b30',
+ foreground: '#C8C8C8',
+ grid: '#283236',
+ axis: '#283236',
+ highlight: '#383838',
+ /* colors: [ '#55bb33', '#ff2222', '#0099C6', '#faa11b', '#adbce0', '#DDDD00',
+ '#4178ba', '#f58122', '#a5cc39', '#f58667', '#f5ef89', '#cf93c0',
+ '#a5d18a', '#b8539d', '#3954a3', '#c8a9cf', '#c7de8a', '#fad20a',
+ '#a6a479', '#a66da8' ],
+ */
+ colors: ['#66AA00', '#FE3912', '#3366CC', '#D66300', '#0099C6', '#DDDD00',
+ '#5054e6', '#EE9911', '#BB44CC', '#e45757', '#ef0aef', '#CC7700',
+ '#22AA99', '#109618', '#905bfd', '#f54882', '#4381bf', '#ff3737',
+ '#329262', '#3B3EFF'],
+ easypiechart_track: '#373b40',
+ easypiechart_scale: '#373b40',
+ gauge_pointer: '#474b50',
+ gauge_stroke: '#373b40',
+ gauge_gradient: false,
+ d3pie: {
+ title: '#C8C8C8',
+ subtitle: '#283236',
+ footer: '#283236',
+ other: '#283236',
+ mainlabel: '#C8C8C8',
+ percentage: '#dddddd',
+ value: '#cccc44',
+ tooltip_bg: '#272b30',
+ tooltip_fg: '#C8C8C8',
+ segment_stroke: "#283236",
+ gradient_color: '#000000'
+ }
+ }
+};
+
+if (typeof netdataTheme !== 'undefined' && typeof NETDATA.themes[netdataTheme] !== 'undefined') {
+ NETDATA.themes.current = NETDATA.themes[netdataTheme];
+} else {
+ NETDATA.themes.current = NETDATA.themes.white;
+}
+
+NETDATA.colors = NETDATA.themes.current.colors;
+
+// these are the colors Google Charts are using
+// we have them here to attempt emulate their look and feel on the other chart libraries
+// http://there4.io/2012/05/02/google-chart-color-list/
+//NETDATA.colors = [ '#3366CC', '#DC3912', '#FF9900', '#109618', '#990099', '#3B3EAC', '#0099C6',
+// '#DD4477', '#66AA00', '#B82E2E', '#316395', '#994499', '#22AA99', '#AAAA11',
+// '#6633CC', '#E67300', '#8B0707', '#329262', '#5574A6', '#3B3EAC' ];
+
+// an alternative set
+// http://www.mulinblog.com/a-color-palette-optimized-for-data-visualization/
+// (blue) (red) (orange) (green) (pink) (brown) (purple) (yellow) (gray)
+//NETDATA.colors = [ '#5DA5DA', '#F15854', '#FAA43A', '#60BD68', '#F17CB0', '#B2912F', '#B276B2', '#DECF3F', '#4D4D4D' ];
+// dygraph
+
+// Codacy declarations
+/* global smoothPlotter */
+/* global Dygraph */
+
+NETDATA.dygraph = {
+ smooth: false
+};
+
+NETDATA.dygraphToolboxPanAndZoom = function (state, after, before) {
+ if (after < state.netdata_first) {
+ after = state.netdata_first;
+ }
+
+ if (before > state.netdata_last) {
+ before = state.netdata_last;
+ }
+
+ state.setMode('zoom');
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_user_action = true;
+ state.tmp.dygraph_force_zoom = true;
+ // state.log('toolboxPanAndZoom');
+ state.updateChartPanOrZoom(after, before);
+ NETDATA.globalPanAndZoom.setMaster(state, after, before);
+};
+
+NETDATA.dygraphSetSelection = function (state, t) {
+ if (typeof state.tmp.dygraph_instance !== 'undefined') {
+ let r = state.calculateRowForTime(t);
+ if (r !== -1) {
+ state.tmp.dygraph_instance.setSelection(r);
+ return true;
+ } else {
+ state.tmp.dygraph_instance.clearSelection();
+ state.legendShowUndefined();
+ }
+ }
+
+ return false;
+};
+
+NETDATA.dygraphClearSelection = function (state) {
+ if (typeof state.tmp.dygraph_instance !== 'undefined') {
+ state.tmp.dygraph_instance.clearSelection();
+ }
+ return true;
+};
+
+NETDATA.dygraphSmoothInitialize = function (callback) {
+ $.ajax({
+ url: NETDATA.dygraph_smooth_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.dygraph.smooth = true;
+ smoothPlotter.smoothing = 0.3;
+ })
+ .fail(function () {
+ NETDATA.dygraph.smooth = false;
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+};
+
+NETDATA.dygraphInitialize = function (callback) {
+ if (typeof netdataNoDygraphs === 'undefined' || !netdataNoDygraphs) {
+ $.ajax({
+ url: NETDATA.dygraph_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('dygraph', NETDATA.dygraph_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.dygraph.enabled = false;
+ NETDATA.error(100, NETDATA.dygraph_js);
+ })
+ .always(function () {
+ if (NETDATA.chartLibraries.dygraph.enabled && NETDATA.options.current.smooth_plot) {
+ NETDATA.dygraphSmoothInitialize(callback);
+ } else if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ } else {
+ NETDATA.chartLibraries.dygraph.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.dygraphChartUpdate = function (state, data) {
+ let dygraph = state.tmp.dygraph_instance;
+
+ if (typeof dygraph === 'undefined') {
+ return NETDATA.dygraphChartCreate(state, data);
+ }
+
+ // when the chart is not visible, and hidden
+ // if there is a window resize, dygraph detects
+ // its element size as 0x0.
+ // this will make it re-appear properly
+
+ if (state.tm.last_unhidden > state.tmp.dygraph_last_rendered) {
+ dygraph.resize();
+ }
+
+ let options = {
+ file: data.result.data,
+ colors: state.chartColors(),
+ labels: data.result.labels,
+ //labelsDivWidth: state.chartWidth() - 70,
+ includeZero: state.tmp.dygraph_include_zero,
+ visibility: state.dimensions_visibility.selected2BooleanArray(state.data.dimension_names)
+ };
+
+ if (state.tmp.dygraph_chart_type === 'stacked') {
+ if (options.includeZero && state.dimensions_visibility.countSelected() < options.visibility.length) {
+ options.includeZero = 0;
+ }
+ }
+
+ if (!NETDATA.chartLibraries.dygraph.isSparkline(state)) {
+ options.ylabel = state.units_current; // (state.units_desired === 'auto')?"":state.units_current;
+ }
+
+ if (state.tmp.dygraph_force_zoom) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphChartUpdate() forced zoom update');
+ }
+
+ options.dateWindow = (state.requested_padding !== null) ? [state.view_after, state.view_before] : null;
+ //options.isZoomedIgnoreProgrammaticZoom = true;
+ state.tmp.dygraph_force_zoom = false;
+ } else if (state.current.name !== 'auto') {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphChartUpdate() loose update');
+ }
+ } else {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphChartUpdate() strict update');
+ }
+
+ options.dateWindow = (state.requested_padding !== null) ? [state.view_after, state.view_before] : null;
+ //options.isZoomedIgnoreProgrammaticZoom = true;
+ }
+
+ options.valueRange = state.tmp.dygraph_options.valueRange;
+
+ let oldMax = null, oldMin = null;
+ if (state.tmp.__commonMin !== null) {
+ state.data.min = state.tmp.dygraph_instance.axes_[0].extremeRange[0];
+ oldMin = options.valueRange[0] = NETDATA.commonMin.get(state);
+ }
+ if (state.tmp.__commonMax !== null) {
+ state.data.max = state.tmp.dygraph_instance.axes_[0].extremeRange[1];
+ oldMax = options.valueRange[1] = NETDATA.commonMax.get(state);
+ }
+
+ if (state.tmp.dygraph_smooth_eligible) {
+ if ((NETDATA.options.current.smooth_plot && state.tmp.dygraph_options.plotter !== smoothPlotter)
+ || (NETDATA.options.current.smooth_plot === false && state.tmp.dygraph_options.plotter === smoothPlotter)) {
+ NETDATA.dygraphChartCreate(state, data);
+ return;
+ }
+ }
+
+ if (netdataSnapshotData !== null && NETDATA.globalPanAndZoom.isActive() && NETDATA.globalPanAndZoom.isMaster(state) === false) {
+ // pan and zoom on snapshots
+ options.dateWindow = [NETDATA.globalPanAndZoom.force_after_ms, NETDATA.globalPanAndZoom.force_before_ms];
+ //options.isZoomedIgnoreProgrammaticZoom = true;
+ }
+
+ if (NETDATA.chartLibraries.dygraph.isLogScale(state)) {
+ if (Array.isArray(options.valueRange) && options.valueRange[0] <= 0) {
+ options.valueRange[0] = null;
+ }
+ }
+
+ dygraph.updateOptions(options);
+
+ let redraw = false;
+ if (oldMin !== null && oldMin > state.tmp.dygraph_instance.axes_[0].extremeRange[0]) {
+ state.data.min = state.tmp.dygraph_instance.axes_[0].extremeRange[0];
+ options.valueRange[0] = NETDATA.commonMin.get(state);
+ redraw = true;
+ }
+ if (oldMax !== null && oldMax < state.tmp.dygraph_instance.axes_[0].extremeRange[1]) {
+ state.data.max = state.tmp.dygraph_instance.axes_[0].extremeRange[1];
+ options.valueRange[1] = NETDATA.commonMax.get(state);
+ redraw = true;
+ }
+
+ if (redraw) {
+ // state.log('forcing redraw to adapt to common- min/max');
+ dygraph.updateOptions(options);
+ }
+
+ state.tmp.dygraph_last_rendered = Date.now();
+ return true;
+};
+
+NETDATA.dygraphChartCreate = function (state, data) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphChartCreate()');
+ }
+
+ state.tmp.dygraph_chart_type = NETDATA.dataAttribute(state.element, 'dygraph-type', state.chart.chart_type);
+ if (state.tmp.dygraph_chart_type === 'stacked' && data.dimensions === 1) {
+ state.tmp.dygraph_chart_type = 'area';
+ }
+ if (state.tmp.dygraph_chart_type === 'stacked' && NETDATA.chartLibraries.dygraph.isLogScale(state)) {
+ state.tmp.dygraph_chart_type = 'area';
+ }
+
+ let highlightCircleSize = NETDATA.chartLibraries.dygraph.isSparkline(state) ? 3 : 4;
+
+ let smooth = NETDATA.dygraph.smooth
+ ? (NETDATA.dataAttributeBoolean(state.element, 'dygraph-smooth', (state.tmp.dygraph_chart_type === 'line' && NETDATA.chartLibraries.dygraph.isSparkline(state) === false)))
+ : false;
+
+ state.tmp.dygraph_include_zero = NETDATA.dataAttribute(state.element, 'dygraph-includezero', (state.tmp.dygraph_chart_type === 'stacked'));
+ let drawAxis = NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawaxis', true);
+
+ state.tmp.dygraph_options = {
+ colors: NETDATA.dataAttribute(state.element, 'dygraph-colors', state.chartColors()),
+
+ // leave a few pixels empty on the right of the chart
+ rightGap: NETDATA.dataAttribute(state.element, 'dygraph-rightgap', 5),
+ showRangeSelector: NETDATA.dataAttributeBoolean(state.element, 'dygraph-showrangeselector', false),
+ showRoller: NETDATA.dataAttributeBoolean(state.element, 'dygraph-showroller', false),
+ title: NETDATA.dataAttribute(state.element, 'dygraph-title', state.title),
+ titleHeight: NETDATA.dataAttribute(state.element, 'dygraph-titleheight', 19),
+ legend: NETDATA.dataAttribute(state.element, 'dygraph-legend', 'always'), // we need this to get selection events
+ labels: data.result.labels,
+ labelsDiv: NETDATA.dataAttribute(state.element, 'dygraph-labelsdiv', state.element_legend_childs.hidden),
+ //labelsDivStyles: NETDATA.dataAttribute(state.element, 'dygraph-labelsdivstyles', { 'fontSize':'1px' }),
+ //labelsDivWidth: NETDATA.dataAttribute(state.element, 'dygraph-labelsdivwidth', state.chartWidth() - 70),
+ labelsSeparateLines: NETDATA.dataAttributeBoolean(state.element, 'dygraph-labelsseparatelines', true),
+ labelsShowZeroValues: NETDATA.chartLibraries.dygraph.isLogScale(state) ? false : NETDATA.dataAttributeBoolean(state.element, 'dygraph-labelsshowzerovalues', true),
+ labelsKMB: false,
+ labelsKMG2: false,
+ showLabelsOnHighlight: NETDATA.dataAttributeBoolean(state.element, 'dygraph-showlabelsonhighlight', true),
+ hideOverlayOnMouseOut: NETDATA.dataAttributeBoolean(state.element, 'dygraph-hideoverlayonmouseout', true),
+ includeZero: state.tmp.dygraph_include_zero,
+ xRangePad: NETDATA.dataAttribute(state.element, 'dygraph-xrangepad', 0),
+ yRangePad: NETDATA.dataAttribute(state.element, 'dygraph-yrangepad', 1),
+ valueRange: NETDATA.dataAttribute(state.element, 'dygraph-valuerange', [null, null]),
+ ylabel: state.units_current, // (state.units_desired === 'auto')?"":state.units_current,
+ yLabelWidth: NETDATA.dataAttribute(state.element, 'dygraph-ylabelwidth', 12),
+
+ // the function to plot the chart
+ plotter: null,
+
+ // The width of the lines connecting data points.
+ // This can be used to increase the contrast or some graphs.
+ strokeWidth: NETDATA.dataAttribute(state.element, 'dygraph-strokewidth', ((state.tmp.dygraph_chart_type === 'stacked') ? 0.1 : ((smooth === true) ? 1.5 : 0.7))),
+ strokePattern: NETDATA.dataAttribute(state.element, 'dygraph-strokepattern', undefined),
+
+ // The size of the dot to draw on each point in pixels (see drawPoints).
+ // A dot is always drawn when a point is "isolated",
+ // i.e. there is a missing point on either side of it.
+ // This also controls the size of those dots.
+ drawPoints: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawpoints', false),
+
+ // Draw points at the edges of gaps in the data.
+ // This improves visibility of small data segments or other data irregularities.
+ drawGapEdgePoints: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawgapedgepoints', true),
+ connectSeparatedPoints: NETDATA.chartLibraries.dygraph.isLogScale(state) ? false : NETDATA.dataAttributeBoolean(state.element, 'dygraph-connectseparatedpoints', false),
+ pointSize: NETDATA.dataAttribute(state.element, 'dygraph-pointsize', 1),
+
+ // enabling this makes the chart with little square lines
+ stepPlot: NETDATA.dataAttributeBoolean(state.element, 'dygraph-stepplot', false),
+
+ // Draw a border around graph lines to make crossing lines more easily
+ // distinguishable. Useful for graphs with many lines.
+ strokeBorderColor: NETDATA.dataAttribute(state.element, 'dygraph-strokebordercolor', NETDATA.themes.current.background),
+ strokeBorderWidth: NETDATA.dataAttribute(state.element, 'dygraph-strokeborderwidth', (state.tmp.dygraph_chart_type === 'stacked') ? 0.0 : 0.0),
+ fillGraph: NETDATA.dataAttribute(state.element, 'dygraph-fillgraph', (state.tmp.dygraph_chart_type === 'area' || state.tmp.dygraph_chart_type === 'stacked')),
+ fillAlpha: NETDATA.dataAttribute(state.element, 'dygraph-fillalpha',
+ ((state.tmp.dygraph_chart_type === 'stacked')
+ ? NETDATA.options.current.color_fill_opacity_stacked
+ : NETDATA.options.current.color_fill_opacity_area)
+ ),
+ stackedGraph: NETDATA.dataAttribute(state.element, 'dygraph-stackedgraph', (state.tmp.dygraph_chart_type === 'stacked')),
+ stackedGraphNaNFill: NETDATA.dataAttribute(state.element, 'dygraph-stackedgraphnanfill', 'none'),
+ drawAxis: drawAxis,
+ axisLabelFontSize: NETDATA.dataAttribute(state.element, 'dygraph-axislabelfontsize', 10),
+ axisLineColor: NETDATA.dataAttribute(state.element, 'dygraph-axislinecolor', NETDATA.themes.current.axis),
+ axisLineWidth: NETDATA.dataAttribute(state.element, 'dygraph-axislinewidth', 1.0),
+ drawGrid: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawgrid', true),
+ gridLinePattern: NETDATA.dataAttribute(state.element, 'dygraph-gridlinepattern', null),
+ gridLineWidth: NETDATA.dataAttribute(state.element, 'dygraph-gridlinewidth', 1.0),
+ gridLineColor: NETDATA.dataAttribute(state.element, 'dygraph-gridlinecolor', NETDATA.themes.current.grid),
+ maxNumberWidth: NETDATA.dataAttribute(state.element, 'dygraph-maxnumberwidth', 8),
+ sigFigs: NETDATA.dataAttribute(state.element, 'dygraph-sigfigs', null),
+ digitsAfterDecimal: NETDATA.dataAttribute(state.element, 'dygraph-digitsafterdecimal', 2),
+ valueFormatter: NETDATA.dataAttribute(state.element, 'dygraph-valueformatter', undefined),
+ highlightCircleSize: NETDATA.dataAttribute(state.element, 'dygraph-highlightcirclesize', highlightCircleSize),
+ highlightSeriesOpts: NETDATA.dataAttribute(state.element, 'dygraph-highlightseriesopts', null), // TOO SLOW: { strokeWidth: 1.5 },
+ highlightSeriesBackgroundAlpha: NETDATA.dataAttribute(state.element, 'dygraph-highlightseriesbackgroundalpha', null), // TOO SLOW: (state.tmp.dygraph_chart_type === 'stacked')?0.7:0.5,
+ pointClickCallback: NETDATA.dataAttribute(state.element, 'dygraph-pointclickcallback', undefined),
+ visibility: state.dimensions_visibility.selected2BooleanArray(state.data.dimension_names),
+ logscale: NETDATA.chartLibraries.dygraph.isLogScale(state) ? 'y' : undefined,
+
+ // Expects a string in the format "<series name>: <style>" where each series is separated by a |
+ perSeriesStyle: NETDATA.dataAttribute(state.element, 'dygraph-per-series-style', ''),
+
+ axes: {
+ x: {
+ pixelsPerLabel: NETDATA.dataAttribute(state.element, 'dygraph-xpixelsperlabel', 50),
+ ticker: Dygraph.dateTicker,
+ axisLabelWidth: NETDATA.dataAttribute(state.element, 'dygraph-xaxislabelwidth', 60),
+ drawAxis: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawxaxis', drawAxis),
+ axisLabelFormatter: function (d, gran) {
+ void(gran);
+ return NETDATA.dateTime.xAxisTimeString(d);
+ }
+ },
+ y: {
+ logscale: NETDATA.chartLibraries.dygraph.isLogScale(state) ? true : undefined,
+ pixelsPerLabel: NETDATA.dataAttribute(state.element, 'dygraph-ypixelsperlabel', 15),
+ axisLabelWidth: NETDATA.dataAttribute(state.element, 'dygraph-yaxislabelwidth', 50),
+ drawAxis: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawyaxis', drawAxis),
+ axisLabelFormatter: function (y) {
+
+ // unfortunately, we have to call this every single time
+ state.legendFormatValueDecimalsFromMinMax(
+ this.axes_[0].extremeRange[0],
+ this.axes_[0].extremeRange[1]
+ );
+
+ let old_units = this.user_attrs_.ylabel;
+ let v = state.legendFormatValue(y);
+ let new_units = state.units_current;
+
+ if (state.units_desired === 'auto' && typeof old_units !== 'undefined' && new_units !== old_units && !NETDATA.chartLibraries.dygraph.isSparkline(state)) {
+ // console.log(this);
+ // state.log('units discrepancy: old = ' + old_units + ', new = ' + new_units);
+ let len = this.plugins_.length;
+ while (len--) {
+ // console.log(this.plugins_[len]);
+ if (typeof this.plugins_[len].plugin.ylabel_div_ !== 'undefined'
+ && this.plugins_[len].plugin.ylabel_div_ !== null
+ && typeof this.plugins_[len].plugin.ylabel_div_.children !== 'undefined'
+ && this.plugins_[len].plugin.ylabel_div_.children !== null
+ && typeof this.plugins_[len].plugin.ylabel_div_.children[0].children !== 'undefined'
+ && this.plugins_[len].plugin.ylabel_div_.children[0].children !== null
+ ) {
+ this.plugins_[len].plugin.ylabel_div_.children[0].children[0].innerHTML = new_units;
+ this.user_attrs_.ylabel = new_units;
+ break;
+ }
+ }
+
+ if (len < 0) {
+ state.log('units discrepancy, but cannot find dygraphs div to change: old = ' + old_units + ', new = ' + new_units);
+ }
+ }
+
+ return v;
+ }
+ }
+ },
+ legendFormatter: function (data) {
+ if (state.tmp.dygraph_mouse_down) {
+ return;
+ }
+
+ let elements = state.element_legend_childs;
+
+ // if the hidden div is not there
+ // we are not managing the legend
+ if (elements.hidden === null) {
+ return;
+ }
+
+ if (typeof data.x !== 'undefined') {
+ state.legendSetDate(data.x);
+ let i = data.series.length;
+ while (i--) {
+ let series = data.series[i];
+ if (series.isVisible) {
+ state.legendSetLabelValue(series.label, series.y);
+ } else {
+ state.legendSetLabelValue(series.label, null);
+ }
+ }
+ }
+
+ return '';
+ },
+ drawCallback: function (dygraph, is_initial) {
+
+ // the user has panned the chart and this is called to re-draw the chart
+ // 1. refresh this chart by adding data to it
+ // 2. notify all the other charts about the update they need
+
+ // to prevent an infinite loop (feedback), we use
+ // state.tmp.dygraph_user_action
+ // - when true, this is initiated by a user
+ // - when false, this is feedback
+
+ if (state.current.name !== 'auto' && state.tmp.dygraph_user_action) {
+ state.tmp.dygraph_user_action = false;
+
+ let x_range = dygraph.xAxisRange();
+ let after = Math.round(x_range[0]);
+ let before = Math.round(x_range[1]);
+
+ if (NETDATA.options.debug.dygraph) {
+ state.log('dygraphDrawCallback(dygraph, ' + is_initial + '): mode ' + state.current.name + ' ' + (after / 1000).toString() + ' - ' + (before / 1000).toString());
+ //console.log(state);
+ }
+
+ if (before <= state.netdata_last && after >= state.netdata_first) {
+ // update only when we are within the data limits
+ state.updateChartPanOrZoom(after, before);
+ }
+ }
+ },
+ zoomCallback: function (minDate, maxDate, yRanges) {
+
+ // the user has selected a range on the chart
+ // 1. refresh this chart by adding data to it
+ // 2. notify all the other charts about the update they need
+
+ void(yRanges);
+
+ if (NETDATA.options.debug.dygraph) {
+ state.log('dygraphZoomCallback(): ' + state.current.name);
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+ state.setMode('zoom');
+
+ // refresh it to the greatest possible zoom level
+ state.tmp.dygraph_user_action = true;
+ state.tmp.dygraph_force_zoom = true;
+ state.updateChartPanOrZoom(minDate, maxDate);
+ },
+ highlightCallback: function (event, x, points, row, seriesName) {
+ void(seriesName);
+
+ state.pauseChart();
+
+ // there is a bug in dygraph when the chart is zoomed enough
+ // the time it thinks is selected is wrong
+ // here we calculate the time t based on the row number selected
+ // which is ok
+ // let t = state.data_after + row * state.data_update_every;
+ // console.log('row = ' + row + ', x = ' + x + ', t = ' + t + ' ' + ((t === x)?'SAME':(Math.abs(x-t)<=state.data_update_every)?'SIMILAR':'DIFFERENT') + ', rows in db: ' + state.data_points + ' visible(x) = ' + state.timeIsVisible(x) + ' visible(t) = ' + state.timeIsVisible(t) + ' r(x) = ' + state.calculateRowForTime(x) + ' r(t) = ' + state.calculateRowForTime(t) + ' range: ' + state.data_after + ' - ' + state.data_before + ' real: ' + state.data.after + ' - ' + state.data.before + ' every: ' + state.data_update_every);
+
+ if (state.tmp.dygraph_mouse_down !== true) {
+ NETDATA.globalSelectionSync.sync(state, x);
+ }
+
+ // fix legend zIndex using the internal structures of dygraph legend module
+ // this works, but it is a hack!
+ // state.tmp.dygraph_instance.plugins_[0].plugin.legend_div_.style.zIndex = 10000;
+ },
+ unhighlightCallback: function (event) {
+ void(event);
+
+ if (state.tmp.dygraph_mouse_down) {
+ return;
+ }
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphUnhighlightCallback()');
+ }
+
+ state.unpauseChart();
+ NETDATA.globalSelectionSync.stop();
+ },
+ underlayCallback: function (canvas, area, g) {
+
+ // the chart is about to be drawn
+
+ // update history_tip_element
+ if (state.tmp.dygraph_history_tip_element) {
+ const xHookRightSide = g.toDomXCoord(state.netdata_first);
+ if (xHookRightSide > area.x) {
+ state.tmp.dygraph_history_tip_element_displayed = true;
+ // group the styles for possible better performance
+ state.tmp.dygraph_history_tip_element.setAttribute(
+ 'style',
+ `display: block; left: ${area.x}px; right: calc(100% - ${xHookRightSide}px);`
+ )
+ } else {
+ if (state.tmp.dygraph_history_tip_element_displayed) {
+ // additional check just for performance
+ // don't update the DOM when it's not needed
+ state.tmp.dygraph_history_tip_element.style.display = 'none';
+ state.tmp.dygraph_history_tip_element_displayed = false;
+ }
+ }
+ }
+
+ // this function renders global highlighted time-frame
+
+ if (NETDATA.globalChartUnderlay.isActive()) {
+ let after = NETDATA.globalChartUnderlay.after;
+ let before = NETDATA.globalChartUnderlay.before;
+
+ if (after < state.view_after) {
+ after = state.view_after;
+ }
+
+ if (before > state.view_before) {
+ before = state.view_before;
+ }
+
+ if (after < before) {
+ let bottom_left = g.toDomCoords(after, -20);
+ let top_right = g.toDomCoords(before, +20);
+
+ let left = bottom_left[0];
+ let right = top_right[0];
+
+ canvas.fillStyle = NETDATA.themes.current.highlight;
+ canvas.fillRect(left, area.y, right - left, area.h);
+ }
+ }
+ },
+ interactionModel: {
+ mousedown: function (event, dygraph, context) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.mousedown()');
+ }
+
+ state.tmp.dygraph_user_action = true;
+
+ if (NETDATA.options.debug.dygraph) {
+ state.log('dygraphMouseDown()');
+ }
+
+ // Right-click should not initiate anything.
+ if (event.button && event.button === 2) {
+ return;
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_mouse_down = true;
+ context.initializeMouseDown(event, dygraph, context);
+
+ //console.log(event);
+ if (event.button && event.button === 1) {
+ if (event.shiftKey) {
+ //console.log('middle mouse button dragging (PAN)');
+
+ state.setMode('pan');
+ // NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_highlight_after = null;
+ Dygraph.startPan(event, dygraph, context);
+ } else if (event.altKey || event.ctrlKey || event.metaKey) {
+ //console.log('middle mouse button highlight');
+
+ if (!(event.offsetX && event.offsetY)) {
+ event.offsetX = event.layerX - event.target.offsetLeft;
+ event.offsetY = event.layerY - event.target.offsetTop;
+ }
+ state.tmp.dygraph_highlight_after = dygraph.toDataXCoord(event.offsetX);
+ Dygraph.startZoom(event, dygraph, context);
+ } else {
+ //console.log('middle mouse button selection for zoom (ZOOM)');
+
+ state.setMode('zoom');
+ // NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_highlight_after = null;
+ Dygraph.startZoom(event, dygraph, context);
+ }
+ } else {
+ if (event.shiftKey) {
+ //console.log('left mouse button selection for zoom (ZOOM)');
+
+ state.setMode('zoom');
+ // NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_highlight_after = null;
+ Dygraph.startZoom(event, dygraph, context);
+ } else if (event.altKey || event.ctrlKey || event.metaKey) {
+ //console.log('left mouse button highlight');
+
+ if (!(event.offsetX && event.offsetY)) {
+ event.offsetX = event.layerX - event.target.offsetLeft;
+ event.offsetY = event.layerY - event.target.offsetTop;
+ }
+ state.tmp.dygraph_highlight_after = dygraph.toDataXCoord(event.offsetX);
+ Dygraph.startZoom(event, dygraph, context);
+ } else {
+ //console.log('left mouse button dragging (PAN)');
+
+ state.setMode('pan');
+ // NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_highlight_after = null;
+ Dygraph.startPan(event, dygraph, context);
+ }
+ }
+ },
+ mousemove: function (event, dygraph, context) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.mousemove()');
+ }
+
+ if (state.tmp.dygraph_highlight_after !== null) {
+ //console.log('highlight selection...');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.moveZoom(event, dygraph, context);
+ event.preventDefault();
+ } else if (context.isPanning) {
+ //console.log('panning...');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ //NETDATA.globalSelectionSync.stop();
+ //NETDATA.globalSelectionSync.delay();
+ state.setMode('pan');
+ context.is2DPan = false;
+ Dygraph.movePan(event, dygraph, context);
+ } else if (context.isZooming) {
+ //console.log('zooming...');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ //NETDATA.globalSelectionSync.stop();
+ //NETDATA.globalSelectionSync.delay();
+ state.setMode('zoom');
+ Dygraph.moveZoom(event, dygraph, context);
+ }
+ },
+ mouseup: function (event, dygraph, context) {
+ state.tmp.dygraph_mouse_down = false;
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.mouseup()');
+ }
+
+ if (state.tmp.dygraph_highlight_after !== null) {
+ //console.log('done highlight selection');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ if (!(event.offsetX && event.offsetY)) {
+ event.offsetX = event.layerX - event.target.offsetLeft;
+ event.offsetY = event.layerY - event.target.offsetTop;
+ }
+
+ NETDATA.globalChartUnderlay.set(state
+ , state.tmp.dygraph_highlight_after
+ , dygraph.toDataXCoord(event.offsetX)
+ , state.view_after
+ , state.view_before
+ );
+
+ state.tmp.dygraph_highlight_after = null;
+
+ context.isZooming = false;
+ dygraph.clearZoomRect_();
+ dygraph.drawGraph_(false);
+
+ // refresh all the charts immediately
+ NETDATA.options.auto_refresher_stop_until = 0;
+ } else if (context.isPanning) {
+ //console.log('done panning');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.endPan(event, dygraph, context);
+
+ // refresh all the charts immediately
+ NETDATA.options.auto_refresher_stop_until = 0;
+ } else if (context.isZooming) {
+ //console.log('done zomming');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.endZoom(event, dygraph, context);
+
+ // refresh all the charts immediately
+ NETDATA.options.auto_refresher_stop_until = 0;
+ }
+ },
+ click: function (event, dygraph, context) {
+ void(dygraph);
+ void(context);
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.click()');
+ }
+
+ event.preventDefault();
+ },
+ dblclick: function (event, dygraph, context) {
+ void(event);
+ void(dygraph);
+ void(context);
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.dblclick()');
+ }
+ NETDATA.resetAllCharts(state);
+ },
+ wheel: function (event, dygraph, context) {
+ void(context);
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.wheel()');
+ }
+
+ // Take the offset of a mouse event on the dygraph canvas and
+ // convert it to a pair of percentages from the bottom left.
+ // (Not top left, bottom is where the lower value is.)
+ function offsetToPercentage(g, offsetX, offsetY) {
+ // This is calculating the pixel offset of the leftmost date.
+ let xOffset = g.toDomCoords(g.xAxisRange()[0], null)[0];
+ let yar0 = g.yAxisRange(0);
+
+ // This is calculating the pixel of the highest value. (Top pixel)
+ let yOffset = g.toDomCoords(null, yar0[1])[1];
+
+ // x y w and h are relative to the corner of the drawing area,
+ // so that the upper corner of the drawing area is (0, 0).
+ let x = offsetX - xOffset;
+ let y = offsetY - yOffset;
+
+ // This is computing the rightmost pixel, effectively defining the
+ // width.
+ let w = g.toDomCoords(g.xAxisRange()[1], null)[0] - xOffset;
+
+ // This is computing the lowest pixel, effectively defining the height.
+ let h = g.toDomCoords(null, yar0[0])[1] - yOffset;
+
+ // Percentage from the left.
+ let xPct = w === 0 ? 0 : (x / w);
+ // Percentage from the top.
+ let yPct = h === 0 ? 0 : (y / h);
+
+ // The (1-) part below changes it from "% distance down from the top"
+ // to "% distance up from the bottom".
+ return [xPct, (1 - yPct)];
+ }
+
+ // Adjusts [x, y] toward each other by zoomInPercentage%
+ // Split it so the left/bottom axis gets xBias/yBias of that change and
+ // tight/top gets (1-xBias)/(1-yBias) of that change.
+ //
+ // If a bias is missing it splits it down the middle.
+ function zoomRange(g, zoomInPercentage, xBias, yBias) {
+ xBias = xBias || 0.5;
+ yBias = yBias || 0.5;
+
+ function adjustAxis(axis, zoomInPercentage, bias) {
+ let delta = axis[1] - axis[0];
+ let increment = delta * zoomInPercentage;
+ let foo = [increment * bias, increment * (1 - bias)];
+
+ return [axis[0] + foo[0], axis[1] - foo[1]];
+ }
+
+ let yAxes = g.yAxisRanges();
+ let newYAxes = [];
+ for (let i = 0; i < yAxes.length; i++) {
+ newYAxes[i] = adjustAxis(yAxes[i], zoomInPercentage, yBias);
+ }
+
+ return adjustAxis(g.xAxisRange(), zoomInPercentage, xBias);
+ }
+
+ if (event.altKey || event.shiftKey) {
+ state.tmp.dygraph_user_action = true;
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ // http://dygraphs.com/gallery/interaction-api.js
+ let normal_def;
+ if (typeof event.wheelDelta === 'number' && !isNaN(event.wheelDelta))
+ // chrome
+ {
+ normal_def = event.wheelDelta / 40;
+ } else
+ // firefox
+ {
+ normal_def = event.deltaY * -1.2;
+ }
+
+ let normal = (event.detail) ? event.detail * -1 : normal_def;
+ let percentage = normal / 50;
+
+ if (!(event.offsetX && event.offsetY)) {
+ event.offsetX = event.layerX - event.target.offsetLeft;
+ event.offsetY = event.layerY - event.target.offsetTop;
+ }
+
+ let percentages = offsetToPercentage(dygraph, event.offsetX, event.offsetY);
+ let xPct = percentages[0];
+ let yPct = percentages[1];
+
+ let new_x_range = zoomRange(dygraph, percentage, xPct, yPct);
+ let after = new_x_range[0];
+ let before = new_x_range[1];
+
+ let first = state.netdata_first + state.data_update_every;
+ let last = state.netdata_last + state.data_update_every;
+
+ if (before > last) {
+ after -= (before - last);
+ before = last;
+ }
+ if (after < first) {
+ after = first;
+ }
+
+ state.setMode('zoom');
+ state.updateChartPanOrZoom(after, before, function () {
+ dygraph.updateOptions({dateWindow: [after, before]});
+ });
+
+ event.preventDefault();
+ }
+ },
+ touchstart: function (event, dygraph, context) {
+ state.tmp.dygraph_mouse_down = true;
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.touchstart()');
+ }
+
+ state.tmp.dygraph_user_action = true;
+ state.setMode('zoom');
+ state.pauseChart();
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ Dygraph.defaultInteractionModel.touchstart(event, dygraph, context);
+
+ // we overwrite the touch directions at the end, to overwrite
+ // the internal default of dygraph
+ context.touchDirections = {x: true, y: false};
+
+ state.dygraph_last_touch_start = Date.now();
+ state.dygraph_last_touch_move = 0;
+
+ if (typeof event.touches[0].pageX === 'number') {
+ state.dygraph_last_touch_page_x = event.touches[0].pageX;
+ } else {
+ state.dygraph_last_touch_page_x = 0;
+ }
+ },
+ touchmove: function (event, dygraph, context) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.touchmove()');
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.defaultInteractionModel.touchmove(event, dygraph, context);
+
+ state.dygraph_last_touch_move = Date.now();
+ },
+ touchend: function (event, dygraph, context) {
+ state.tmp.dygraph_mouse_down = false;
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.touchend()');
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.defaultInteractionModel.touchend(event, dygraph, context);
+
+ // if it didn't move, it is a selection
+ if (state.dygraph_last_touch_move === 0 && state.dygraph_last_touch_page_x !== 0) {
+ NETDATA.globalSelectionSync.dontSyncBefore = 0;
+ NETDATA.globalSelectionSync.setMaster(state);
+
+ // internal api of dygraph
+ let pct = (state.dygraph_last_touch_page_x - (dygraph.plotter_.area.x + state.element.getBoundingClientRect().left)) / dygraph.plotter_.area.w;
+ console.log('pct: ' + pct.toString());
+
+ let t = Math.round(state.view_after + (state.view_before - state.view_after) * pct);
+ if (NETDATA.dygraphSetSelection(state, t)) {
+ NETDATA.globalSelectionSync.sync(state, t);
+ }
+ }
+
+ // if it was double tap within double click time, reset the charts
+ let now = Date.now();
+ if (typeof state.dygraph_last_touch_end !== 'undefined') {
+ if (state.dygraph_last_touch_move === 0) {
+ let dt = now - state.dygraph_last_touch_end;
+ if (dt <= NETDATA.options.current.double_click_speed) {
+ NETDATA.resetAllCharts(state);
+ }
+ }
+ }
+
+ // remember the timestamp of the last touch end
+ state.dygraph_last_touch_end = now;
+
+ // refresh all the charts immediately
+ NETDATA.options.auto_refresher_stop_until = 0;
+ }
+ }
+ };
+
+ if (NETDATA.chartLibraries.dygraph.isLogScale(state)) {
+ if (Array.isArray(state.tmp.dygraph_options.valueRange) && state.tmp.dygraph_options.valueRange[0] <= 0) {
+ state.tmp.dygraph_options.valueRange[0] = null;
+ }
+ }
+
+ if (NETDATA.chartLibraries.dygraph.isSparkline(state)) {
+ state.tmp.dygraph_options.drawGrid = false;
+ state.tmp.dygraph_options.drawAxis = false;
+ state.tmp.dygraph_options.title = undefined;
+ state.tmp.dygraph_options.ylabel = undefined;
+ state.tmp.dygraph_options.yLabelWidth = 0;
+ //state.tmp.dygraph_options.labelsDivWidth = 120;
+ //state.tmp.dygraph_options.labelsDivStyles.width = '120px';
+ state.tmp.dygraph_options.labelsSeparateLines = true;
+ state.tmp.dygraph_options.rightGap = 0;
+ state.tmp.dygraph_options.yRangePad = 1;
+ state.tmp.dygraph_options.axes.x.drawAxis = false;
+ state.tmp.dygraph_options.axes.y.drawAxis = false;
+ }
+
+ if (smooth) {
+ state.tmp.dygraph_smooth_eligible = true;
+
+ if (NETDATA.options.current.smooth_plot) {
+ state.tmp.dygraph_options.plotter = smoothPlotter;
+ }
+ }
+ else {
+ state.tmp.dygraph_smooth_eligible = false;
+ }
+
+ if (netdataSnapshotData !== null && NETDATA.globalPanAndZoom.isActive() && NETDATA.globalPanAndZoom.isMaster(state) === false) {
+ // pan and zoom on snapshots
+ state.tmp.dygraph_options.dateWindow = [NETDATA.globalPanAndZoom.force_after_ms, NETDATA.globalPanAndZoom.force_before_ms];
+ //state.tmp.dygraph_options.isZoomedIgnoreProgrammaticZoom = true;
+ }
+
+ let seriesStyles = NETDATA.dygraphGetSeriesStyle(state.tmp.dygraph_options);
+ state.tmp.dygraph_options.series = seriesStyles;
+
+ state.tmp.dygraph_instance = new Dygraph(
+ state.element_chart,
+ data.result.data,
+ state.tmp.dygraph_options
+ );
+
+ state.tmp.dygraph_history_tip_element = document.createElement('div');
+ state.tmp.dygraph_history_tip_element.innerHTML = `
+ <span class="dygraph__history-tip-content">
+ Want to extend your history of real-time metrics?
+ <br />
+ <a href="https://docs.netdata.cloud/docs/configuration-guide/#increase-the-metrics-retention-period" target=_blank>
+ Configure Netdata's <b>history</b></a>
+ or use the <a href="https://docs.netdata.cloud/database/engine/" target=_blank>DB engine</a>.
+ </span>
+ `;
+ state.tmp.dygraph_history_tip_element.className = 'dygraph__history-tip';
+ state.element_chart.appendChild(state.tmp.dygraph_history_tip_element);
+
+
+ state.tmp.dygraph_force_zoom = false;
+ state.tmp.dygraph_user_action = false;
+ state.tmp.dygraph_last_rendered = Date.now();
+ state.tmp.dygraph_highlight_after = null;
+
+ if (state.tmp.dygraph_options.valueRange[0] === null && state.tmp.dygraph_options.valueRange[1] === null) {
+ if (typeof state.tmp.dygraph_instance.axes_[0].extremeRange !== 'undefined') {
+ state.tmp.__commonMin = NETDATA.dataAttribute(state.element, 'common-min', null);
+ state.tmp.__commonMax = NETDATA.dataAttribute(state.element, 'common-max', null);
+ } else {
+ state.log('incompatible version of Dygraph detected');
+ state.tmp.__commonMin = null;
+ state.tmp.__commonMax = null;
+ }
+ } else {
+ // if the user gave a valueRange, respect it
+ state.tmp.__commonMin = null;
+ state.tmp.__commonMax = null;
+ }
+
+ return true;
+};
+
+NETDATA.dygraphGetSeriesStyle = function(dygraphOptions) {
+ const seriesStyleStr = dygraphOptions.perSeriesStyle;
+ let formattedStyles = {};
+
+ if (seriesStyleStr === '') {
+ return formattedStyles;
+ }
+
+ // Parse the config string into a JSON object
+ let styles = seriesStyleStr.replace(' ', '').split('|');
+
+ styles.forEach(style => {
+ const keys = style.split(':');
+ formattedStyles[keys[0]] = keys[1];
+ });
+
+ for (let key in formattedStyles) {
+ if (formattedStyles.hasOwnProperty(key)) {
+ let settings;
+
+ switch (formattedStyles[key]) {
+ case 'line':
+ settings = { fillGraph: false };
+ break;
+ case 'area':
+ settings = { fillGraph: true };
+ break;
+ case 'dot':
+ settings = {
+ fillGraph: false,
+ drawPoints: true,
+ pointSize: dygraphOptions.pointSize
+ };
+ break;
+ default:
+ settings = undefined;
+ }
+
+ formattedStyles[key] = settings;
+ }
+ }
+
+ return formattedStyles;
+};
+// ----------------------------------------------------------------------------------------------------------------
+// sparkline
+
+NETDATA.sparklineInitialize = function (callback) {
+ if (typeof netdataNoSparklines === 'undefined' || !netdataNoSparklines) {
+ $.ajax({
+ url: NETDATA.sparkline_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('sparkline', NETDATA.sparkline_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.sparkline.enabled = false;
+ NETDATA.error(100, NETDATA.sparkline_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ } else {
+ NETDATA.chartLibraries.sparkline.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.sparklineChartUpdate = function (state, data) {
+ state.sparkline_options.width = state.chartWidth();
+ state.sparkline_options.height = state.chartHeight();
+
+ $(state.element_chart).sparkline(data.result, state.sparkline_options);
+ return true;
+};
+
+NETDATA.sparklineChartCreate = function (state, data) {
+ let type = NETDATA.dataAttribute(state.element, 'sparkline-type', 'line');
+ let lineColor = NETDATA.dataAttribute(state.element, 'sparkline-linecolor', state.chartCustomColors()[0]);
+ let fillColor = NETDATA.dataAttribute(state.element, 'sparkline-fillcolor', ((state.chart.chart_type === 'line') ? NETDATA.themes.current.background : NETDATA.colorLuminance(lineColor, NETDATA.chartDefaults.fill_luminance)));
+ let chartRangeMin = NETDATA.dataAttribute(state.element, 'sparkline-chartrangemin', undefined);
+ let chartRangeMax = NETDATA.dataAttribute(state.element, 'sparkline-chartrangemax', undefined);
+ let composite = NETDATA.dataAttribute(state.element, 'sparkline-composite', undefined);
+ let enableTagOptions = NETDATA.dataAttribute(state.element, 'sparkline-enabletagoptions', undefined);
+ let tagOptionPrefix = NETDATA.dataAttribute(state.element, 'sparkline-tagoptionprefix', undefined);
+ let tagValuesAttribute = NETDATA.dataAttribute(state.element, 'sparkline-tagvaluesattribute', undefined);
+ let disableHiddenCheck = NETDATA.dataAttribute(state.element, 'sparkline-disablehiddencheck', undefined);
+ let defaultPixelsPerValue = NETDATA.dataAttribute(state.element, 'sparkline-defaultpixelspervalue', undefined);
+ let spotColor = NETDATA.dataAttribute(state.element, 'sparkline-spotcolor', undefined);
+ let minSpotColor = NETDATA.dataAttribute(state.element, 'sparkline-minspotcolor', undefined);
+ let maxSpotColor = NETDATA.dataAttribute(state.element, 'sparkline-maxspotcolor', undefined);
+ let spotRadius = NETDATA.dataAttribute(state.element, 'sparkline-spotradius', undefined);
+ let valueSpots = NETDATA.dataAttribute(state.element, 'sparkline-valuespots', undefined);
+ let highlightSpotColor = NETDATA.dataAttribute(state.element, 'sparkline-highlightspotcolor', undefined);
+ let highlightLineColor = NETDATA.dataAttribute(state.element, 'sparkline-highlightlinecolor', undefined);
+ let lineWidth = NETDATA.dataAttribute(state.element, 'sparkline-linewidth', undefined);
+ let normalRangeMin = NETDATA.dataAttribute(state.element, 'sparkline-normalrangemin', undefined);
+ let normalRangeMax = NETDATA.dataAttribute(state.element, 'sparkline-normalrangemax', undefined);
+ let drawNormalOnTop = NETDATA.dataAttribute(state.element, 'sparkline-drawnormalontop', undefined);
+ let xvalues = NETDATA.dataAttribute(state.element, 'sparkline-xvalues', undefined);
+ let chartRangeClip = NETDATA.dataAttribute(state.element, 'sparkline-chartrangeclip', undefined);
+ let chartRangeMinX = NETDATA.dataAttribute(state.element, 'sparkline-chartrangeminx', undefined);
+ let chartRangeMaxX = NETDATA.dataAttribute(state.element, 'sparkline-chartrangemaxx', undefined);
+ let disableInteraction = NETDATA.dataAttributeBoolean(state.element, 'sparkline-disableinteraction', false);
+ let disableTooltips = NETDATA.dataAttributeBoolean(state.element, 'sparkline-disabletooltips', false);
+ let disableHighlight = NETDATA.dataAttributeBoolean(state.element, 'sparkline-disablehighlight', false);
+ let highlightLighten = NETDATA.dataAttribute(state.element, 'sparkline-highlightlighten', 1.4);
+ let highlightColor = NETDATA.dataAttribute(state.element, 'sparkline-highlightcolor', undefined);
+ let tooltipContainer = NETDATA.dataAttribute(state.element, 'sparkline-tooltipcontainer', undefined);
+ let tooltipClassname = NETDATA.dataAttribute(state.element, 'sparkline-tooltipclassname', undefined);
+ let tooltipFormat = NETDATA.dataAttribute(state.element, 'sparkline-tooltipformat', undefined);
+ let tooltipPrefix = NETDATA.dataAttribute(state.element, 'sparkline-tooltipprefix', undefined);
+ let tooltipSuffix = NETDATA.dataAttribute(state.element, 'sparkline-tooltipsuffix', ' ' + state.units_current);
+ let tooltipSkipNull = NETDATA.dataAttributeBoolean(state.element, 'sparkline-tooltipskipnull', true);
+ let tooltipValueLookups = NETDATA.dataAttribute(state.element, 'sparkline-tooltipvaluelookups', undefined);
+ let tooltipFormatFieldlist = NETDATA.dataAttribute(state.element, 'sparkline-tooltipformatfieldlist', undefined);
+ let tooltipFormatFieldlistKey = NETDATA.dataAttribute(state.element, 'sparkline-tooltipformatfieldlistkey', undefined);
+ let numberFormatter = NETDATA.dataAttribute(state.element, 'sparkline-numberformatter', function (n) {
+ return n.toFixed(2);
+ });
+ let numberDigitGroupSep = NETDATA.dataAttribute(state.element, 'sparkline-numberdigitgroupsep', undefined);
+ let numberDecimalMark = NETDATA.dataAttribute(state.element, 'sparkline-numberdecimalmark', undefined);
+ let numberDigitGroupCount = NETDATA.dataAttribute(state.element, 'sparkline-numberdigitgroupcount', undefined);
+ let animatedZooms = NETDATA.dataAttributeBoolean(state.element, 'sparkline-animatedzooms', false);
+
+ if (spotColor === 'disable') {
+ spotColor = '';
+ }
+ if (minSpotColor === 'disable') {
+ minSpotColor = '';
+ }
+ if (maxSpotColor === 'disable') {
+ maxSpotColor = '';
+ }
+
+ // state.log('sparkline type ' + type + ', lineColor: ' + lineColor + ', fillColor: ' + fillColor);
+
+ state.sparkline_options = {
+ type: type,
+ lineColor: lineColor,
+ fillColor: fillColor,
+ chartRangeMin: chartRangeMin,
+ chartRangeMax: chartRangeMax,
+ composite: composite,
+ enableTagOptions: enableTagOptions,
+ tagOptionPrefix: tagOptionPrefix,
+ tagValuesAttribute: tagValuesAttribute,
+ disableHiddenCheck: disableHiddenCheck,
+ defaultPixelsPerValue: defaultPixelsPerValue,
+ spotColor: spotColor,
+ minSpotColor: minSpotColor,
+ maxSpotColor: maxSpotColor,
+ spotRadius: spotRadius,
+ valueSpots: valueSpots,
+ highlightSpotColor: highlightSpotColor,
+ highlightLineColor: highlightLineColor,
+ lineWidth: lineWidth,
+ normalRangeMin: normalRangeMin,
+ normalRangeMax: normalRangeMax,
+ drawNormalOnTop: drawNormalOnTop,
+ xvalues: xvalues,
+ chartRangeClip: chartRangeClip,
+ chartRangeMinX: chartRangeMinX,
+ chartRangeMaxX: chartRangeMaxX,
+ disableInteraction: disableInteraction,
+ disableTooltips: disableTooltips,
+ disableHighlight: disableHighlight,
+ highlightLighten: highlightLighten,
+ highlightColor: highlightColor,
+ tooltipContainer: tooltipContainer,
+ tooltipClassname: tooltipClassname,
+ tooltipChartTitle: state.title,
+ tooltipFormat: tooltipFormat,
+ tooltipPrefix: tooltipPrefix,
+ tooltipSuffix: tooltipSuffix,
+ tooltipSkipNull: tooltipSkipNull,
+ tooltipValueLookups: tooltipValueLookups,
+ tooltipFormatFieldlist: tooltipFormatFieldlist,
+ tooltipFormatFieldlistKey: tooltipFormatFieldlistKey,
+ numberFormatter: numberFormatter,
+ numberDigitGroupSep: numberDigitGroupSep,
+ numberDecimalMark: numberDecimalMark,
+ numberDigitGroupCount: numberDigitGroupCount,
+ animatedZooms: animatedZooms,
+ width: state.chartWidth(),
+ height: state.chartHeight()
+ };
+
+ $(state.element_chart).sparkline(data.result, state.sparkline_options);
+
+ return true;
+};
+// google charts
+
+// Codacy declarations
+/* global google */
+
+NETDATA.googleInitialize = function (callback) {
+ if (typeof netdataNoGoogleCharts === 'undefined' || !netdataNoGoogleCharts) {
+ $.ajax({
+ url: NETDATA.google_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('google', NETDATA.google_js);
+ google.load('visualization', '1.1', {
+ 'packages': ['corechart', 'controls'],
+ 'callback': callback
+ });
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.google.enabled = false;
+ NETDATA.error(100, NETDATA.google_js);
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ } else {
+ NETDATA.chartLibraries.google.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.googleChartUpdate = function (state, data) {
+ let datatable = new google.visualization.DataTable(data.result);
+ state.google_instance.draw(datatable, state.google_options);
+ return true;
+};
+
+NETDATA.googleChartCreate = function (state, data) {
+ let datatable = new google.visualization.DataTable(data.result);
+
+ state.google_options = {
+ colors: state.chartColors(),
+
+ // do not set width, height - the chart resizes itself
+ //width: state.chartWidth(),
+ //height: state.chartHeight(),
+ lineWidth: 1,
+ title: state.title,
+ fontSize: 11,
+ hAxis: {
+ // title: "Time of Day",
+ // format:'HH:mm:ss',
+ viewWindowMode: 'maximized',
+ slantedText: false,
+ format: 'HH:mm:ss',
+ textStyle: {
+ fontSize: 9
+ },
+ gridlines: {
+ color: '#EEE'
+ }
+ },
+ vAxis: {
+ title: state.units_current,
+ viewWindowMode: 'pretty',
+ minValue: -0.1,
+ maxValue: 0.1,
+ direction: 1,
+ textStyle: {
+ fontSize: 9
+ },
+ gridlines: {
+ color: '#EEE'
+ }
+ },
+ chartArea: {
+ width: '65%',
+ height: '80%'
+ },
+ focusTarget: 'category',
+ annotation: {
+ '1': {
+ style: 'line'
+ }
+ },
+ pointsVisible: 0,
+ titlePosition: 'out',
+ titleTextStyle: {
+ fontSize: 11
+ },
+ tooltip: {
+ isHtml: false,
+ ignoreBounds: true,
+ textStyle: {
+ fontSize: 9
+ }
+ },
+ curveType: 'function',
+ areaOpacity: 0.3,
+ isStacked: false
+ };
+
+ switch (state.chart.chart_type) {
+ case "area":
+ state.google_options.vAxis.viewWindowMode = 'maximized';
+ state.google_options.areaOpacity = NETDATA.options.current.color_fill_opacity_area;
+ state.google_instance = new google.visualization.AreaChart(state.element_chart);
+ break;
+
+ case "stacked":
+ state.google_options.isStacked = true;
+ state.google_options.areaOpacity = NETDATA.options.current.color_fill_opacity_stacked;
+ state.google_options.vAxis.viewWindowMode = 'maximized';
+ state.google_options.vAxis.minValue = null;
+ state.google_options.vAxis.maxValue = null;
+ state.google_instance = new google.visualization.AreaChart(state.element_chart);
+ break;
+
+ default:
+ case "line":
+ state.google_options.lineWidth = 2;
+ state.google_instance = new google.visualization.LineChart(state.element_chart);
+ break;
+ }
+
+ state.google_instance.draw(datatable, state.google_options);
+ return true;
+};
+// gauge.js
+
+NETDATA.gaugeInitialize = function (callback) {
+ if (typeof netdataNoGauge === 'undefined' || !netdataNoGauge) {
+ $.ajax({
+ url: NETDATA.gauge_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('gauge', NETDATA.gauge_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.gauge.enabled = false;
+ NETDATA.error(100, NETDATA.gauge_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ })
+ }
+ else {
+ NETDATA.chartLibraries.gauge.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.gaugeAnimation = function (state, status) {
+ let speed = 32;
+
+ if (typeof status === 'boolean' && status === false) {
+ speed = 1000000000;
+ } else if (typeof status === 'number') {
+ speed = status;
+ }
+
+ // console.log('gauge speed ' + speed);
+ state.tmp.gauge_instance.animationSpeed = speed;
+ state.tmp.___gaugeOld__.speed = speed;
+};
+
+NETDATA.gaugeSet = function (state, value, min, max) {
+ if (typeof value !== 'number') {
+ value = 0;
+ }
+ if (typeof min !== 'number') {
+ min = 0;
+ }
+ if (typeof max !== 'number') {
+ max = 0;
+ }
+ if (value > max) {
+ max = value;
+ }
+ if (value < min) {
+ min = value;
+ }
+ if (min > max) {
+ let t = min;
+ min = max;
+ max = t;
+ }
+ else if (min === max) {
+ max = min + 1;
+ }
+
+ state.legendFormatValueDecimalsFromMinMax(min, max);
+
+ // gauge.js has an issue if the needle
+ // is smaller than min or larger than max
+ // when we set the new values
+ // the needle will go crazy
+
+ // to prevent it, we always feed it
+ // with a percentage, so that the needle
+ // is always between min and max
+ let pcent = (value - min) * 100 / (max - min);
+
+ // bug fix for gauge.js 1.3.1
+ // if the value is the absolute min or max, the chart is broken
+ if (pcent < 0.001) {
+ pcent = 0.001;
+ }
+ if (pcent > 99.999) {
+ pcent = 99.999;
+ }
+
+ state.tmp.gauge_instance.set(pcent);
+ // console.log('gauge set ' + pcent + ', value ' + value + ', min ' + min + ', max ' + max);
+
+ state.tmp.___gaugeOld__.value = value;
+ state.tmp.___gaugeOld__.min = min;
+ state.tmp.___gaugeOld__.max = max;
+};
+
+NETDATA.gaugeSetLabels = function (state, value, min, max) {
+ if (state.tmp.___gaugeOld__.valueLabel !== value) {
+ state.tmp.___gaugeOld__.valueLabel = value;
+ state.tmp.gaugeChartLabel.innerText = state.legendFormatValue(value);
+ }
+ if (state.tmp.___gaugeOld__.minLabel !== min) {
+ state.tmp.___gaugeOld__.minLabel = min;
+ state.tmp.gaugeChartMin.innerText = state.legendFormatValue(min);
+ }
+ if (state.tmp.___gaugeOld__.maxLabel !== max) {
+ state.tmp.___gaugeOld__.maxLabel = max;
+ state.tmp.gaugeChartMax.innerText = state.legendFormatValue(max);
+ }
+};
+
+NETDATA.gaugeClearSelection = function (state, force) {
+ if (typeof state.tmp.gaugeEvent !== 'undefined' && typeof state.tmp.gaugeEvent.timer !== 'undefined') {
+ NETDATA.timeout.clear(state.tmp.gaugeEvent.timer);
+ state.tmp.gaugeEvent.timer = undefined;
+ }
+
+ if (state.isAutoRefreshable() && state.data !== null && force !== true) {
+ NETDATA.gaugeChartUpdate(state, state.data);
+ } else {
+ NETDATA.gaugeAnimation(state, false);
+ NETDATA.gaugeSetLabels(state, null, null, null);
+ NETDATA.gaugeSet(state, null, null, null);
+ }
+
+ NETDATA.gaugeAnimation(state, true);
+ return true;
+};
+
+NETDATA.gaugeSetSelection = function (state, t) {
+ if (state.timeIsVisible(t) !== true) {
+ return NETDATA.gaugeClearSelection(state, true);
+ }
+
+ let slot = state.calculateRowForTime(t);
+ if (slot < 0 || slot >= state.data.result.length) {
+ return NETDATA.gaugeClearSelection(state, true);
+ }
+
+ if (typeof state.tmp.gaugeEvent === 'undefined') {
+ state.tmp.gaugeEvent = {
+ timer: undefined,
+ value: 0,
+ min: 0,
+ max: 0
+ };
+ }
+
+ let value = state.data.result[state.data.result.length - 1 - slot];
+ let min = (state.tmp.gaugeMin === null) ? NETDATA.commonMin.get(state) : state.tmp.gaugeMin;
+ let max = (state.tmp.gaugeMax === null) ? NETDATA.commonMax.get(state) : state.tmp.gaugeMax;
+
+ // make sure it is zero based
+ // but only if it has not been set by the user
+ if (state.tmp.gaugeMin === null && min > 0) {
+ min = 0;
+ }
+ if (state.tmp.gaugeMax === null && max < 0) {
+ max = 0;
+ }
+
+ state.tmp.gaugeEvent.value = value;
+ state.tmp.gaugeEvent.min = min;
+ state.tmp.gaugeEvent.max = max;
+ NETDATA.gaugeSetLabels(state, value, min, max);
+
+ if (state.tmp.gaugeEvent.timer === undefined) {
+ NETDATA.gaugeAnimation(state, false);
+
+ state.tmp.gaugeEvent.timer = NETDATA.timeout.set(function () {
+ state.tmp.gaugeEvent.timer = undefined;
+ NETDATA.gaugeSet(state, state.tmp.gaugeEvent.value, state.tmp.gaugeEvent.min, state.tmp.gaugeEvent.max);
+ }, 0);
+ }
+
+ return true;
+};
+
+NETDATA.gaugeChartUpdate = function (state, data) {
+ let value, min, max;
+
+ if (NETDATA.globalPanAndZoom.isActive() || state.isAutoRefreshable() === false) {
+ NETDATA.gaugeSetLabels(state, null, null, null);
+ state.tmp.gauge_instance.set(0);
+ } else {
+ value = data.result[0];
+ min = (state.tmp.gaugeMin === null) ? NETDATA.commonMin.get(state) : state.tmp.gaugeMin;
+ max = (state.tmp.gaugeMax === null) ? NETDATA.commonMax.get(state) : state.tmp.gaugeMax;
+ if (value < min) {
+ min = value;
+ }
+ if (value > max) {
+ max = value;
+ }
+
+ // make sure it is zero based
+ // but only if it has not been set by the user
+ if (state.tmp.gaugeMin === null && min > 0) {
+ min = 0;
+ }
+ if (state.tmp.gaugeMax === null && max < 0) {
+ max = 0;
+ }
+
+ NETDATA.gaugeSet(state, value, min, max);
+ NETDATA.gaugeSetLabels(state, value, min, max);
+ }
+
+ return true;
+};
+
+NETDATA.gaugeChartCreate = function (state, data) {
+ // let chart = $(state.element_chart);
+
+ let value = data.result[0];
+ let min = NETDATA.dataAttribute(state.element, 'gauge-min-value', null);
+ let max = NETDATA.dataAttribute(state.element, 'gauge-max-value', null);
+ // let adjust = NETDATA.dataAttribute(state.element, 'gauge-adjust', null);
+ let pointerColor = NETDATA.dataAttribute(state.element, 'gauge-pointer-color', NETDATA.themes.current.gauge_pointer);
+ let strokeColor = NETDATA.dataAttribute(state.element, 'gauge-stroke-color', NETDATA.themes.current.gauge_stroke);
+ let startColor = NETDATA.dataAttribute(state.element, 'gauge-start-color', state.chartCustomColors()[0]);
+ let stopColor = NETDATA.dataAttribute(state.element, 'gauge-stop-color', void 0);
+ let generateGradient = NETDATA.dataAttribute(state.element, 'gauge-generate-gradient', false);
+
+ if (min === null) {
+ min = NETDATA.commonMin.get(state);
+ state.tmp.gaugeMin = null;
+ } else {
+ state.tmp.gaugeMin = min;
+ }
+
+ if (max === null) {
+ max = NETDATA.commonMax.get(state);
+ state.tmp.gaugeMax = null;
+ } else {
+ state.tmp.gaugeMax = max;
+ }
+
+ // make sure it is zero based
+ // but only if it has not been set by the user
+ if (state.tmp.gaugeMin === null && min > 0) {
+ min = 0;
+ }
+ if (state.tmp.gaugeMax === null && max < 0) {
+ max = 0;
+ }
+
+ let width = state.chartWidth(), height = state.chartHeight(); //, ratio = 1.5;
+ // console.log('gauge width: ' + width.toString() + ', height: ' + height.toString());
+ //switch(adjust) {
+ // case 'width': width = height * ratio; break;
+ // case 'height':
+ // default: height = width / ratio; break;
+ //}
+ //state.element.style.width = width.toString() + 'px';
+ //state.element.style.height = height.toString() + 'px';
+
+ let lum_d = 0.05;
+
+ let options = {
+ lines: 12, // The number of lines to draw
+ angle: 0.14, // The span of the gauge arc
+ lineWidth: 0.57, // The line thickness
+ radiusScale: 1.0, // Relative radius
+ pointer: {
+ length: 0.85, // 0.9 The radius of the inner circle
+ strokeWidth: 0.045, // The rotation offset
+ color: pointerColor // Fill color
+ },
+ limitMax: true, // If false, the max value of the gauge will be updated if value surpass max
+ limitMin: true, // If true, the min value of the gauge will be fixed unless you set it manually
+ colorStart: startColor, // Colors
+ colorStop: stopColor, // just experiment with them
+ strokeColor: strokeColor, // to see which ones work best for you
+ generateGradient: (generateGradient === true), // gmosx:
+ gradientType: 0,
+ highDpiSupport: true // High resolution support
+ };
+
+ if (generateGradient.constructor === Array) {
+ // example options:
+ // data-gauge-generate-gradient="[0, 50, 100]"
+ // data-gauge-gradient-percent-color-0="#FFFFFF"
+ // data-gauge-gradient-percent-color-50="#999900"
+ // data-gauge-gradient-percent-color-100="#000000"
+
+ options.percentColors = [];
+ let len = generateGradient.length;
+ while (len--) {
+ let pcent = generateGradient[len];
+ let color = NETDATA.dataAttribute(state.element, 'gauge-gradient-percent-color-' + pcent.toString(), false);
+ if (color !== false) {
+ let a = [];
+ a[0] = pcent / 100;
+ a[1] = color;
+ options.percentColors.unshift(a);
+ }
+ }
+ if (options.percentColors.length === 0) {
+ delete options.percentColors;
+ }
+ } else if (generateGradient === false && NETDATA.themes.current.gauge_gradient) {
+ //noinspection PointlessArithmeticExpressionJS
+ options.percentColors = [
+ [0.0, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 0))],
+ [0.1, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 1))],
+ [0.2, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 2))],
+ [0.3, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 3))],
+ [0.4, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 4))],
+ [0.5, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 5))],
+ [0.6, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 6))],
+ [0.7, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 7))],
+ [0.8, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 8))],
+ [0.9, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 9))],
+ [1.0, NETDATA.colorLuminance(startColor, 0.0)]];
+ }
+
+ state.tmp.gauge_canvas = document.createElement('canvas');
+ state.tmp.gauge_canvas.id = 'gauge-' + state.uuid + '-canvas';
+ state.tmp.gauge_canvas.className = 'gaugeChart';
+ state.tmp.gauge_canvas.width = width;
+ state.tmp.gauge_canvas.height = height;
+ state.element_chart.appendChild(state.tmp.gauge_canvas);
+
+ let valuefontsize = Math.floor(height / 5);
+ let valuetop = Math.round((height - valuefontsize) / 3.2);
+ state.tmp.gaugeChartLabel = document.createElement('span');
+ state.tmp.gaugeChartLabel.className = 'gaugeChartLabel';
+ state.tmp.gaugeChartLabel.style.fontSize = valuefontsize + 'px';
+ state.tmp.gaugeChartLabel.style.top = valuetop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartLabel);
+
+ let titlefontsize = Math.round(valuefontsize / 2.1);
+ let titletop = 0;
+ state.tmp.gaugeChartTitle = document.createElement('span');
+ state.tmp.gaugeChartTitle.className = 'gaugeChartTitle';
+ state.tmp.gaugeChartTitle.innerText = state.title;
+ state.tmp.gaugeChartTitle.style.fontSize = titlefontsize + 'px';
+ state.tmp.gaugeChartTitle.style.lineHeight = titlefontsize + 'px';
+ state.tmp.gaugeChartTitle.style.top = titletop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartTitle);
+
+ let unitfontsize = Math.round(titlefontsize * 0.9);
+ state.tmp.gaugeChartUnits = document.createElement('span');
+ state.tmp.gaugeChartUnits.className = 'gaugeChartUnits';
+ state.tmp.gaugeChartUnits.innerText = state.units_current;
+ state.tmp.gaugeChartUnits.style.fontSize = unitfontsize + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartUnits);
+
+ state.tmp.gaugeChartMin = document.createElement('span');
+ state.tmp.gaugeChartMin.className = 'gaugeChartMin';
+ state.tmp.gaugeChartMin.style.fontSize = Math.round(valuefontsize * 0.75).toString() + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartMin);
+
+ state.tmp.gaugeChartMax = document.createElement('span');
+ state.tmp.gaugeChartMax.className = 'gaugeChartMax';
+ state.tmp.gaugeChartMax.style.fontSize = Math.round(valuefontsize * 0.75).toString() + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartMax);
+
+ // when we just re-create the chart
+ // do not animate the first update
+ let animate = true;
+ if (typeof state.tmp.gauge_instance !== 'undefined') {
+ animate = false;
+ }
+
+ state.tmp.gauge_instance = new Gauge(state.tmp.gauge_canvas).setOptions(options); // create sexy gauge!
+
+ state.tmp.___gaugeOld__ = {
+ value: value,
+ min: min,
+ max: max,
+ valueLabel: null,
+ minLabel: null,
+ maxLabel: null
+ };
+
+ // we will always feed a percentage
+ state.tmp.gauge_instance.minValue = 0;
+ state.tmp.gauge_instance.maxValue = 100;
+
+ NETDATA.gaugeAnimation(state, animate);
+ NETDATA.gaugeSet(state, value, min, max);
+ NETDATA.gaugeSetLabels(state, value, min, max);
+ NETDATA.gaugeAnimation(state, true);
+
+ state.legendSetUnitsString = function (units) {
+ if (typeof state.tmp.gaugeChartUnits !== 'undefined' && state.tmp.units !== units) {
+ state.tmp.gaugeChartUnits.innerText = units;
+ state.tmp.___gaugeOld__.valueLabel = null;
+ state.tmp.___gaugeOld__.minLabel = null;
+ state.tmp.___gaugeOld__.maxLabel = null;
+ state.tmp.units = units;
+ }
+ };
+ state.legendShowUndefined = function () {
+ if (typeof state.tmp.gauge_instance !== 'undefined') {
+ NETDATA.gaugeClearSelection(state);
+ }
+ };
+
+ return true;
+};
+// ----------------------------------------------------------------------------------------------------------------
+
+NETDATA.easypiechartPercentFromValueMinMax = function (state, value, min, max) {
+ if (typeof value !== 'number') {
+ value = 0;
+ }
+ if (typeof min !== 'number') {
+ min = 0;
+ }
+ if (typeof max !== 'number') {
+ max = 0;
+ }
+
+ if (min > max) {
+ let t = min;
+ min = max;
+ max = t;
+ }
+
+ if (min > value) {
+ min = value;
+ }
+ if (max < value) {
+ max = value;
+ }
+
+ state.legendFormatValueDecimalsFromMinMax(min, max);
+
+ if (state.tmp.easyPieChartMin === null && min > 0) {
+ min = 0;
+ }
+ if (state.tmp.easyPieChartMax === null && max < 0) {
+ max = 0;
+ }
+
+ let pcent;
+
+ if (min < 0 && max > 0) {
+ // it is both positive and negative
+ // zero at the top center of the chart
+ max = (-min > max) ? -min : max;
+ pcent = Math.round(value * 100 / max);
+ } else if (value >= 0 && min >= 0 && max >= 0) {
+ // clockwise
+ pcent = Math.round((value - min) * 100 / (max - min));
+ if (pcent === 0) {
+ pcent = 0.1;
+ }
+ } else {
+ // counter clockwise
+ pcent = Math.round((value - max) * 100 / (max - min));
+ if (pcent === 0) {
+ pcent = -0.1;
+ }
+ }
+
+ return pcent;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// easy-pie-chart
+
+NETDATA.easypiechartInitialize = function (callback) {
+ if (typeof netdataNoEasyPieChart === 'undefined' || !netdataNoEasyPieChart) {
+ $.ajax({
+ url: NETDATA.easypiechart_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('easypiechart', NETDATA.easypiechart_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.easypiechart.enabled = false;
+ NETDATA.error(100, NETDATA.easypiechart_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ })
+ } else {
+ NETDATA.chartLibraries.easypiechart.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.easypiechartClearSelection = function (state, force) {
+ if (typeof state.tmp.easyPieChartEvent !== 'undefined' && typeof state.tmp.easyPieChartEvent.timer !== 'undefined') {
+ NETDATA.timeout.clear(state.tmp.easyPieChartEvent.timer);
+ state.tmp.easyPieChartEvent.timer = undefined;
+ }
+
+ if (state.isAutoRefreshable() && state.data !== null && force !== true) {
+ NETDATA.easypiechartChartUpdate(state, state.data);
+ }
+ else {
+ state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(null);
+ state.tmp.easyPieChart_instance.update(0);
+ }
+ state.tmp.easyPieChart_instance.enableAnimation();
+
+ return true;
+};
+
+NETDATA.easypiechartSetSelection = function (state, t) {
+ if (state.timeIsVisible(t) !== true) {
+ return NETDATA.easypiechartClearSelection(state, true);
+ }
+
+ let slot = state.calculateRowForTime(t);
+ if (slot < 0 || slot >= state.data.result.length) {
+ return NETDATA.easypiechartClearSelection(state, true);
+ }
+
+ if (typeof state.tmp.easyPieChartEvent === 'undefined') {
+ state.tmp.easyPieChartEvent = {
+ timer: undefined,
+ value: 0,
+ pcent: 0
+ };
+ }
+
+ let value = state.data.result[state.data.result.length - 1 - slot];
+ let min = (state.tmp.easyPieChartMin === null) ? NETDATA.commonMin.get(state) : state.tmp.easyPieChartMin;
+ let max = (state.tmp.easyPieChartMax === null) ? NETDATA.commonMax.get(state) : state.tmp.easyPieChartMax;
+ let pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+
+ state.tmp.easyPieChartEvent.value = value;
+ state.tmp.easyPieChartEvent.pcent = pcent;
+ state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+
+ if (state.tmp.easyPieChartEvent.timer === undefined) {
+ state.tmp.easyPieChart_instance.disableAnimation();
+
+ state.tmp.easyPieChartEvent.timer = NETDATA.timeout.set(function () {
+ state.tmp.easyPieChartEvent.timer = undefined;
+ state.tmp.easyPieChart_instance.update(state.tmp.easyPieChartEvent.pcent);
+ }, 0);
+ }
+
+ return true;
+};
+
+NETDATA.easypiechartChartUpdate = function (state, data) {
+ let value, min, max, pcent;
+
+ if (NETDATA.globalPanAndZoom.isActive() || state.isAutoRefreshable() === false) {
+ value = null;
+ pcent = 0;
+ }
+ else {
+ value = data.result[0];
+ min = (state.tmp.easyPieChartMin === null) ? NETDATA.commonMin.get(state) : state.tmp.easyPieChartMin;
+ max = (state.tmp.easyPieChartMax === null) ? NETDATA.commonMax.get(state) : state.tmp.easyPieChartMax;
+ pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+ }
+
+ state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+ state.tmp.easyPieChart_instance.update(pcent);
+ return true;
+};
+
+NETDATA.easypiechartChartCreate = function (state, data) {
+ let chart = $(state.element_chart);
+
+ let value = data.result[0];
+ let min = NETDATA.dataAttribute(state.element, 'easypiechart-min-value', null);
+ let max = NETDATA.dataAttribute(state.element, 'easypiechart-max-value', null);
+
+ if (min === null) {
+ min = NETDATA.commonMin.get(state);
+ state.tmp.easyPieChartMin = null;
+ }
+ else {
+ state.tmp.easyPieChartMin = min;
+ }
+
+ if (max === null) {
+ max = NETDATA.commonMax.get(state);
+ state.tmp.easyPieChartMax = null;
+ }
+ else {
+ state.tmp.easyPieChartMax = max;
+ }
+
+ let size = state.chartWidth();
+ let stroke = Math.floor(size / 22);
+ if (stroke < 3) {
+ stroke = 2;
+ }
+
+ let valuefontsize = Math.floor((size * 2 / 3) / 5);
+ let valuetop = Math.round((size - valuefontsize - (size / 40)) / 2);
+ state.tmp.easyPieChartLabel = document.createElement('span');
+ state.tmp.easyPieChartLabel.className = 'easyPieChartLabel';
+ state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+ state.tmp.easyPieChartLabel.style.fontSize = valuefontsize + 'px';
+ state.tmp.easyPieChartLabel.style.top = valuetop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.easyPieChartLabel);
+
+ let titlefontsize = Math.round(valuefontsize * 1.6 / 3);
+ let titletop = Math.round(valuetop - (titlefontsize * 2) - (size / 40));
+ state.tmp.easyPieChartTitle = document.createElement('span');
+ state.tmp.easyPieChartTitle.className = 'easyPieChartTitle';
+ state.tmp.easyPieChartTitle.innerText = state.title;
+ state.tmp.easyPieChartTitle.style.fontSize = titlefontsize + 'px';
+ state.tmp.easyPieChartTitle.style.lineHeight = titlefontsize + 'px';
+ state.tmp.easyPieChartTitle.style.top = titletop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.easyPieChartTitle);
+
+ let unitfontsize = Math.round(titlefontsize * 0.9);
+ let unittop = Math.round(valuetop + (valuefontsize + unitfontsize) + (size / 40));
+ state.tmp.easyPieChartUnits = document.createElement('span');
+ state.tmp.easyPieChartUnits.className = 'easyPieChartUnits';
+ state.tmp.easyPieChartUnits.innerText = state.units_current;
+ state.tmp.easyPieChartUnits.style.fontSize = unitfontsize + 'px';
+ state.tmp.easyPieChartUnits.style.top = unittop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.easyPieChartUnits);
+
+ let barColor = NETDATA.dataAttribute(state.element, 'easypiechart-barcolor', undefined);
+ if (typeof barColor === 'undefined' || barColor === null) {
+ barColor = state.chartCustomColors()[0];
+ } else {
+ // <div ... data-easypiechart-barcolor="(function(percent){return(percent < 50 ? '#5cb85c' : percent < 85 ? '#f0ad4e' : '#cb3935');})" ...></div>
+ let tmp = eval(barColor);
+ if (typeof tmp === 'function') {
+ barColor = tmp;
+ }
+ }
+
+ let pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+ chart.data('data-percent', pcent);
+
+ chart.easyPieChart({
+ barColor: barColor,
+ trackColor: NETDATA.dataAttribute(state.element, 'easypiechart-trackcolor', NETDATA.themes.current.easypiechart_track),
+ scaleColor: NETDATA.dataAttribute(state.element, 'easypiechart-scalecolor', NETDATA.themes.current.easypiechart_scale),
+ scaleLength: NETDATA.dataAttribute(state.element, 'easypiechart-scalelength', 5),
+ lineCap: NETDATA.dataAttribute(state.element, 'easypiechart-linecap', 'round'),
+ lineWidth: NETDATA.dataAttribute(state.element, 'easypiechart-linewidth', stroke),
+ trackWidth: NETDATA.dataAttribute(state.element, 'easypiechart-trackwidth', undefined),
+ size: NETDATA.dataAttribute(state.element, 'easypiechart-size', size),
+ rotate: NETDATA.dataAttribute(state.element, 'easypiechart-rotate', 0),
+ animate: NETDATA.dataAttribute(state.element, 'easypiechart-animate', {duration: 500, enabled: true}),
+ easing: NETDATA.dataAttribute(state.element, 'easypiechart-easing', undefined)
+ });
+
+ // when we just re-create the chart
+ // do not animate the first update
+ let animate = true;
+ if (typeof state.tmp.easyPieChart_instance !== 'undefined') {
+ animate = false;
+ }
+
+ state.tmp.easyPieChart_instance = chart.data('easyPieChart');
+ if (animate === false) {
+ state.tmp.easyPieChart_instance.disableAnimation();
+ }
+ state.tmp.easyPieChart_instance.update(pcent);
+ if (animate === false) {
+ state.tmp.easyPieChart_instance.enableAnimation();
+ }
+
+ state.legendSetUnitsString = function (units) {
+ if (typeof state.tmp.easyPieChartUnits !== 'undefined' && state.tmp.units !== units) {
+ state.tmp.easyPieChartUnits.innerText = units;
+ state.tmp.units = units;
+ }
+ };
+ state.legendShowUndefined = function () {
+ if (typeof state.tmp.easyPieChart_instance !== 'undefined') {
+ NETDATA.easypiechartClearSelection(state);
+ }
+ };
+
+ return true;
+};
+
+// d3pie
+
+NETDATA.d3pieInitialize = function (callback) {
+ if (typeof netdataNoD3pie === 'undefined' || !netdataNoD3pie) {
+
+ // d3pie requires D3
+ if (!NETDATA.chartLibraries.d3.initialized) {
+ if (NETDATA.chartLibraries.d3.enabled) {
+ NETDATA.d3Initialize(function () {
+ NETDATA.d3pieInitialize(callback);
+ });
+ } else {
+ NETDATA.chartLibraries.d3pie.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+ } else {
+ $.ajax({
+ url: NETDATA.d3pie_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('d3pie', NETDATA.d3pie_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.d3pie.enabled = false;
+ NETDATA.error(100, NETDATA.d3pie_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ }
+ } else {
+ NETDATA.chartLibraries.d3pie.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.d3pieSetContent = function (state, data, index) {
+ state.legendFormatValueDecimalsFromMinMax(
+ data.min,
+ data.max
+ );
+
+ let content = [];
+ let colors = state.chartColors();
+ let len = data.result.labels.length;
+ for (let i = 1; i < len; i++) {
+ let label = data.result.labels[i];
+ let value = data.result.data[index][label];
+ let color = colors[i - 1];
+
+ if (value !== null && value > 0) {
+ content.push({
+ label: label,
+ value: value,
+ color: color
+ });
+ }
+ }
+
+ if (content.length === 0) {
+ content.push({
+ label: 'no data',
+ value: 100,
+ color: '#666666'
+ });
+ }
+
+ state.tmp.d3pie_last_slot = index;
+ return content;
+};
+
+NETDATA.d3pieDateRange = function (state, data, index) {
+ let dt = Math.round((data.before - data.after + 1) / data.points);
+ let dt_str = NETDATA.seconds4human(dt);
+
+ let before = data.result.data[index].time;
+ let after = before - (dt * 1000);
+
+ let d1 = NETDATA.dateTime.localeDateString(after);
+ let t1 = NETDATA.dateTime.localeTimeString(after);
+ let d2 = NETDATA.dateTime.localeDateString(before);
+ let t2 = NETDATA.dateTime.localeTimeString(before);
+
+ if (d1 === d2) {
+ return d1 + ' ' + t1 + ' to ' + t2 + ', ' + dt_str;
+ }
+
+ return d1 + ' ' + t1 + ' to ' + d2 + ' ' + t2 + ', ' + dt_str;
+};
+
+NETDATA.d3pieSetSelection = function (state, t) {
+ if (state.timeIsVisible(t) !== true) {
+ return NETDATA.d3pieClearSelection(state, true);
+ }
+
+ let slot = state.calculateRowForTime(t);
+ slot = state.data.result.data.length - slot - 1;
+
+ if (slot < 0 || slot >= state.data.result.length) {
+ return NETDATA.d3pieClearSelection(state, true);
+ }
+
+ if (state.tmp.d3pie_last_slot === slot) {
+ // we already show this slot, don't do anything
+ return true;
+ }
+
+ if (state.tmp.d3pie_timer === undefined) {
+ state.tmp.d3pie_timer = NETDATA.timeout.set(function () {
+ state.tmp.d3pie_timer = undefined;
+ NETDATA.d3pieChange(state, NETDATA.d3pieSetContent(state, state.data, slot), NETDATA.d3pieDateRange(state, state.data, slot));
+ }, 0);
+ }
+
+ return true;
+};
+
+NETDATA.d3pieClearSelection = function (state, force) {
+ if (typeof state.tmp.d3pie_timer !== 'undefined') {
+ NETDATA.timeout.clear(state.tmp.d3pie_timer);
+ state.tmp.d3pie_timer = undefined;
+ }
+
+ if (state.isAutoRefreshable() && state.data !== null && force !== true) {
+ NETDATA.d3pieChartUpdate(state, state.data);
+ } else {
+ if (state.tmp.d3pie_last_slot !== -1) {
+ state.tmp.d3pie_last_slot = -1;
+ NETDATA.d3pieChange(state, [{label: 'no data', value: 1, color: '#666666'}], 'no data available');
+ }
+ }
+
+ return true;
+};
+
+NETDATA.d3pieChange = function (state, content, footer) {
+ if (state.d3pie_forced_subtitle === null) {
+ //state.d3pie_instance.updateProp("header.subtitle.text", state.units_current);
+ state.d3pie_instance.options.header.subtitle.text = state.units_current;
+ }
+
+ if (state.d3pie_forced_footer === null) {
+ //state.d3pie_instance.updateProp("footer.text", footer);
+ state.d3pie_instance.options.footer.text = footer;
+ }
+
+ //state.d3pie_instance.updateProp("data.content", content);
+ state.d3pie_instance.options.data.content = content;
+ state.d3pie_instance.destroy();
+ state.d3pie_instance.recreate();
+ return true;
+};
+
+NETDATA.d3pieChartUpdate = function (state, data) {
+ return NETDATA.d3pieChange(state, NETDATA.d3pieSetContent(state, data, 0), NETDATA.d3pieDateRange(state, data, 0));
+};
+
+NETDATA.d3pieChartCreate = function (state, data) {
+
+ state.element_chart.id = 'd3pie-' + state.uuid;
+ // console.log('id = ' + state.element_chart.id);
+
+ let content = NETDATA.d3pieSetContent(state, data, 0);
+
+ state.d3pie_forced_title = NETDATA.dataAttribute(state.element, 'd3pie-title', null);
+ state.d3pie_forced_subtitle = NETDATA.dataAttribute(state.element, 'd3pie-subtitle', null);
+ state.d3pie_forced_footer = NETDATA.dataAttribute(state.element, 'd3pie-footer', null);
+
+ state.d3pie_options = {
+ header: {
+ title: {
+ text: (state.d3pie_forced_title !== null) ? state.d3pie_forced_title : state.title,
+ color: NETDATA.dataAttribute(state.element, 'd3pie-title-color', NETDATA.themes.current.d3pie.title),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-title-fontsize', 12),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-title-fontweight', "bold"),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-title-font', "arial")
+ },
+ subtitle: {
+ text: (state.d3pie_forced_subtitle !== null) ? state.d3pie_forced_subtitle : state.units_current,
+ color: NETDATA.dataAttribute(state.element, 'd3pie-subtitle-color', NETDATA.themes.current.d3pie.subtitle),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-subtitle-fontsize', 10),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-subtitle-fontweight', "normal"),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-subtitle-font', "arial")
+ },
+ titleSubtitlePadding: 1
+ },
+ footer: {
+ text: (state.d3pie_forced_footer !== null) ? state.d3pie_forced_footer : NETDATA.d3pieDateRange(state, data, 0),
+ color: NETDATA.dataAttribute(state.element, 'd3pie-footer-color', NETDATA.themes.current.d3pie.footer),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-footer-fontsize', 9),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-footer-fontweight', "bold"),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-footer-font', "arial"),
+ location: NETDATA.dataAttribute(state.element, 'd3pie-footer-location', "bottom-center") // bottom-left, bottom-center, bottom-right
+ },
+ size: {
+ canvasHeight: state.chartHeight(),
+ canvasWidth: state.chartWidth(),
+ pieInnerRadius: NETDATA.dataAttribute(state.element, 'd3pie-pieinnerradius', "45%"),
+ pieOuterRadius: NETDATA.dataAttribute(state.element, 'd3pie-pieouterradius', "80%")
+ },
+ data: {
+ // none, random, value-asc, value-desc, label-asc, label-desc
+ sortOrder: NETDATA.dataAttribute(state.element, 'd3pie-sortorder', "value-desc"),
+ smallSegmentGrouping: {
+ enabled: NETDATA.dataAttributeBoolean(state.element, "d3pie-smallsegmentgrouping-enabled", false),
+ value: NETDATA.dataAttribute(state.element, 'd3pie-smallsegmentgrouping-value', 1),
+ // percentage, value
+ valueType: NETDATA.dataAttribute(state.element, 'd3pie-smallsegmentgrouping-valuetype', "percentage"),
+ label: NETDATA.dataAttribute(state.element, 'd3pie-smallsegmentgrouping-label', "other"),
+ color: NETDATA.dataAttribute(state.element, 'd3pie-smallsegmentgrouping-color', NETDATA.themes.current.d3pie.other)
+ },
+
+ // REQUIRED! This is where you enter your pie data; it needs to be an array of objects
+ // of this form: { label: "label", value: 1.5, color: "#000000" } - color is optional
+ content: content
+ },
+ labels: {
+ outer: {
+ // label, value, percentage, label-value1, label-value2, label-percentage1, label-percentage2
+ format: NETDATA.dataAttribute(state.element, 'd3pie-labels-outer-format', "label-value1"),
+ hideWhenLessThanPercentage: NETDATA.dataAttribute(state.element, 'd3pie-labels-outer-hidewhenlessthanpercentage', null),
+ pieDistance: NETDATA.dataAttribute(state.element, 'd3pie-labels-outer-piedistance', 15)
+ },
+ inner: {
+ // label, value, percentage, label-value1, label-value2, label-percentage1, label-percentage2
+ format: NETDATA.dataAttribute(state.element, 'd3pie-labels-inner-format', "percentage"),
+ hideWhenLessThanPercentage: NETDATA.dataAttribute(state.element, 'd3pie-labels-inner-hidewhenlessthanpercentage', 2)
+ },
+ mainLabel: {
+ color: NETDATA.dataAttribute(state.element, 'd3pie-labels-mainLabel-color', NETDATA.themes.current.d3pie.mainlabel), // or 'segment' for dynamic color
+ font: NETDATA.dataAttribute(state.element, 'd3pie-labels-mainLabel-font', "arial"),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-labels-mainLabel-fontsize', 10),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-labels-mainLabel-fontweight', "normal")
+ },
+ percentage: {
+ color: NETDATA.dataAttribute(state.element, 'd3pie-labels-percentage-color', NETDATA.themes.current.d3pie.percentage),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-labels-percentage-font', "arial"),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-labels-percentage-fontsize', 10),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-labels-percentage-fontweight', "bold"),
+ decimalPlaces: 0
+ },
+ value: {
+ color: NETDATA.dataAttribute(state.element, 'd3pie-labels-value-color', NETDATA.themes.current.d3pie.value),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-labels-value-font', "arial"),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-labels-value-fontsize', 10),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-labels-value-fontweight', "bold")
+ },
+ lines: {
+ enabled: NETDATA.dataAttributeBoolean(state.element, 'd3pie-labels-lines-enabled', true),
+ style: NETDATA.dataAttribute(state.element, 'd3pie-labels-lines-style', "curved"),
+ color: NETDATA.dataAttribute(state.element, 'd3pie-labels-lines-color', "segment") // "segment" or a hex color
+ },
+ truncation: {
+ enabled: NETDATA.dataAttributeBoolean(state.element, 'd3pie-labels-truncation-enabled', false),
+ truncateLength: NETDATA.dataAttribute(state.element, 'd3pie-labels-truncation-truncatelength', 30)
+ },
+ formatter: function (context) {
+ // console.log(context);
+ if (context.part === 'value') {
+ return state.legendFormatValue(context.value);
+ }
+ if (context.part === 'percentage') {
+ return context.label + '%';
+ }
+
+ return context.label;
+ }
+ },
+ effects: {
+ load: {
+ effect: "none", // none / default
+ speed: 0 // commented in the d3pie code to speed it up
+ },
+ pullOutSegmentOnClick: {
+ effect: "bounce", // none / linear / bounce / elastic / back
+ speed: 400,
+ size: 5
+ },
+ highlightSegmentOnMouseover: true,
+ highlightLuminosity: -0.2
+ },
+ tooltips: {
+ enabled: false,
+ type: "placeholder", // caption|placeholder
+ string: "",
+ placeholderParser: null, // function
+ styles: {
+ fadeInSpeed: 250,
+ backgroundColor: NETDATA.themes.current.d3pie.tooltip_bg,
+ backgroundOpacity: 0.5,
+ color: NETDATA.themes.current.d3pie.tooltip_fg,
+ borderRadius: 2,
+ font: "arial",
+ fontSize: 12,
+ padding: 4
+ }
+ },
+ misc: {
+ colors: {
+ background: 'transparent', // transparent or color #
+ // segments: state.chartColors(),
+ segmentStroke: NETDATA.dataAttribute(state.element, 'd3pie-misc-colors-segmentstroke', NETDATA.themes.current.d3pie.segment_stroke)
+ },
+ gradient: {
+ enabled: NETDATA.dataAttributeBoolean(state.element, 'd3pie-misc-gradient-enabled', false),
+ percentage: NETDATA.dataAttribute(state.element, 'd3pie-misc-colors-percentage', 95),
+ color: NETDATA.dataAttribute(state.element, 'd3pie-misc-gradient-color', NETDATA.themes.current.d3pie.gradient_color)
+ },
+ canvasPadding: {
+ top: 5,
+ right: 5,
+ bottom: 5,
+ left: 5
+ },
+ pieCenterOffset: {
+ x: 0,
+ y: 0
+ },
+ cssPrefix: NETDATA.dataAttribute(state.element, 'd3pie-cssprefix', null)
+ },
+ callbacks: {
+ onload: null,
+ onMouseoverSegment: null,
+ onMouseoutSegment: null,
+ onClickSegment: null
+ }
+ };
+
+ state.d3pie_instance = new d3pie(state.element_chart, state.d3pie_options);
+ return true;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// D3
+
+NETDATA.d3Initialize = function(callback) {
+ if (typeof netdataStopD3 === 'undefined' || !netdataStopD3) {
+ $.ajax({
+ url: NETDATA.d3_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: { withCredentials: true } // required for the cookie
+ })
+ .done(function() {
+ NETDATA.registerChartLibrary('d3', NETDATA.d3_js);
+ })
+ .fail(function() {
+ NETDATA.chartLibraries.d3.enabled = false;
+ NETDATA.error(100, NETDATA.d3_js);
+ })
+ .always(function() {
+ if (typeof callback === "function")
+ return callback();
+ });
+ } else {
+ NETDATA.chartLibraries.d3.enabled = false;
+ if (typeof callback === "function")
+ return callback();
+ }
+};
+
+NETDATA.d3ChartUpdate = function(state, data) {
+ void(state);
+ void(data);
+
+ return false;
+};
+
+NETDATA.d3ChartCreate = function(state, data) {
+ void(state);
+ void(data);
+
+ return false;
+};
+
+// peity
+
+NETDATA.peityInitialize = function (callback) {
+ if (typeof netdataNoPeitys === 'undefined' || !netdataNoPeitys) {
+ $.ajax({
+ url: NETDATA.peity_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('peity', NETDATA.peity_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.peity.enabled = false;
+ NETDATA.error(100, NETDATA.peity_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ } else {
+ NETDATA.chartLibraries.peity.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.peityChartUpdate = function (state, data) {
+ state.peity_instance.innerHTML = data.result;
+
+ if (state.peity_options.stroke !== state.chartCustomColors()[0]) {
+ state.peity_options.stroke = state.chartCustomColors()[0];
+ if (state.chart.chart_type === 'line') {
+ state.peity_options.fill = NETDATA.themes.current.background;
+ } else {
+ state.peity_options.fill = NETDATA.colorLuminance(state.chartCustomColors()[0], NETDATA.chartDefaults.fill_luminance);
+ }
+ }
+
+ $(state.peity_instance).peity('line', state.peity_options);
+ return true;
+};
+
+NETDATA.peityChartCreate = function (state, data) {
+ state.peity_instance = document.createElement('div');
+ state.element_chart.appendChild(state.peity_instance);
+
+ state.peity_options = {
+ stroke: NETDATA.themes.current.foreground,
+ strokeWidth: NETDATA.dataAttribute(state.element, 'peity-strokewidth', 1),
+ width: state.chartWidth(),
+ height: state.chartHeight(),
+ fill: NETDATA.themes.current.foreground
+ };
+
+ NETDATA.peityChartUpdate(state, data);
+ return true;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// "Text-only" chart - Just renders the raw value to the DOM
+
+NETDATA.textOnlyCreate = function(state, data) {
+ var decimalPlaces = NETDATA.dataAttribute(state.element, 'textonly-decimal-places', 1);
+ var prefix = NETDATA.dataAttribute(state.element, 'textonly-prefix', '');
+ var suffix = NETDATA.dataAttribute(state.element, 'textonly-suffix', '');
+
+ // Round based on number of decimal places to show
+ var precision = Math.pow(10, decimalPlaces);
+ var value = Math.round(data.result[0] * precision) / precision;
+
+ state.element.textContent = prefix + value + suffix;
+ return true;
+}
+
+NETDATA.textOnlyUpdate = NETDATA.textOnlyCreate;
+// Charts Libraries Registration
+
+NETDATA.chartLibraries = {
+ "dygraph": {
+ initialize: NETDATA.dygraphInitialize,
+ create: NETDATA.dygraphChartCreate,
+ update: NETDATA.dygraphChartUpdate,
+ resize: function (state) {
+ if (typeof state.tmp.dygraph_instance !== 'undefined' && typeof state.tmp.dygraph_instance.resize === 'function') {
+ state.tmp.dygraph_instance.resize();
+ }
+ },
+ setSelection: NETDATA.dygraphSetSelection,
+ clearSelection: NETDATA.dygraphClearSelection,
+ toolboxPanAndZoom: NETDATA.dygraphToolboxPanAndZoom,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ format: function (state) {
+ void(state);
+ return 'json';
+ },
+ options: function (state) {
+ return 'ms' + '%7C' + 'flip' + (this.isLogScale(state) ? ('%7C' + 'abs') : '').toString();
+ },
+ legend: function (state) {
+ return (this.isSparkline(state) === false && NETDATA.dataAttributeBoolean(state.element, 'legend', true) === true) ? 'right-side' : null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return true;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return true;
+ },
+ pixels_per_point: function (state) {
+ return (this.isSparkline(state) === false) ? 3 : 2;
+ },
+ isSparkline: function (state) {
+ if (typeof state.tmp.dygraph_sparkline === 'undefined') {
+ state.tmp.dygraph_sparkline = (this.theme(state) === 'sparkline');
+ }
+ return state.tmp.dygraph_sparkline;
+ },
+ isLogScale: function (state) {
+ if (typeof state.tmp.dygraph_logscale === 'undefined') {
+ state.tmp.dygraph_logscale = (this.theme(state) === 'logscale');
+ }
+ return state.tmp.dygraph_logscale;
+ },
+ theme: function (state) {
+ if (typeof state.tmp.dygraph_theme === 'undefined') {
+ state.tmp.dygraph_theme = NETDATA.dataAttribute(state.element, 'dygraph-theme', 'default');
+ }
+ return state.tmp.dygraph_theme;
+ },
+ container_class: function (state) {
+ if (this.legend(state) !== null) {
+ return 'netdata-container-with-legend';
+ }
+ return 'netdata-container';
+ }
+ },
+ "sparkline": {
+ initialize: NETDATA.sparklineInitialize,
+ create: NETDATA.sparklineChartCreate,
+ update: NETDATA.sparklineChartUpdate,
+ resize: null,
+ setSelection: undefined, // function(state, t) { void(state); return true; },
+ clearSelection: undefined, // function(state) { void(state); return true; },
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ format: function (state) {
+ void(state);
+ return 'array';
+ },
+ options: function (state) {
+ void(state);
+ return 'flip' + '%7C' + 'abs';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ "peity": {
+ initialize: NETDATA.peityInitialize,
+ create: NETDATA.peityChartCreate,
+ update: NETDATA.peityChartUpdate,
+ resize: null,
+ setSelection: undefined, // function(state, t) { void(state); return true; },
+ clearSelection: undefined, // function(state) { void(state); return true; },
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ format: function (state) {
+ void(state);
+ return 'ssvcomma';
+ },
+ options: function (state) {
+ void(state);
+ return 'null2zero' + '%7C' + 'flip' + '%7C' + 'abs';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ // "morris": {
+ // initialize: NETDATA.morrisInitialize,
+ // create: NETDATA.morrisChartCreate,
+ // update: NETDATA.morrisChartUpdate,
+ // resize: null,
+ // setSelection: undefined, // function(state, t) { void(state); return true; },
+ // clearSelection: undefined, // function(state) { void(state); return true; },
+ // toolboxPanAndZoom: null,
+ // initialized: false,
+ // enabled: true,
+ // xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ // format: function(state) { void(state); return 'json'; },
+ // options: function(state) { void(state); return 'objectrows' + '%7C' + 'ms'; },
+ // legend: function(state) { void(state); return null; },
+ // autoresize: function(state) { void(state); return false; },
+ // max_updates_to_recreate: function(state) { void(state); return 50; },
+ // track_colors: function(state) { void(state); return false; },
+ // pixels_per_point: function(state) { void(state); return 15; },
+ // container_class: function(state) { void(state); return 'netdata-container'; }
+ // },
+ "google": {
+ initialize: NETDATA.googleInitialize,
+ create: NETDATA.googleChartCreate,
+ update: NETDATA.googleChartUpdate,
+ resize: null,
+ setSelection: undefined, //function(state, t) { void(state); return true; },
+ clearSelection: undefined, //function(state) { void(state); return true; },
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result.rows$'),
+ format: function (state) {
+ void(state);
+ return 'datatable';
+ },
+ options: function (state) {
+ void(state);
+ return '';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 300;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 4;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ // "raphael": {
+ // initialize: NETDATA.raphaelInitialize,
+ // create: NETDATA.raphaelChartCreate,
+ // update: NETDATA.raphaelChartUpdate,
+ // resize: null,
+ // setSelection: undefined, // function(state, t) { void(state); return true; },
+ // clearSelection: undefined, // function(state) { void(state); return true; },
+ // toolboxPanAndZoom: null,
+ // initialized: false,
+ // enabled: true,
+ // xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ // format: function(state) { void(state); return 'json'; },
+ // options: function(state) { void(state); return ''; },
+ // legend: function(state) { void(state); return null; },
+ // autoresize: function(state) { void(state); return false; },
+ // max_updates_to_recreate: function(state) { void(state); return 5000; },
+ // track_colors: function(state) { void(state); return false; },
+ // pixels_per_point: function(state) { void(state); return 3; },
+ // container_class: function(state) { void(state); return 'netdata-container'; }
+ // },
+ // "c3": {
+ // initialize: NETDATA.c3Initialize,
+ // create: NETDATA.c3ChartCreate,
+ // update: NETDATA.c3ChartUpdate,
+ // resize: null,
+ // setSelection: undefined, // function(state, t) { void(state); return true; },
+ // clearSelection: undefined, // function(state) { void(state); return true; },
+ // toolboxPanAndZoom: null,
+ // initialized: false,
+ // enabled: true,
+ // xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ // format: function(state) { void(state); return 'csvjsonarray'; },
+ // options: function(state) { void(state); return 'milliseconds'; },
+ // legend: function(state) { void(state); return null; },
+ // autoresize: function(state) { void(state); return false; },
+ // max_updates_to_recreate: function(state) { void(state); return 5000; },
+ // track_colors: function(state) { void(state); return false; },
+ // pixels_per_point: function(state) { void(state); return 15; },
+ // container_class: function(state) { void(state); return 'netdata-container'; }
+ // },
+ "d3pie": {
+ initialize: NETDATA.d3pieInitialize,
+ create: NETDATA.d3pieChartCreate,
+ update: NETDATA.d3pieChartUpdate,
+ resize: null,
+ setSelection: NETDATA.d3pieSetSelection,
+ clearSelection: NETDATA.d3pieClearSelection,
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ format: function (state) {
+ void(state);
+ return 'json';
+ },
+ options: function (state) {
+ void(state);
+ return 'objectrows' + '%7C' + 'ms';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 15;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ "d3": {
+ initialize: NETDATA.d3Initialize,
+ create: NETDATA.d3ChartCreate,
+ update: NETDATA.d3ChartUpdate,
+ resize: null,
+ setSelection: undefined, // function(state, t) { void(state); return true; },
+ clearSelection: undefined, // function(state) { void(state); return true; },
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ format: function (state) {
+ void(state);
+ return 'json';
+ },
+ options: function (state) {
+ void(state);
+ return '';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ "easypiechart": {
+ initialize: NETDATA.easypiechartInitialize,
+ create: NETDATA.easypiechartChartCreate,
+ update: NETDATA.easypiechartChartUpdate,
+ resize: null,
+ setSelection: NETDATA.easypiechartSetSelection,
+ clearSelection: NETDATA.easypiechartClearSelection,
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ format: function (state) {
+ void(state);
+ return 'array';
+ },
+ options: function (state) {
+ void(state);
+ return 'absolute';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return true;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ aspect_ratio: 100,
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container-easypiechart';
+ }
+ },
+ "gauge": {
+ initialize: NETDATA.gaugeInitialize,
+ create: NETDATA.gaugeChartCreate,
+ update: NETDATA.gaugeChartUpdate,
+ resize: null,
+ setSelection: NETDATA.gaugeSetSelection,
+ clearSelection: NETDATA.gaugeClearSelection,
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ format: function (state) {
+ void(state);
+ return 'array';
+ },
+ options: function (state) {
+ void(state);
+ return 'absolute';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return true;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ aspect_ratio: 60,
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container-gauge';
+ }
+ },
+ "textonly": {
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ },
+ create: NETDATA.textOnlyCreate,
+ enabled: true,
+ format: function (state) {
+ void(state);
+ return 'array';
+ },
+ initialized: true,
+ initialize: function (callback) {
+ callback();
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ options: function (state) {
+ void(state);
+ return 'absolute';
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ update: NETDATA.textOnlyUpdate,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ }
+};
+
+NETDATA.registerChartLibrary = function (library, url) {
+ if (NETDATA.options.debug.libraries) {
+ console.log("registering chart library: " + library);
+ }
+
+ NETDATA.chartLibraries[library].url = url;
+ NETDATA.chartLibraries[library].initialized = true;
+ NETDATA.chartLibraries[library].enabled = true;
+};
+
+// *** src/dashboard.js/chart-registry.js
+
+// Chart Registry
+
+// When multiple charts need the same chart, we avoid downloading it
+// multiple times (and having it in browser memory multiple time)
+// by using this registry.
+
+// Every time we download a chart definition, we save it here with .add()
+// Then we try to get it back with .get(). If that fails, we download it.
+
+NETDATA.fixHost = function (host) {
+ while (host.slice(-1) === '/') {
+ host = host.substring(0, host.length - 1);
+ }
+
+ return host;
+};
+
+NETDATA.chartRegistry = {
+ charts: {},
+
+ globalReset: function () {
+ this.charts = {};
+ },
+
+ add: function (host, id, data) {
+ if (typeof this.charts[host] === 'undefined') {
+ this.charts[host] = {};
+ }
+
+ //console.log('added ' + host + '/' + id);
+ this.charts[host][id] = data;
+ },
+
+ get: function (host, id) {
+ if (typeof this.charts[host] === 'undefined') {
+ return null;
+ }
+
+ if (typeof this.charts[host][id] === 'undefined') {
+ return null;
+ }
+
+ //console.log('cached ' + host + '/' + id);
+ return this.charts[host][id];
+ },
+
+ downloadAll: function (host, callback) {
+ host = NETDATA.fixHost(host);
+
+ let self = this;
+
+ function got_data(h, data, callback) {
+ if (data !== null) {
+ self.charts[h] = data.charts;
+
+ // update the server timezone in our options
+ if (typeof data.timezone === 'string') {
+ NETDATA.options.server_timezone = data.timezone;
+ }
+ } else {
+ NETDATA.error(406, h + '/api/v1/charts');
+ }
+
+ if (typeof callback === 'function') {
+ callback(data);
+ }
+ }
+
+ if (netdataSnapshotData !== null) {
+ got_data(host, netdataSnapshotData.charts, callback);
+ } else {
+ $.ajax({
+ url: host + '/api/v1/charts',
+ async: true,
+ cache: false,
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkOptional('/api/v1/charts', data);
+ got_data(host, data, callback);
+ })
+ .fail(function () {
+ NETDATA.error(405, host + '/api/v1/charts');
+
+ if (typeof callback === 'function') {
+ callback(null);
+ }
+ });
+ }
+ }
+};
+
+// Compute common (joint) values over multiple charts.
+
+
+// commonMin & commonMax
+
+NETDATA.commonMin = {
+ keys: {},
+ latest: {},
+
+ globalReset: function () {
+ this.keys = {};
+ this.latest = {};
+ },
+
+ get: function (state) {
+ if (typeof state.tmp.__commonMin === 'undefined') {
+ // get the commonMin setting
+ state.tmp.__commonMin = NETDATA.dataAttribute(state.element, 'common-min', null);
+ }
+
+ let min = state.data.min;
+ let name = state.tmp.__commonMin;
+
+ if (name === null) {
+ // we don't need commonMin
+ //state.log('no need for commonMin');
+ return min;
+ }
+
+ let t = this.keys[name];
+ if (typeof t === 'undefined') {
+ // add our commonMin
+ this.keys[name] = {};
+ t = this.keys[name];
+ }
+
+ let uuid = state.uuid;
+ if (typeof t[uuid] !== 'undefined') {
+ if (t[uuid] === min) {
+ //state.log('commonMin ' + state.tmp.__commonMin + ' not changed: ' + this.latest[name]);
+ return this.latest[name];
+ } else if (min < this.latest[name]) {
+ //state.log('commonMin ' + state.tmp.__commonMin + ' increased: ' + min);
+ t[uuid] = min;
+ this.latest[name] = min;
+ return min;
+ }
+ }
+
+ // add our min
+ t[uuid] = min;
+
+ // find the common min
+ let m = min;
+ // for (let i in t) {
+ // if (t.hasOwnProperty(i) && t[i] < m) m = t[i];
+ // }
+ for (var ti of Object.values(t)) {
+ if (ti < m) {
+ m = ti;
+ }
+ }
+
+ //state.log('commonMin ' + state.tmp.__commonMin + ' updated: ' + m);
+ this.latest[name] = m;
+ return m;
+ }
+};
+
+NETDATA.commonMax = {
+ keys: {},
+ latest: {},
+
+ globalReset: function () {
+ this.keys = {};
+ this.latest = {};
+ },
+
+ get: function (state) {
+ if (typeof state.tmp.__commonMax === 'undefined') {
+ // get the commonMax setting
+ state.tmp.__commonMax = NETDATA.dataAttribute(state.element, 'common-max', null);
+ }
+
+ let max = state.data.max;
+ let name = state.tmp.__commonMax;
+
+ if (name === null) {
+ // we don't need commonMax
+ //state.log('no need for commonMax');
+ return max;
+ }
+
+ let t = this.keys[name];
+ if (typeof t === 'undefined') {
+ // add our commonMax
+ this.keys[name] = {};
+ t = this.keys[name];
+ }
+
+ let uuid = state.uuid;
+ if (typeof t[uuid] !== 'undefined') {
+ if (t[uuid] === max) {
+ //state.log('commonMax ' + state.tmp.__commonMax + ' not changed: ' + this.latest[name]);
+ return this.latest[name];
+ } else if (max > this.latest[name]) {
+ //state.log('commonMax ' + state.tmp.__commonMax + ' increased: ' + max);
+ t[uuid] = max;
+ this.latest[name] = max;
+ return max;
+ }
+ }
+
+ // add our max
+ t[uuid] = max;
+
+ // find the common max
+ let m = max;
+ // for (let i in t) {
+ // if (t.hasOwnProperty(i) && t[i] > m) m = t[i];
+ // }
+ for (var ti of Object.values(t)) {
+ if (ti > m) {
+ m = ti;
+ }
+ }
+
+ //state.log('commonMax ' + state.tmp.__commonMax + ' updated: ' + m);
+ this.latest[name] = m;
+ return m;
+ }
+};
+
+NETDATA.commonColors = {
+ keys: {},
+
+ globalReset: function () {
+ this.keys = {};
+ },
+
+ get: function (state, label) {
+ let ret = this.refill(state);
+
+ if (typeof ret.assigned[label] === 'undefined') {
+ ret.assigned[label] = ret.available.shift();
+ }
+
+ return ret.assigned[label];
+ },
+
+ refill: function (state) {
+ let ret, len;
+
+ if (typeof state.tmp.__commonColors === 'undefined') {
+ ret = this.prepare(state);
+ } else {
+ ret = this.keys[state.tmp.__commonColors];
+ if (typeof ret === 'undefined') {
+ ret = this.prepare(state);
+ }
+ }
+
+ if (ret.available.length === 0) {
+ if (ret.copy_theme || ret.custom.length === 0) {
+ // copy the theme colors
+ len = NETDATA.themes.current.colors.length;
+ while (len--) {
+ ret.available.unshift(NETDATA.themes.current.colors[len]);
+ }
+ }
+
+ // copy the custom colors
+ len = ret.custom.length;
+ while (len--) {
+ ret.available.unshift(ret.custom[len]);
+ }
+ }
+
+ state.colors_assigned = ret.assigned;
+ state.colors_available = ret.available;
+ state.colors_custom = ret.custom;
+
+ return ret;
+ },
+
+ __read_custom_colors: function (state, ret) {
+ // add the user supplied colors
+ let c = NETDATA.dataAttribute(state.element, 'colors', undefined);
+ if (typeof c === 'string' && c.length > 0) {
+ c = c.split(' ');
+ let len = c.length;
+
+ if (len > 0 && c[len - 1] === 'ONLY') {
+ len--;
+ ret.copy_theme = false;
+ }
+
+ while (len--) {
+ ret.custom.unshift(c[len]);
+ }
+ }
+ },
+
+ prepare: function (state) {
+ let has_custom_colors = false;
+
+ if (typeof state.tmp.__commonColors === 'undefined') {
+ let defname = state.chart.context;
+
+ // if this chart has data-colors=""
+ // we should use the chart uuid as the default key (private palette)
+ // (data-common-colors="NAME" will be used anyways)
+ let c = NETDATA.dataAttribute(state.element, 'colors', undefined);
+ if (typeof c === 'string' && c.length > 0) {
+ defname = state.uuid;
+ has_custom_colors = true;
+ }
+
+ // get the commonColors setting
+ state.tmp.__commonColors = NETDATA.dataAttribute(state.element, 'common-colors', defname);
+ }
+
+ let name = state.tmp.__commonColors;
+ let ret = this.keys[name];
+
+ if (typeof ret === 'undefined') {
+ // add our commonMax
+ this.keys[name] = {
+ assigned: {}, // name-value of dimensions and their colors
+ available: [], // an array of colors available to be used
+ custom: [], // the array of colors defined by the user
+ charts: {}, // the charts linked to this
+ copy_theme: true
+ };
+ ret = this.keys[name];
+ }
+
+ if (typeof ret.charts[state.uuid] === 'undefined') {
+ ret.charts[state.uuid] = state;
+
+ if (has_custom_colors) {
+ this.__read_custom_colors(state, ret);
+ }
+ }
+
+ return ret;
+ }
+};
+
+// *** src/dashboard.js/main.js
+
+// Codacy declarations
+/* global clipboard */
+/* global Ps */
+
+if (NETDATA.options.debug.main_loop) {
+ console.log('welcome to NETDATA');
+}
+
+NETDATA.onresizeCallback = null;
+NETDATA.onresize = function () {
+ NETDATA.options.last_page_resize = Date.now();
+ NETDATA.onscroll();
+
+ if (typeof NETDATA.onresizeCallback === 'function') {
+ NETDATA.onresizeCallback();
+ }
+};
+
+NETDATA.abortAllRefreshes = function () {
+ let targets = NETDATA.options.targets;
+ let len = targets.length;
+
+ while (len--) {
+ if (targets[len].fetching_data) {
+ if (typeof targets[len].xhr !== 'undefined') {
+ targets[len].xhr.abort();
+ targets[len].running = false;
+ targets[len].fetching_data = false;
+ }
+ }
+ }
+};
+
+NETDATA.onscrollStartDelay = function () {
+ NETDATA.options.last_page_scroll = Date.now();
+
+ NETDATA.options.on_scroll_refresher_stop_until =
+ NETDATA.options.last_page_scroll
+ + (NETDATA.options.current.async_on_scroll ? 1000 : 0);
+};
+
+NETDATA.onscrollEndDelay = function () {
+ NETDATA.options.on_scroll_refresher_stop_until =
+ Date.now()
+ + (NETDATA.options.current.async_on_scroll ? NETDATA.options.current.onscroll_worker_duration_threshold : 0);
+};
+
+NETDATA.onscroll_updater_timeout_id = undefined;
+NETDATA.onscrollUpdater = function () {
+ NETDATA.globalSelectionSync.stop();
+
+ if (NETDATA.options.abort_ajax_on_scroll) {
+ NETDATA.abortAllRefreshes();
+ }
+
+ // when the user scrolls he sees that we have
+ // hidden all the not-visible charts
+ // using this little function we try to switch
+ // the charts back to visible quickly
+
+ if (!NETDATA.intersectionObserver.enabled()) {
+ if (!NETDATA.options.current.parallel_refresher) {
+ let targets = NETDATA.options.targets;
+ let len = targets.length;
+
+ while (len--) {
+ if (!targets[len].running) {
+ targets[len].isVisible();
+ }
+ }
+ }
+ }
+
+ NETDATA.onscrollEndDelay();
+};
+
+NETDATA.scrollUp = false;
+NETDATA.scrollY = window.scrollY;
+NETDATA.onscroll = function () {
+ //console.log('onscroll() begin');
+
+ NETDATA.onscrollStartDelay();
+ NETDATA.chartRefresherReschedule();
+
+ NETDATA.scrollUp = (window.scrollY > NETDATA.scrollY);
+ NETDATA.scrollY = window.scrollY;
+
+ if (NETDATA.onscroll_updater_timeout_id) {
+ NETDATA.timeout.clear(NETDATA.onscroll_updater_timeout_id);
+ }
+
+ NETDATA.onscroll_updater_timeout_id = NETDATA.timeout.set(NETDATA.onscrollUpdater, 0);
+ //console.log('onscroll() end');
+};
+
+NETDATA.supportsPassiveEvents = function () {
+ if (NETDATA.options.passive_events === null) {
+ let supportsPassive = false;
+ try {
+ let opts = Object.defineProperty({}, 'passive', {
+ get: function () {
+ supportsPassive = true;
+ }
+ });
+ window.addEventListener("test", null, opts);
+ } catch (e) {
+ console.log('browser does not support passive events');
+ }
+
+ NETDATA.options.passive_events = supportsPassive;
+ }
+
+ // console.log('passive ' + NETDATA.options.passive_events);
+ return NETDATA.options.passive_events;
+};
+
+window.addEventListener('resize', NETDATA.onresize, NETDATA.supportsPassiveEvents() ? {passive: true} : false);
+window.addEventListener('scroll', NETDATA.onscroll, NETDATA.supportsPassiveEvents() ? {passive: true} : false);
+// window.onresize = NETDATA.onresize;
+// window.onscroll = NETDATA.onscroll;
+
+// ----------------------------------------------------------------------------------------------------------------
+// Global Pan and Zoom on charts
+
+// Using this structure are synchronize all the charts, so that
+// when you pan or zoom one, all others are automatically refreshed
+// to the same timespan.
+
+NETDATA.globalPanAndZoom = {
+ seq: 0, // timestamp ms
+ // every time a chart is panned or zoomed
+ // we set the timestamp here
+ // then we use it as a sequence number
+ // to find if other charts are synchronized
+ // to this time-range
+
+ master: null, // the master chart (state), to which all others
+ // are synchronized
+
+ force_before_ms: null, // the timespan to sync all other charts
+ force_after_ms: null,
+
+ callback: null,
+
+ globalReset: function () {
+ this.clearMaster();
+ this.seq = 0;
+ this.master = null;
+ this.force_after_ms = null;
+ this.force_before_ms = null;
+ this.callback = null;
+ },
+
+ delay: function () {
+ if (NETDATA.options.debug.globalPanAndZoom) {
+ console.log('globalPanAndZoom.delay()');
+ }
+
+ NETDATA.options.auto_refresher_stop_until = Date.now() + NETDATA.options.current.global_pan_sync_time;
+ },
+
+ // set a new master
+ setMaster: function (state, after, before) {
+ this.delay();
+
+ if (!NETDATA.options.current.sync_pan_and_zoom) {
+ return;
+ }
+
+ if (this.master === null) {
+ if (NETDATA.options.debug.globalPanAndZoom) {
+ console.log('globalPanAndZoom.setMaster(' + state.id + ', ' + after + ', ' + before + ') SET MASTER');
+ }
+ } else if (this.master !== state) {
+ if (NETDATA.options.debug.globalPanAndZoom) {
+ console.log('globalPanAndZoom.setMaster(' + state.id + ', ' + after + ', ' + before + ') CHANGED MASTER');
+ }
+
+ this.master.resetChart(true, true);
+ }
+
+ let now = Date.now();
+ this.master = state;
+ this.seq = now;
+ this.force_after_ms = after;
+ this.force_before_ms = before;
+
+ if (typeof this.callback === 'function') {
+ this.callback(true, after, before);
+ }
+ },
+
+ // clear the master
+ clearMaster: function () {
+ // if (NETDATA.options.debug.globalPanAndZoom === true)
+ // console.log('globalPanAndZoom.clearMaster()');
+ if (NETDATA.options.debug.globalPanAndZoom) {
+ console.log('globalPanAndZoom.clearMaster()');
+ }
+
+ if (this.master !== null) {
+ let st = this.master;
+ this.master = null;
+ st.resetChart();
+ }
+
+ this.master = null;
+ this.seq = 0;
+ this.force_after_ms = null;
+ this.force_before_ms = null;
+ NETDATA.options.auto_refresher_stop_until = 0;
+
+ if (typeof this.callback === 'function') {
+ this.callback(false, 0, 0);
+ }
+ },
+
+ // is the given state the master of the global
+ // pan and zoom sync?
+ isMaster: function (state) {
+ return (this.master === state);
+ },
+
+ // are we currently have a global pan and zoom sync?
+ isActive: function () {
+ return (this.master !== null && this.force_before_ms !== null && this.force_after_ms !== null && this.seq !== 0);
+ },
+
+ // check if a chart, other than the master
+ // needs to be refreshed, due to the global pan and zoom
+ shouldBeAutoRefreshed: function (state) {
+ if (this.master === null || this.seq === 0) {
+ return false;
+ }
+
+ //if (state.needsRecreation())
+ // return true;
+
+ return (state.tm.pan_and_zoom_seq !== this.seq);
+ }
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// global chart underlay (time-frame highlighting)
+
+NETDATA.globalChartUnderlay = {
+ callback: null, // what to call when a highlighted range is setup
+ after: null, // highlight after this time
+ before: null, // highlight before this time
+ view_after: null, // the charts after_ms viewport when the highlight was setup
+ view_before: null, // the charts before_ms viewport, when the highlight was setup
+ state: null, // the chart the highlight was setup
+
+ isActive: function () {
+ return (this.after !== null && this.before !== null);
+ },
+
+ hasViewport: function () {
+ return (this.state !== null && this.view_after !== null && this.view_before !== null);
+ },
+
+ init: function (state, after, before, view_after, view_before) {
+ this.state = (typeof state !== 'undefined') ? state : null;
+ this.after = (typeof after !== 'undefined' && after !== null && after > 0) ? after : null;
+ this.before = (typeof before !== 'undefined' && before !== null && before > 0) ? before : null;
+ this.view_after = (typeof view_after !== 'undefined' && view_after !== null && view_after > 0) ? view_after : null;
+ this.view_before = (typeof view_before !== 'undefined' && view_before !== null && view_before > 0) ? view_before : null;
+ },
+
+ setup: function () {
+ if (this.isActive()) {
+ if (this.state === null) {
+ this.state = NETDATA.options.targets[0];
+ }
+
+ if (typeof this.callback === 'function') {
+ this.callback(true, this.after, this.before);
+ }
+ } else {
+ if (typeof this.callback === 'function') {
+ this.callback(false, 0, 0);
+ }
+ }
+ },
+
+ set: function (state, after, before, view_after, view_before) {
+ if (after > before) {
+ let t = after;
+ after = before;
+ before = t;
+ }
+
+ this.init(state, after, before, view_after, view_before);
+
+ // if (this.hasViewport() === true)
+ // NETDATA.globalPanAndZoom.setMaster(this.state, this.view_after, this.view_before);
+ if (this.hasViewport()) {
+ NETDATA.globalPanAndZoom.setMaster(this.state, this.view_after, this.view_before);
+ }
+
+ this.setup();
+ },
+
+ clear: function () {
+ this.after = null;
+ this.before = null;
+ this.state = null;
+ this.view_after = null;
+ this.view_before = null;
+
+ if (typeof this.callback === 'function') {
+ this.callback(false, 0, 0);
+ }
+ },
+
+ focus: function () {
+ if (this.isActive() && this.hasViewport()) {
+ if (this.state === null) {
+ this.state = NETDATA.options.targets[0];
+ }
+
+ if (NETDATA.globalPanAndZoom.isMaster(this.state)) {
+ NETDATA.globalPanAndZoom.clearMaster();
+ }
+
+ NETDATA.globalPanAndZoom.setMaster(this.state, this.view_after, this.view_before, true);
+ }
+ }
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// dimensions selection
+
+// TODO
+// move color assignment to dimensions, here
+
+let dimensionStatus = function (parent, label, name_div, value_div, color) {
+ this.enabled = false;
+ this.parent = parent;
+ this.label = label;
+ this.name_div = null;
+ this.value_div = null;
+ this.color = NETDATA.themes.current.foreground;
+ this.selected = (parent.unselected_count === 0);
+
+ this.setOptions(name_div, value_div, color);
+};
+
+dimensionStatus.prototype.invalidate = function () {
+ this.name_div = null;
+ this.value_div = null;
+ this.enabled = false;
+};
+
+dimensionStatus.prototype.setOptions = function (name_div, value_div, color) {
+ this.color = color;
+
+ if (this.name_div !== name_div) {
+ this.name_div = name_div;
+ this.name_div.title = this.label;
+ this.name_div.style.setProperty('color', this.color, 'important');
+ if (!this.selected) {
+ this.name_div.className = 'netdata-legend-name not-selected';
+ } else {
+ this.name_div.className = 'netdata-legend-name selected';
+ }
+ }
+
+ if (this.value_div !== value_div) {
+ this.value_div = value_div;
+ this.value_div.title = this.label;
+ this.value_div.style.setProperty('color', this.color, 'important');
+ if (!this.selected) {
+ this.value_div.className = 'netdata-legend-value not-selected';
+ } else {
+ this.value_div.className = 'netdata-legend-value selected';
+ }
+ }
+
+ this.enabled = true;
+ this.setHandler();
+};
+
+dimensionStatus.prototype.setHandler = function () {
+ if (!this.enabled) {
+ return;
+ }
+
+ let ds = this;
+
+ // this.name_div.onmousedown = this.value_div.onmousedown = function(e) {
+ this.name_div.onclick = this.value_div.onclick = function (e) {
+ e.preventDefault();
+ if (ds.isSelected()) {
+ // this is selected
+ if (e.shiftKey || e.ctrlKey) {
+ // control or shift key is pressed -> unselect this (except is none will remain selected, in which case select all)
+ ds.unselect();
+
+ if (ds.parent.countSelected() === 0) {
+ ds.parent.selectAll();
+ }
+ } else {
+ // no key is pressed -> select only this (except if it is the only selected already, in which case select all)
+ if (ds.parent.countSelected() === 1) {
+ ds.parent.selectAll();
+ } else {
+ ds.parent.selectNone();
+ ds.select();
+ }
+ }
+ }
+ else {
+ // this is not selected
+ if (e.shiftKey || e.ctrlKey) {
+ // control or shift key is pressed -> select this too
+ ds.select();
+ } else {
+ // no key is pressed -> select only this
+ ds.parent.selectNone();
+ ds.select();
+ }
+ }
+
+ ds.parent.state.redrawChart();
+ }
+};
+
+dimensionStatus.prototype.select = function () {
+ if (!this.enabled) {
+ return;
+ }
+
+ this.name_div.className = 'netdata-legend-name selected';
+ this.value_div.className = 'netdata-legend-value selected';
+ this.selected = true;
+};
+
+dimensionStatus.prototype.unselect = function () {
+ if (!this.enabled) {
+ return;
+ }
+
+ this.name_div.className = 'netdata-legend-name not-selected';
+ this.value_div.className = 'netdata-legend-value hidden';
+ this.selected = false;
+};
+
+dimensionStatus.prototype.isSelected = function () {
+ // return(this.enabled === true && this.selected === true);
+ return this.enabled && this.selected;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+
+let dimensionsVisibility = function (state) {
+ this.state = state;
+ this.len = 0;
+ this.dimensions = {};
+ this.selected_count = 0;
+ this.unselected_count = 0;
+};
+
+dimensionsVisibility.prototype.dimensionAdd = function (label, name_div, value_div, color) {
+ if (typeof this.dimensions[label] === 'undefined') {
+ this.len++;
+ this.dimensions[label] = new dimensionStatus(this, label, name_div, value_div, color);
+ } else {
+ this.dimensions[label].setOptions(name_div, value_div, color);
+ }
+
+ return this.dimensions[label];
+};
+
+dimensionsVisibility.prototype.dimensionGet = function (label) {
+ return this.dimensions[label];
+};
+
+dimensionsVisibility.prototype.invalidateAll = function () {
+ let keys = Object.keys(this.dimensions);
+ let len = keys.length;
+ while (len--) {
+ this.dimensions[keys[len]].invalidate();
+ }
+};
+
+dimensionsVisibility.prototype.selectAll = function () {
+ let keys = Object.keys(this.dimensions);
+ let len = keys.length;
+ while (len--) {
+ this.dimensions[keys[len]].select();
+ }
+};
+
+dimensionsVisibility.prototype.countSelected = function () {
+ let selected = 0;
+ let keys = Object.keys(this.dimensions);
+ let len = keys.length;
+ while (len--) {
+ if (this.dimensions[keys[len]].isSelected()) {
+ selected++;
+ }
+ }
+
+ return selected;
+};
+
+dimensionsVisibility.prototype.selectNone = function () {
+ let keys = Object.keys(this.dimensions);
+ let len = keys.length;
+ while (len--) {
+ this.dimensions[keys[len]].unselect();
+ }
+};
+
+dimensionsVisibility.prototype.selected2BooleanArray = function (array) {
+ let ret = [];
+ this.selected_count = 0;
+ this.unselected_count = 0;
+
+ let len = array.length;
+ while (len--) {
+ let ds = this.dimensions[array[len]];
+ if (typeof ds === 'undefined') {
+ // console.log(array[i] + ' is not found');
+ ret.unshift(false);
+ } else if (ds.isSelected()) {
+ ret.unshift(true);
+ this.selected_count++;
+ } else {
+ ret.unshift(false);
+ this.unselected_count++;
+ }
+ }
+
+ if (this.selected_count === 0 && this.unselected_count !== 0) {
+ this.selectAll();
+ return this.selected2BooleanArray(array);
+ }
+
+ return ret;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// date/time conversion
+
+NETDATA.dateTime = {
+ using_timezone: false,
+
+ // these are the old netdata functions
+ // we fallback to these, if the new ones fail
+
+ localeDateStringNative: function (d) {
+ return d.toLocaleDateString();
+ },
+
+ localeTimeStringNative: function (d) {
+ return d.toLocaleTimeString();
+ },
+
+ xAxisTimeStringNative: function (d) {
+ return NETDATA.zeropad(d.getHours()) + ":"
+ + NETDATA.zeropad(d.getMinutes()) + ":"
+ + NETDATA.zeropad(d.getSeconds());
+ },
+
+ // initialize the new date/time conversion
+ // functions.
+ // if this fails, we fallback to the above
+ init: function (timezone) {
+ //console.log('init with timezone: ' + timezone);
+
+ // detect browser timezone
+ try {
+ NETDATA.options.browser_timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+ } catch (e) {
+ console.log('failed to detect browser timezone: ' + e.toString());
+ NETDATA.options.browser_timezone = 'cannot-detect-it';
+ }
+
+ let ret = false;
+
+ try {
+ let dateOptions = {
+ localeMatcher: 'best fit',
+ formatMatcher: 'best fit',
+ weekday: 'short',
+ year: 'numeric',
+ month: 'short',
+ day: '2-digit'
+ };
+
+ let timeOptions = {
+ localeMatcher: 'best fit',
+ hour12: false,
+ formatMatcher: 'best fit',
+ hour: '2-digit',
+ minute: '2-digit',
+ second: '2-digit'
+ };
+
+ let xAxisOptions = {
+ localeMatcher: 'best fit',
+ hour12: false,
+ formatMatcher: 'best fit',
+ hour: '2-digit',
+ minute: '2-digit',
+ second: '2-digit'
+ };
+
+ if (typeof timezone === 'string' && timezone !== '' && timezone !== 'default') {
+ dateOptions.timeZone = timezone;
+ timeOptions.timeZone = timezone;
+ timeOptions.timeZoneName = 'short';
+ xAxisOptions.timeZone = timezone;
+ this.using_timezone = true;
+ } else {
+ timezone = 'default';
+ this.using_timezone = false;
+ }
+
+ this.dateFormat = new Intl.DateTimeFormat(navigator.language, dateOptions);
+ this.timeFormat = new Intl.DateTimeFormat(navigator.language, timeOptions);
+ this.xAxisFormat = new Intl.DateTimeFormat(navigator.language, xAxisOptions);
+
+ this.localeDateString = function (d) {
+ return this.dateFormat.format(d);
+ };
+
+ this.localeTimeString = function (d) {
+ return this.timeFormat.format(d);
+ };
+
+ this.xAxisTimeString = function (d) {
+ return this.xAxisFormat.format(d);
+ };
+
+ //let d = new Date();
+ //let t = this.dateFormat.format(d) + ' ' + this.timeFormat.format(d) + ' ' + this.xAxisFormat.format(d);
+
+ ret = true;
+ } catch (e) {
+ console.log('Cannot setup Date/Time formatting: ' + e.toString());
+
+ timezone = 'default';
+ this.localeDateString = this.localeDateStringNative;
+ this.localeTimeString = this.localeTimeStringNative;
+ this.xAxisTimeString = this.xAxisTimeStringNative;
+ this.using_timezone = false;
+
+ ret = false;
+ }
+
+ // save it
+ //console.log('init setOption timezone: ' + timezone);
+ NETDATA.setOption('timezone', timezone);
+
+ return ret;
+ }
+};
+NETDATA.dateTime.init(NETDATA.options.current.timezone);
+
+// ----------------------------------------------------------------------------------------------------------------
+// global selection sync
+
+NETDATA.globalSelectionSync = {
+ state: null,
+ dontSyncBefore: 0,
+ last_t: 0,
+ slaves: [],
+ timeoutId: undefined,
+
+ globalReset: function () {
+ this.stop();
+ this.state = null;
+ this.dontSyncBefore = 0;
+ this.last_t = 0;
+ this.slaves = [];
+ this.timeoutId = undefined;
+ },
+
+ active: function () {
+ return (this.state !== null);
+ },
+
+ // return true if global selection sync can be enabled now
+ enabled: function () {
+ // console.log('enabled()');
+ // can we globally apply selection sync?
+ if (!NETDATA.options.current.sync_selection) {
+ return false;
+ }
+
+ return (this.dontSyncBefore <= Date.now());
+ },
+
+ // set the global selection sync master
+ setMaster: function (state) {
+ if (!this.enabled()) {
+ this.stop();
+ return;
+ }
+
+ if (this.state === state) {
+ return;
+ }
+
+ if (this.state !== null) {
+ this.stop();
+ }
+
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.setMaster(' + state.id + ')');
+ }
+
+ state.selected = true;
+ this.state = state;
+ this.last_t = 0;
+
+ // find all slaves
+ let targets = NETDATA.intersectionObserver.targets();
+ this.slaves = [];
+ let len = targets.length;
+ while (len--) {
+ let st = targets[len];
+ if (this.state !== st && st.globalSelectionSyncIsEligible()) {
+ this.slaves.push(st);
+ }
+ }
+
+ // this.delay(100);
+ },
+
+ // stop global selection sync
+ stop: function () {
+ if (this.state !== null) {
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.stop()');
+ }
+
+ let len = this.slaves.length;
+ while (len--) {
+ this.slaves[len].clearSelection();
+ }
+
+ this.state.clearSelection();
+
+ this.last_t = 0;
+ this.slaves = [];
+ this.state = null;
+ }
+ },
+
+ // delay global selection sync for some time
+ delay: function (ms) {
+ if (NETDATA.options.current.sync_selection) {
+ // if (NETDATA.options.debug.globalSelectionSync === true) {
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.delay()');
+ }
+
+ if (typeof ms === 'number') {
+ this.dontSyncBefore = Date.now() + ms;
+ } else {
+ this.dontSyncBefore = Date.now() + NETDATA.options.current.sync_selection_delay;
+ }
+ }
+ },
+
+ __syncSlaves: function () {
+ // if (NETDATA.globalSelectionSync.enabled() === true) {
+ if (NETDATA.globalSelectionSync.enabled()) {
+ // if (NETDATA.options.debug.globalSelectionSync === true)
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.__syncSlaves()');
+ }
+
+ let t = NETDATA.globalSelectionSync.last_t;
+ let len = NETDATA.globalSelectionSync.slaves.length;
+ while (len--) {
+ NETDATA.globalSelectionSync.slaves[len].setSelection(t);
+ }
+
+ this.timeoutId = undefined;
+ }
+ },
+
+ // sync all the visible charts to the given time
+ // this is to be called from the chart libraries
+ sync: function (state, t) {
+ // if (NETDATA.options.current.sync_selection === true) {
+ if (NETDATA.options.current.sync_selection) {
+ // if (NETDATA.options.debug.globalSelectionSync === true)
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.sync(' + state.id + ', ' + t.toString() + ')');
+ }
+
+ this.setMaster(state);
+
+ if (t === this.last_t) {
+ return;
+ }
+
+ this.last_t = t;
+
+ if (state.foreignElementSelection !== null) {
+ state.foreignElementSelection.innerText = NETDATA.dateTime.localeDateString(t) + ' ' + NETDATA.dateTime.localeTimeString(t);
+ }
+
+ if (this.timeoutId) {
+ NETDATA.timeout.clear(this.timeoutId);
+ }
+
+ this.timeoutId = NETDATA.timeout.set(this.__syncSlaves, 0);
+ }
+ }
+};
+
+NETDATA.intersectionObserver = {
+ observer: null,
+ visible_targets: [],
+
+ options: {
+ root: null,
+ rootMargin: "0px",
+ threshold: null
+ },
+
+ enabled: function () {
+ return this.observer !== null;
+ },
+
+ globalReset: function () {
+ if (this.observer !== null) {
+ this.visible_targets = [];
+ this.observer.disconnect();
+ this.init();
+ }
+ },
+
+ targets: function () {
+ if (this.enabled() && this.visible_targets.length > 0) {
+ return this.visible_targets;
+ } else {
+ return NETDATA.options.targets;
+ }
+ },
+
+ switchChartVisibility: function () {
+ let old = this.__visibilityRatioOld;
+
+ if (old !== this.__visibilityRatio) {
+ if (old === 0 && this.__visibilityRatio > 0) {
+ this.unhideChart();
+ } else if (old > 0 && this.__visibilityRatio === 0) {
+ this.hideChart();
+ }
+
+ this.__visibilityRatioOld = this.__visibilityRatio;
+ }
+ },
+
+ handler: function (entries, observer) {
+ entries.forEach(function (entry) {
+ let state = NETDATA.chartState(entry.target);
+
+ let idx;
+ if (entry.intersectionRatio > 0) {
+ idx = NETDATA.intersectionObserver.visible_targets.indexOf(state);
+ if (idx === -1) {
+ if (NETDATA.scrollUp) {
+ NETDATA.intersectionObserver.visible_targets.push(state);
+ } else {
+ NETDATA.intersectionObserver.visible_targets.unshift(state);
+ }
+ }
+ else if (state.__visibilityRatio === 0) {
+ state.log("was not visible until now, but was already in visible_targets");
+ }
+ } else {
+ idx = NETDATA.intersectionObserver.visible_targets.indexOf(state);
+ if (idx !== -1) {
+ NETDATA.intersectionObserver.visible_targets.splice(idx, 1);
+ } else if (state.__visibilityRatio > 0) {
+ state.log("was visible, but not found in visible_targets");
+ }
+ }
+
+ state.__visibilityRatio = entry.intersectionRatio;
+
+ if (!NETDATA.options.current.async_on_scroll) {
+ if (window.requestIdleCallback) {
+ window.requestIdleCallback(function () {
+ NETDATA.intersectionObserver.switchChartVisibility.call(state);
+ }, {timeout: 100});
+ } else {
+ NETDATA.intersectionObserver.switchChartVisibility.call(state);
+ }
+ }
+ });
+ },
+
+ observe: function (state) {
+ if (this.enabled()) {
+ state.__visibilityRatioOld = 0;
+ state.__visibilityRatio = 0;
+ this.observer.observe(state.element);
+
+ state.isVisible = function () {
+ if (!NETDATA.options.current.update_only_visible) {
+ return true;
+ }
+
+ NETDATA.intersectionObserver.switchChartVisibility.call(this);
+
+ return this.__visibilityRatio > 0;
+ }
+ }
+ },
+
+ init: function () {
+ if (typeof netdataIntersectionObserver === 'undefined' || netdataIntersectionObserver) {
+ try {
+ this.observer = new IntersectionObserver(this.handler, this.options);
+ } catch (e) {
+ console.log("IntersectionObserver is not supported on this browser");
+ this.observer = null;
+ }
+ }
+ //else {
+ // console.log("IntersectionObserver is disabled");
+ //}
+ }
+};
+NETDATA.intersectionObserver.init();
+
+// ----------------------------------------------------------------------------------------------------------------
+// Our state object, where all per-chart values are stored
+
+let chartState = function (element) {
+ this.element = element;
+
+ // IMPORTANT:
+ // all private functions should use 'that', instead of 'this'
+ // Alternatively, you can use arrow functions (related issue #4514)
+ let that = this;
+
+ // ============================================================================================================
+ // ERROR HANDLING
+
+ /* error() - private
+ * show an error instead of the chart
+ */
+ let error = (msg) => {
+ let ret = true;
+
+ if (typeof netdataErrorCallback === 'function') {
+ ret = netdataErrorCallback('chart', this.id, msg);
+ }
+
+ if (ret) {
+ this.element.innerHTML = this.id + ': ' + msg;
+ this.enabled = false;
+ this.current = this.pan;
+ }
+ };
+
+ // console logging
+ this.log = function (msg) {
+ console.log(this.id + ' (' + this.library_name + ' ' + this.uuid + '): ' + msg);
+ };
+
+ this.debugLog = function (msg) {
+ if (this.debug) {
+ this.log(msg);
+ }
+ };
+
+ // ============================================================================================================
+ // EARLY INITIALIZATION
+
+ // These are variables that should exist even if the chart is never to be rendered.
+ // Be careful what you add here - there may be thousands of charts on the page.
+
+ // GUID - a unique identifier for the chart
+ this.uuid = NETDATA.guid();
+
+ // string - the name of chart
+ this.id = NETDATA.dataAttribute(this.element, 'netdata', undefined);
+ if (typeof this.id === 'undefined') {
+ error("netdata elements need data-netdata");
+ return;
+ }
+
+ // string - the key for localStorage settings
+ this.settings_id = NETDATA.dataAttribute(this.element, 'id', null);
+
+ // the user given dimensions of the element
+ this.width = NETDATA.dataAttribute(this.element, 'width', NETDATA.chartDefaults.width);
+ this.height = NETDATA.dataAttribute(this.element, 'height', NETDATA.chartDefaults.height);
+ this.height_original = this.height;
+
+ if (this.settings_id !== null) {
+ this.height = NETDATA.localStorageGet('chart_heights.' + this.settings_id, this.height, function (height) {
+ // this is the callback that will be called
+ // if and when the user resets all localStorage variables
+ // to their defaults
+
+ resizeChartToHeight(height);
+ });
+ }
+
+ // the chart library requested by the user
+ this.library_name = NETDATA.dataAttribute(this.element, 'chart-library', NETDATA.chartDefaults.library);
+
+ // check the requested library is available
+ // we don't initialize it here - it will be initialized when
+ // this chart will be first used
+ if (typeof NETDATA.chartLibraries[this.library_name] === 'undefined') {
+ NETDATA.error(402, this.library_name);
+ error('chart library "' + this.library_name + '" is not found');
+ this.enabled = false;
+ } else if (!NETDATA.chartLibraries[this.library_name].enabled) {
+ NETDATA.error(403, this.library_name);
+ error('chart library "' + this.library_name + '" is not enabled');
+ this.enabled = false;
+ } else {
+ this.library = NETDATA.chartLibraries[this.library_name];
+ }
+
+ this.auto = {
+ name: 'auto',
+ autorefresh: true,
+ force_update_at: 0, // the timestamp to force the update at
+ force_before_ms: null,
+ force_after_ms: null
+ };
+ this.pan = {
+ name: 'pan',
+ autorefresh: false,
+ force_update_at: 0, // the timestamp to force the update at
+ force_before_ms: null,
+ force_after_ms: null
+ };
+ this.zoom = {
+ name: 'zoom',
+ autorefresh: false,
+ force_update_at: 0, // the timestamp to force the update at
+ force_before_ms: null,
+ force_after_ms: null
+ };
+
+ // this is a pointer to one of the sub-classes below
+ // auto, pan, zoom
+ this.current = this.auto;
+
+ this.running = false; // boolean - true when the chart is being refreshed now
+ this.enabled = true; // boolean - is the chart enabled for refresh?
+
+ this.force_update_every = null; // number - overwrite the visualization update frequency of the chart
+
+ this.tmp = {};
+
+ this.foreignElementBefore = null;
+ this.foreignElementAfter = null;
+ this.foreignElementDuration = null;
+ this.foreignElementUpdateEvery = null;
+ this.foreignElementSelection = null;
+
+ // ============================================================================================================
+ // PRIVATE FUNCTIONS
+
+ // reset the runtime status variables to their defaults
+ const runtimeInit = () => {
+ this.paused = false; // boolean - is the chart paused for any reason?
+ this.selected = false; // boolean - is the chart shown a selection?
+
+ this.chart_created = false; // boolean - is the library.create() been called?
+ this.dom_created = false; // boolean - is the chart DOM been created?
+ this.fetching_data = false; // boolean - true while we fetch data via ajax
+
+ this.updates_counter = 0; // numeric - the number of refreshes made so far
+ this.updates_since_last_unhide = 0; // numeric - the number of refreshes made since the last time the chart was unhidden
+ this.updates_since_last_creation = 0; // numeric - the number of refreshes made since the last time the chart was created
+
+ this.tm = {
+ last_initialized: 0, // milliseconds - the timestamp it was last initialized
+ last_dom_created: 0, // milliseconds - the timestamp its DOM was last created
+ last_mode_switch: 0, // milliseconds - the timestamp it switched modes
+
+ last_info_downloaded: 0, // milliseconds - the timestamp we downloaded the chart
+ last_updated: 0, // the timestamp the chart last updated with data
+ pan_and_zoom_seq: 0, // the sequence number of the global synchronization
+ // between chart.
+ // Used with NETDATA.globalPanAndZoom.seq
+ last_visible_check: 0, // the time we last checked if it is visible
+ last_resized: 0, // the time the chart was resized
+ last_hidden: 0, // the time the chart was hidden
+ last_unhidden: 0, // the time the chart was unhidden
+ last_autorefreshed: 0 // the time the chart was last refreshed
+ };
+
+ this.data = null; // the last data as downloaded from the netdata server
+ this.data_url = 'invalid://'; // string - the last url used to update the chart
+ this.data_points = 0; // number - the number of points returned from netdata
+ this.data_after = 0; // milliseconds - the first timestamp of the data
+ this.data_before = 0; // milliseconds - the last timestamp of the data
+ this.data_update_every = 0; // milliseconds - the frequency to update the data
+
+ this.tmp = {}; // members that can be destroyed to save memory
+ };
+
+ // initialize all the variables that are required for the chart to be rendered
+ const lateInitialization = () => {
+ if (typeof this.host !== 'undefined') {
+ return;
+ }
+
+ // string - the netdata server URL, without any path
+ this.host = NETDATA.dataAttribute(this.element, 'host', NETDATA.serverDefault);
+
+ // make sure the host does not end with /
+ // all netdata API requests use absolute paths
+ while (this.host.slice(-1) === '/') {
+ this.host = this.host.substring(0, this.host.length - 1);
+ }
+
+ // string - the grouping method requested by the user
+ this.method = NETDATA.dataAttribute(this.element, 'method', NETDATA.chartDefaults.method);
+ this.gtime = NETDATA.dataAttribute(this.element, 'gtime', 0);
+
+ // the time-range requested by the user
+ this.after = NETDATA.dataAttribute(this.element, 'after', NETDATA.chartDefaults.after);
+ this.before = NETDATA.dataAttribute(this.element, 'before', NETDATA.chartDefaults.before);
+
+ // the pixels per point requested by the user
+ this.pixels_per_point = NETDATA.dataAttribute(this.element, 'pixels-per-point', 1);
+ this.points = NETDATA.dataAttribute(this.element, 'points', null);
+
+ // the forced update_every
+ this.force_update_every = NETDATA.dataAttribute(this.element, 'update-every', null);
+ if (typeof this.force_update_every !== 'number' || this.force_update_every <= 1) {
+ if (this.force_update_every !== null) {
+ this.log('ignoring invalid value of property data-update-every');
+ }
+
+ this.force_update_every = null;
+ } else {
+ this.force_update_every *= 1000;
+ }
+
+ // the dimensions requested by the user
+ this.dimensions = NETDATA.encodeURIComponent(NETDATA.dataAttribute(this.element, 'dimensions', null));
+
+ this.title = NETDATA.dataAttribute(this.element, 'title', null); // the title of the chart
+ this.units = NETDATA.dataAttribute(this.element, 'units', null); // the units of the chart dimensions
+ this.units_desired = NETDATA.dataAttribute(this.element, 'desired-units', NETDATA.options.current.units); // the units of the chart dimensions
+ this.units_current = this.units;
+ this.units_common = NETDATA.dataAttribute(this.element, 'common-units', null);
+
+ // additional options to pass to netdata
+ this.append_options = NETDATA.encodeURIComponent(NETDATA.dataAttribute(this.element, 'append-options', null));
+
+ // override options to pass to netdata
+ this.override_options = NETDATA.encodeURIComponent(NETDATA.dataAttribute(this.element, 'override-options', null));
+
+ this.debug = NETDATA.dataAttributeBoolean(this.element, 'debug', false);
+
+ this.value_decimal_detail = -1;
+ let d = NETDATA.dataAttribute(this.element, 'decimal-digits', -1);
+ if (typeof d === 'number') {
+ this.value_decimal_detail = d;
+ } else if (typeof d !== 'undefined') {
+ this.log('ignoring decimal-digits value: ' + d.toString());
+ }
+
+ // if we need to report the rendering speed
+ // find the element that needs to be updated
+ let refresh_dt_element_name = NETDATA.dataAttribute(this.element, 'dt-element-name', null); // string - the element to print refresh_dt_ms
+
+ if (refresh_dt_element_name !== null) {
+ this.refresh_dt_element = document.getElementById(refresh_dt_element_name) || null;
+ }
+ else {
+ this.refresh_dt_element = null;
+ }
+
+ this.dimensions_visibility = new dimensionsVisibility(that);
+
+ this.netdata_first = 0; // milliseconds - the first timestamp in netdata
+ this.netdata_last = 0; // milliseconds - the last timestamp in netdata
+ this.requested_after = null; // milliseconds - the timestamp of the request after param
+ this.requested_before = null; // milliseconds - the timestamp of the request before param
+ this.requested_padding = null;
+ this.view_after = 0;
+ this.view_before = 0;
+
+ this.refresh_dt_ms = 0; // milliseconds - the time the last refresh took
+
+ // how many retries we have made to load chart data from the server
+ this.retries_on_data_failures = 0;
+
+ // color management
+ this.colors = null;
+ this.colors_assigned = null;
+ this.colors_available = null;
+ this.colors_custom = null;
+
+ this.element_message = null; // the element already created by the user
+ this.element_chart = null; // the element with the chart
+ this.element_legend = null; // the element with the legend of the chart (if created by us)
+ this.element_legend_childs = {
+ content: null,
+ hidden: null,
+ title_date: null,
+ title_time: null,
+ title_units: null,
+ perfect_scroller: null, // the container to apply perfect scroller to
+ series: null
+ };
+
+ this.chart_url = null; // string - the url to download chart info
+ this.chart = null; // object - the chart as downloaded from the server
+
+ const getForeignElementById = (opt) => {
+ let id = NETDATA.dataAttribute(this.element, opt, null);
+ if (id === null) {
+ //this.log('option "' + opt + '" is undefined');
+ return null;
+ }
+
+ let el = document.getElementById(id);
+ if (typeof el === 'undefined') {
+ this.log('cannot find an element with name "' + id.toString() + '"');
+ return null;
+ }
+
+ return el;
+ };
+
+ this.foreignElementBefore = getForeignElementById('show-before-at');
+ this.foreignElementAfter = getForeignElementById('show-after-at');
+ this.foreignElementDuration = getForeignElementById('show-duration-at');
+ this.foreignElementUpdateEvery = getForeignElementById('show-update-every-at');
+ this.foreignElementSelection = getForeignElementById('show-selection-at');
+ };
+
+ const destroyDOM = () => {
+ if (!this.enabled) {
+ return;
+ }
+
+ if (this.debug) {
+ this.log('destroyDOM()');
+ }
+
+ // this.element.className = 'netdata-message icon';
+ // this.element.innerHTML = '<i class="fas fa-sync"></i> netdata';
+ this.element.innerHTML = '';
+ this.element_message = null;
+ this.element_legend = null;
+ this.element_chart = null;
+ this.element_legend_childs.series = null;
+
+ this.chart_created = false;
+ this.dom_created = false;
+
+ this.tm.last_resized = 0;
+ 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;
+ }
+ lateInitialization();
+
+ destroyDOM();
+
+ if (this.debug) {
+ this.log('createDOM()');
+ }
+
+ this.element_message = document.createElement('div');
+ this.element_message.className = 'netdata-message icon hidden';
+ this.element.appendChild(this.element_message);
+
+ this.dom_created = true;
+ this.chart_created = false;
+
+ this.tm.last_dom_created = this.tm.last_resized = Date.now();
+
+ showLoading();
+ };
+
+ const initDOM = () => {
+ this.element.className = this.library.container_class(that);
+
+ if (typeof(this.width) === 'string') {
+ this.element.style.width = this.width;
+ } else if (typeof(this.width) === 'number') {
+ this.element.style.width = this.width.toString() + 'px';
+ }
+
+ if (typeof(this.library.aspect_ratio) === 'undefined') {
+ if (typeof(this.height) === 'string') {
+ this.element.style.height = this.height;
+ } else if (typeof(this.height) === 'number') {
+ this.element.style.height = this.height.toString() + 'px';
+ }
+ }
+
+ if (NETDATA.chartDefaults.min_width !== null) {
+ this.element.style.min_width = NETDATA.chartDefaults.min_width;
+ }
+ };
+
+ const invisibleSearchableText = () => {
+ return '<span style="position:absolute; opacity: 0; width: 0px;">' + this.id + '</span>';
+ };
+
+ /* init() private
+ * initialize state variables
+ * destroy all (possibly) created state elements
+ * create the basic DOM for a chart
+ */
+ const init = (opt) => {
+ if (!this.enabled) {
+ return;
+ }
+
+ runtimeInit();
+ this.element.innerHTML = invisibleSearchableText();
+
+ this.tm.last_initialized = Date.now();
+ this.setMode('auto');
+
+ if (opt !== 'fast') {
+ if (this.isVisible(true) || opt === 'force') {
+ createDOM();
+ }
+ }
+ };
+
+ const hideMessage = () => {
+ if (typeof this.tmp.___messageHidden___ === 'undefined') {
+ this.tmp.___messageHidden___ = true;
+ $(this.element_message).addClass('hidden');
+ }
+ };
+
+ const showRendering = () => {
+ let icon;
+ if (this.chart !== null) {
+ if (this.chart.chart_type === 'line') {
+ icon = NETDATA.icons.lineChart;
+ } else {
+ icon = NETDATA.icons.areaChart;
+ }
+ }
+ else {
+ icon = NETDATA.icons.noChart;
+ }
+
+ showMessageIcon(icon + ' netdata' + invisibleSearchableText());
+ };
+
+ const isHidden = () => {
+ return (typeof this.tmp.___chartIsHidden___ !== 'undefined');
+ };
+
+ // hide the chart, when it is not visible - called from isVisible()
+ this.hideChart = function () {
+ // hide it, if it is not already hidden
+ if (isHidden()) {
+ return;
+ }
+
+ if (this.chart_created) {
+ if (NETDATA.options.current.show_help) {
+ if (this.element_legend_childs.toolbox !== null) {
+ if (this.debug) {
+ this.log('hideChart(): hidding legend popovers');
+ }
+
+ $(this.element_legend_childs.toolbox_left).popover('hide');
+ $(this.element_legend_childs.toolbox_reset).popover('hide');
+ $(this.element_legend_childs.toolbox_right).popover('hide');
+ $(this.element_legend_childs.toolbox_zoomin).popover('hide');
+ $(this.element_legend_childs.toolbox_zoomout).popover('hide');
+ }
+
+ if (this.element_legend_childs.resize_handler !== null) {
+ $(this.element_legend_childs.resize_handler).popover('hide');
+ }
+
+ if (this.element_legend_childs.content !== null) {
+ $(this.element_legend_childs.content).popover('hide');
+ }
+ }
+
+ if (NETDATA.options.current.destroy_on_hide) {
+ if (this.debug) {
+ this.log('hideChart(): initializing chart');
+ }
+
+ // we should destroy it
+ init('force');
+ } else {
+ if (this.debug) {
+ this.log('hideChart(): hiding chart');
+ }
+
+ showRendering();
+ this.element_chart.style.display = 'none';
+ this.element.style.willChange = 'auto';
+ if (this.element_legend !== null) {
+ this.element_legend.style.display = 'none';
+ }
+ if (this.element_legend_childs.toolbox !== null) {
+ this.element_legend_childs.toolbox.style.display = 'none';
+ }
+ if (this.element_legend_childs.resize_handler !== null) {
+ this.element_legend_childs.resize_handler.style.display = 'none';
+ }
+
+ this.tm.last_hidden = Date.now();
+
+ // de-allocate data
+ // This works, but I not sure there are no corner cases somewhere
+ // so it is commented - if the user has memory issues he can
+ // set Destroy on Hide for all charts
+ // this.data = null;
+ }
+ }
+
+ this.tmp.___chartIsHidden___ = true;
+ };
+
+ // unhide the chart, when it is visible - called from isVisible()
+ this.unhideChart = function () {
+ if (!isHidden()) {
+ return;
+ }
+
+ this.tmp.___chartIsHidden___ = undefined;
+ this.updates_since_last_unhide = 0;
+
+ if (!this.chart_created) {
+ if (this.debug) {
+ this.log('unhideChart(): initializing chart');
+ }
+
+ // we need to re-initialize it, to show our background
+ // logo in bootstrap tabs, until the chart loads
+ init('force');
+ } else {
+ if (this.debug) {
+ this.log('unhideChart(): unhiding chart');
+ }
+
+ this.element.style.willChange = 'transform';
+ this.tm.last_unhidden = Date.now();
+ this.element_chart.style.display = '';
+ if (this.element_legend !== null) {
+ this.element_legend.style.display = '';
+ }
+ if (this.element_legend_childs.toolbox !== null) {
+ this.element_legend_childs.toolbox.style.display = '';
+ }
+ if (this.element_legend_childs.resize_handler !== null) {
+ this.element_legend_childs.resize_handler.style.display = '';
+ }
+ resizeChart();
+ hideMessage();
+ }
+
+ if (this.__redraw_on_unhide) {
+ if (this.debug) {
+ this.log("redrawing chart on unhide");
+ }
+
+ this.__redraw_on_unhide = undefined;
+ this.redrawChart();
+ }
+ };
+
+ const canBeRendered = (uncached_visibility) => {
+ if (this.debug) {
+ this.log('canBeRendered() called');
+ }
+
+ if (!NETDATA.options.current.update_only_visible) {
+ return true;
+ }
+
+ let ret = (
+ (
+ NETDATA.options.page_is_visible ||
+ NETDATA.options.current.stop_updates_when_focus_is_lost === false ||
+ this.updates_since_last_unhide === 0
+ )
+ && isHidden() === false && this.isVisible(uncached_visibility)
+ );
+
+ if (this.debug) {
+ this.log('canBeRendered(): ' + ret);
+ }
+
+ return ret;
+ };
+
+ // https://github.com/petkaantonov/bluebird/wiki/Optimization-killers
+ const callChartLibraryUpdateSafely = (data) => {
+ let status;
+
+ // we should not do this here
+ // if we prevent rendering the chart then:
+ // 1. globalSelectionSync will be wrong
+ // 2. globalPanAndZoom will be wrong
+ //if (canBeRendered(true) === false)
+ // return false;
+
+ if (NETDATA.options.fake_chart_rendering) {
+ return true;
+ }
+
+ this.updates_counter++;
+ this.updates_since_last_unhide++;
+ this.updates_since_last_creation++;
+
+ if (NETDATA.options.debug.chart_errors) {
+ status = this.library.update(that, data);
+ } else {
+ try {
+ status = this.library.update(that, data);
+ } catch (err) {
+ status = false;
+ }
+ }
+
+ if (!status) {
+ error('chart failed to be updated as ' + this.library_name);
+ return false;
+ }
+
+ return true;
+ };
+
+ // https://github.com/petkaantonov/bluebird/wiki/Optimization-killers
+ const callChartLibraryCreateSafely = (data) => {
+ let status;
+
+ // we should not do this here
+ // if we prevent rendering the chart then:
+ // 1. globalSelectionSync will be wrong
+ // 2. globalPanAndZoom will be wrong
+ //if (canBeRendered(true) === false)
+ // return false;
+
+ if (NETDATA.options.fake_chart_rendering) {
+ return true;
+ }
+
+ this.updates_counter++;
+ this.updates_since_last_unhide++;
+ this.updates_since_last_creation++;
+
+ if (NETDATA.options.debug.chart_errors) {
+ status = this.library.create(that, data);
+ } else {
+ try {
+ status = this.library.create(that, data);
+ } catch (err) {
+ status = false;
+ }
+ }
+
+ if (!status) {
+ error('chart failed to be created as ' + this.library_name);
+ return false;
+ }
+
+ this.chart_created = true;
+ this.updates_since_last_creation = 0;
+ return true;
+ };
+
+ // ----------------------------------------------------------------------------------------------------------------
+ // Chart Resize
+
+ // resizeChart() - private
+ // to be called just before the chart library to make sure that
+ // a properly sized dom is available
+ const resizeChart = () => {
+ if (this.tm.last_resized < NETDATA.options.last_page_resize) {
+ if (!this.chart_created) {
+ return;
+ }
+
+ if (this.needsRecreation()) {
+ if (this.debug) {
+ this.log('resizeChart(): initializing chart');
+ }
+
+ init('force');
+ } else if (typeof this.library.resize === 'function') {
+ if (this.debug) {
+ this.log('resizeChart(): resizing chart');
+ }
+
+ this.library.resize(that);
+
+ if (this.element_legend_childs.perfect_scroller !== null) {
+ Ps.update(this.element_legend_childs.perfect_scroller);
+ }
+
+ maxMessageFontSize();
+ }
+
+ this.tm.last_resized = Date.now();
+ }
+ };
+
+ // this is the actual chart resize algorithm
+ // it will:
+ // - resize the entire container
+ // - update the internal states
+ // - resize the chart as the div changes height
+ // - update the scrollbar of the legend
+ const resizeChartToHeight = (h) => {
+ // console.log(h);
+ this.element.style.height = h;
+
+ if (this.settings_id !== null) {
+ NETDATA.localStorageSet('chart_heights.' + this.settings_id, h);
+ }
+
+ let now = Date.now();
+ NETDATA.options.last_page_scroll = now;
+ NETDATA.options.auto_refresher_stop_until = now + NETDATA.options.current.stop_updates_while_resizing;
+
+ // force a resize
+ this.tm.last_resized = 0;
+ resizeChart();
+ };
+
+ this.resizeForPrint = function () {
+ if (typeof this.element_legend_childs !== 'undefined' && this.element_legend_childs.perfect_scroller !== null) {
+ let current = this.element.clientHeight;
+ let optimal = current
+ + this.element_legend_childs.perfect_scroller.scrollHeight
+ - this.element_legend_childs.perfect_scroller.clientHeight;
+
+ if (optimal > current) {
+ // this.log('resized');
+ this.element.style.height = optimal + 'px';
+ this.library.resize(this);
+ }
+ }
+ };
+
+ this.resizeHandler = function (e) {
+ e.preventDefault();
+
+ if (typeof this.event_resize === 'undefined'
+ || this.event_resize.chart_original_w === 'undefined'
+ || this.event_resize.chart_original_h === 'undefined') {
+ this.event_resize = {
+ chart_original_w: this.element.clientWidth,
+ chart_original_h: this.element.clientHeight,
+ last: 0
+ };
+ }
+
+ if (e.type === 'touchstart') {
+ this.event_resize.mouse_start_x = e.touches.item(0).pageX;
+ this.event_resize.mouse_start_y = e.touches.item(0).pageY;
+ } else {
+ this.event_resize.mouse_start_x = e.clientX;
+ this.event_resize.mouse_start_y = e.clientY;
+ }
+
+ this.event_resize.chart_start_w = this.element.clientWidth;
+ this.event_resize.chart_start_h = this.element.clientHeight;
+ this.event_resize.chart_last_w = this.element.clientWidth;
+ this.event_resize.chart_last_h = this.element.clientHeight;
+
+ let now = Date.now();
+ if (now - this.event_resize.last <= NETDATA.options.current.double_click_speed && this.element_legend_childs.perfect_scroller !== null) {
+ // double click / double tap event
+
+ // console.dir(this.element_legend_childs.content);
+ // console.dir(this.element_legend_childs.perfect_scroller);
+
+ // the optimal height of the chart
+ // showing the entire legend
+ let optimal = this.event_resize.chart_last_h
+ + this.element_legend_childs.perfect_scroller.scrollHeight
+ - this.element_legend_childs.perfect_scroller.clientHeight;
+
+ // if we are not optimal, be optimal
+ if (this.event_resize.chart_last_h !== optimal) {
+ // this.log('resize to optimal, current = ' + this.event_resize.chart_last_h.toString() + 'px, original = ' + this.event_resize.chart_original_h.toString() + 'px, optimal = ' + optimal.toString() + 'px, internal = ' + this.height_original.toString());
+ resizeChartToHeight(optimal.toString() + 'px');
+ }
+
+ // else if the current height is not the original/saved height
+ // reset to the original/saved height
+ else if (this.event_resize.chart_last_h !== this.event_resize.chart_original_h) {
+ // this.log('resize to original, current = ' + this.event_resize.chart_last_h.toString() + 'px, original = ' + this.event_resize.chart_original_h.toString() + 'px, optimal = ' + optimal.toString() + 'px, internal = ' + this.height_original.toString());
+ resizeChartToHeight(this.event_resize.chart_original_h.toString() + 'px');
+ }
+
+ // else if the current height is not the internal default height
+ // reset to the internal default height
+ else if ((this.event_resize.chart_last_h.toString() + 'px') !== this.height_original) {
+ // this.log('resize to internal default, current = ' + this.event_resize.chart_last_h.toString() + 'px, original = ' + this.event_resize.chart_original_h.toString() + 'px, optimal = ' + optimal.toString() + 'px, internal = ' + this.height_original.toString());
+ resizeChartToHeight(this.height_original.toString());
+ }
+
+ // else if the current height is not the firstchild's clientheight
+ // resize to it
+ else if (typeof this.element_legend_childs.perfect_scroller.firstChild !== 'undefined') {
+ let parent_rect = this.element.getBoundingClientRect();
+ let content_rect = this.element_legend_childs.perfect_scroller.firstElementChild.getBoundingClientRect();
+ let wanted = content_rect.top - parent_rect.top + this.element_legend_childs.perfect_scroller.firstChild.clientHeight + 18; // 15 = toolbox + 3 space
+
+ // console.log(parent_rect);
+ // console.log(content_rect);
+ // console.log(wanted);
+
+ // this.log('resize to firstChild, current = ' + this.event_resize.chart_last_h.toString() + 'px, original = ' + this.event_resize.chart_original_h.toString() + 'px, optimal = ' + optimal.toString() + 'px, internal = ' + this.height_original.toString() + 'px, firstChild = ' + wanted.toString() + 'px' );
+ if (this.event_resize.chart_last_h !== wanted) {
+ resizeChartToHeight(wanted.toString() + 'px');
+ }
+ }
+ } else {
+ this.event_resize.last = now;
+
+ // process movement event
+ document.onmousemove =
+ document.ontouchmove =
+ this.element_legend_childs.resize_handler.onmousemove =
+ this.element_legend_childs.resize_handler.ontouchmove =
+ function (e) {
+ let y = null;
+
+ switch (e.type) {
+ case 'mousemove':
+ y = e.clientY;
+ break;
+ case 'touchmove':
+ y = e.touches.item(e.touches - 1).pageY;
+ break;
+ }
+
+ if (y !== null) {
+ let newH = that.event_resize.chart_start_h + y - that.event_resize.mouse_start_y;
+
+ if (newH >= 70 && newH !== that.event_resize.chart_last_h) {
+ resizeChartToHeight(newH.toString() + 'px');
+ that.event_resize.chart_last_h = newH;
+ }
+ }
+ };
+
+ // process end event
+ document.onmouseup =
+ document.ontouchend =
+ this.element_legend_childs.resize_handler.onmouseup =
+ this.element_legend_childs.resize_handler.ontouchend =
+ function (e) {
+ void(e);
+
+ // remove all the hooks
+ document.onmouseup =
+ document.onmousemove =
+ document.ontouchmove =
+ document.ontouchend =
+ that.element_legend_childs.resize_handler.onmousemove =
+ that.element_legend_childs.resize_handler.ontouchmove =
+ that.element_legend_childs.resize_handler.onmouseout =
+ that.element_legend_childs.resize_handler.onmouseup =
+ that.element_legend_childs.resize_handler.ontouchend =
+ null;
+
+ // allow auto-refreshes
+ NETDATA.options.auto_refresher_stop_until = 0;
+ };
+ }
+ };
+
+ const noDataToShow = () => {
+ showMessageIcon(NETDATA.icons.noData + ' empty');
+ this.legendUpdateDOM();
+ this.tm.last_autorefreshed = Date.now();
+ // this.data_update_every = 30 * 1000;
+ //this.element_chart.style.display = 'none';
+ //if (this.element_legend !== null) this.element_legend.style.display = 'none';
+ //this.tmp.___chartIsHidden___ = true;
+ };
+
+ // ============================================================================================================
+ // PUBLIC FUNCTIONS
+
+ this.error = function (msg) {
+ error(msg);
+ };
+
+ this.setMode = function (m) {
+ if (this.current !== null && this.current.name === m) {
+ return;
+ }
+
+ if (m === 'auto') {
+ this.current = this.auto;
+ } else if (m === 'pan') {
+ this.current = this.pan;
+ } else if (m === 'zoom') {
+ this.current = this.zoom;
+ } else {
+ this.current = this.auto;
+ }
+
+ this.current.force_update_at = 0;
+ this.current.force_before_ms = null;
+ this.current.force_after_ms = null;
+
+ this.tm.last_mode_switch = Date.now();
+ };
+
+ // ----------------------------------------------------------------------------------------------------------------
+ // global selection sync for slaves
+
+ // can the chart participate to the global selection sync as a slave?
+ this.globalSelectionSyncIsEligible = function () {
+ return (
+ this.enabled &&
+ this.library !== null &&
+ typeof this.library.setSelection === 'function' &&
+ this.isVisible() &&
+ this.chart_created
+ );
+ };
+
+ this.setSelection = function (t) {
+ if (typeof this.library.setSelection === 'function') {
+ // this.selected = this.library.setSelection(this, t) === true;
+ this.selected = this.library.setSelection(this, t);
+ } else {
+ this.selected = true;
+ }
+
+ if (this.selected && this.debug) {
+ this.log('selection set to ' + t.toString());
+ }
+
+ if (this.foreignElementSelection !== null) {
+ this.foreignElementSelection.innerText = NETDATA.dateTime.localeDateString(t) + ' ' + NETDATA.dateTime.localeTimeString(t);
+ }
+
+ return this.selected;
+ };
+
+ this.clearSelection = function () {
+ if (this.selected) {
+ if (typeof this.library.clearSelection === 'function') {
+ this.selected = (this.library.clearSelection(this) !== true);
+ } else {
+ this.selected = false;
+ }
+
+ if (this.selected === false && this.debug) {
+ this.log('selection cleared');
+ }
+
+ if (this.foreignElementSelection !== null) {
+ this.foreignElementSelection.innerText = '';
+ }
+
+ this.legendReset();
+ }
+
+ return this.selected;
+ };
+
+ // ----------------------------------------------------------------------------------------------------------------
+
+ // find if a timestamp (ms) is shown in the current chart
+ this.timeIsVisible = function (t) {
+ return (t >= this.data_after && t <= this.data_before);
+ };
+
+ this.calculateRowForTime = function (t) {
+ if (!this.timeIsVisible(t)) {
+ return -1;
+ }
+ return Math.floor((t - this.data_after) / this.data_update_every);
+ };
+
+ // ----------------------------------------------------------------------------------------------------------------
+
+ this.pauseChart = function () {
+ if (!this.paused) {
+ if (this.debug) {
+ this.log('pauseChart()');
+ }
+
+ this.paused = true;
+ }
+ };
+
+ this.unpauseChart = function () {
+ if (this.paused) {
+ if (this.debug) {
+ this.log('unpauseChart()');
+ }
+
+ this.paused = false;
+ }
+ };
+
+ this.resetChart = function (dontClearMaster, dontUpdate) {
+ if (this.debug) {
+ this.log('resetChart(' + dontClearMaster + ', ' + dontUpdate + ') called');
+ }
+
+ if (typeof dontClearMaster === 'undefined') {
+ dontClearMaster = false;
+ }
+
+ if (typeof dontUpdate === 'undefined') {
+ dontUpdate = false;
+ }
+
+ if (dontClearMaster !== true && NETDATA.globalPanAndZoom.isMaster(this)) {
+ if (this.debug) {
+ this.log('resetChart() diverting to clearMaster().');
+ }
+ // this will call us back with master === true
+ NETDATA.globalPanAndZoom.clearMaster();
+ return;
+ }
+
+ this.clearSelection();
+
+ this.tm.pan_and_zoom_seq = 0;
+
+ this.setMode('auto');
+ this.current.force_update_at = 0;
+ this.current.force_before_ms = null;
+ this.current.force_after_ms = null;
+ this.tm.last_autorefreshed = 0;
+ this.paused = false;
+ this.selected = false;
+ this.enabled = true;
+ // this.debug = false;
+
+ // do not update the chart here
+ // or the chart will flip-flop when it is the master
+ // of a selection sync and another chart becomes
+ // the new master
+
+ if (dontUpdate !== true && this.isVisible()) {
+ this.updateChart();
+ }
+ };
+
+ this.updateChartPanOrZoom = function (after, before, callback) {
+ let logme = 'updateChartPanOrZoom(' + after + ', ' + before + '): ';
+ let ret = true;
+
+ NETDATA.globalPanAndZoom.delay();
+ NETDATA.globalSelectionSync.delay();
+
+ if (this.debug) {
+ this.log(logme);
+ }
+
+ if (before < after) {
+ if (this.debug) {
+ this.log(logme + 'flipped parameters, rejecting it.');
+ }
+ return false;
+ }
+
+ if (typeof this.fixed_min_duration === 'undefined') {
+ this.fixed_min_duration = Math.round((this.chartWidth() / 30) * this.chart.update_every * 1000);
+ }
+
+ let min_duration = this.fixed_min_duration;
+ let current_duration = Math.round(this.view_before - this.view_after);
+
+ // round the numbers
+ after = Math.round(after);
+ before = Math.round(before);
+
+ // align them to update_every
+ // stretching them further away
+ after -= after % this.data_update_every;
+ before += this.data_update_every - (before % this.data_update_every);
+
+ // the final wanted duration
+ let wanted_duration = before - after;
+
+ // to allow panning, accept just a point below our minimum
+ if ((current_duration - this.data_update_every) < min_duration) {
+ min_duration = current_duration - this.data_update_every;
+ }
+
+ // we do it, but we adjust to minimum size and return false
+ // when the wanted size is below the current and the minimum
+ // and we zoom
+ if (wanted_duration < current_duration && wanted_duration < min_duration) {
+ if (this.debug) {
+ this.log(logme + 'too small: min_duration: ' + (min_duration / 1000).toString() + ', wanted: ' + (wanted_duration / 1000).toString());
+ }
+
+ min_duration = this.fixed_min_duration;
+
+ let dt = (min_duration - wanted_duration) / 2;
+ before += dt;
+ after -= dt;
+ wanted_duration = before - after;
+ ret = false;
+ }
+
+ let tolerance = this.data_update_every * 2;
+ let movement = Math.abs(before - this.view_before);
+
+ if (Math.abs(current_duration - wanted_duration) <= tolerance && movement <= tolerance && ret) {
+ if (this.debug) {
+ this.log(logme + 'REJECTING UPDATE: current/min duration: ' + (current_duration / 1000).toString() + '/' + (this.fixed_min_duration / 1000).toString() + ', wanted duration: ' + (wanted_duration / 1000).toString() + ', duration diff: ' + (Math.round(Math.abs(current_duration - wanted_duration) / 1000)).toString() + ', movement: ' + (movement / 1000).toString() + ', tolerance: ' + (tolerance / 1000).toString() + ', returning: ' + false);
+ }
+ return false;
+ }
+
+ if (this.current.name === 'auto') {
+ this.log(logme + 'caller called me with mode: ' + this.current.name);
+ this.setMode('pan');
+ }
+
+ if (this.debug) {
+ this.log(logme + 'ACCEPTING UPDATE: current/min duration: ' + (current_duration / 1000).toString() + '/' + (this.fixed_min_duration / 1000).toString() + ', wanted duration: ' + (wanted_duration / 1000).toString() + ', duration diff: ' + (Math.round(Math.abs(current_duration - wanted_duration) / 1000)).toString() + ', movement: ' + (movement / 1000).toString() + ', tolerance: ' + (tolerance / 1000).toString() + ', returning: ' + ret);
+ }
+
+ this.current.force_update_at = Date.now() + NETDATA.options.current.pan_and_zoom_delay;
+ this.current.force_after_ms = after;
+ this.current.force_before_ms = before;
+ NETDATA.globalPanAndZoom.setMaster(this, after, before);
+
+ if (ret && typeof callback === 'function') {
+ callback();
+ }
+
+ return ret;
+ };
+
+ this.updateChartPanOrZoomAsyncTimeOutId = undefined;
+ this.updateChartPanOrZoomAsync = function (after, before, callback) {
+ NETDATA.globalPanAndZoom.delay();
+ NETDATA.globalSelectionSync.delay();
+
+ if (!NETDATA.globalPanAndZoom.isMaster(this)) {
+ this.pauseChart();
+ NETDATA.globalPanAndZoom.setMaster(this, after, before);
+ // NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.setMaster(this);
+ }
+
+ if (this.updateChartPanOrZoomAsyncTimeOutId) {
+ NETDATA.timeout.clear(this.updateChartPanOrZoomAsyncTimeOutId);
+ }
+
+ NETDATA.timeout.set(function () {
+ that.updateChartPanOrZoomAsyncTimeOutId = undefined;
+ that.updateChartPanOrZoom(after, before, callback);
+ }, 0);
+ };
+
+ let _unitsConversionLastUnits = undefined;
+ let _unitsConversionLastUnitsDesired = undefined;
+ let _unitsConversionLastMin = undefined;
+ let _unitsConversionLastMax = undefined;
+ let _unitsConversion = function (value) {
+ return value;
+ };
+ this.unitsConversionSetup = function (min, max) {
+ if (this.units !== _unitsConversionLastUnits
+ || this.units_desired !== _unitsConversionLastUnitsDesired
+ || min !== _unitsConversionLastMin
+ || max !== _unitsConversionLastMax) {
+
+ _unitsConversionLastUnits = this.units;
+ _unitsConversionLastUnitsDesired = this.units_desired;
+ _unitsConversionLastMin = min;
+ _unitsConversionLastMax = max;
+
+ _unitsConversion = NETDATA.unitsConversion.get(this.uuid, min, max, this.units, this.units_desired, this.units_common, function (units) {
+ // console.log('switching units from ' + that.units.toString() + ' to ' + units.toString());
+ that.units_current = units;
+ that.legendSetUnitsString(that.units_current);
+ });
+ }
+ };
+
+ let _legendFormatValueChartDecimalsLastMin = undefined;
+ let _legendFormatValueChartDecimalsLastMax = undefined;
+ let _legendFormatValueChartDecimals = -1;
+ let _intlNumberFormat = null;
+ this.legendFormatValueDecimalsFromMinMax = function (min, max) {
+ if (min === _legendFormatValueChartDecimalsLastMin && max === _legendFormatValueChartDecimalsLastMax) {
+ return;
+ }
+
+ this.unitsConversionSetup(min, max);
+ if (_unitsConversion !== null) {
+ min = _unitsConversion(min);
+ max = _unitsConversion(max);
+
+ if (typeof min !== 'number' || typeof max !== 'number') {
+ return;
+ }
+ }
+
+ _legendFormatValueChartDecimalsLastMin = min;
+ _legendFormatValueChartDecimalsLastMax = max;
+
+ let old = _legendFormatValueChartDecimals;
+
+ if (this.data !== null && this.data.min === this.data.max)
+ // it is a fixed number, let the visualizer decide based on the value
+ {
+ _legendFormatValueChartDecimals = -1;
+ } else if (this.value_decimal_detail !== -1)
+ // there is an override
+ {
+ _legendFormatValueChartDecimals = this.value_decimal_detail;
+ } else {
+ // ok, let's calculate the proper number of decimal points
+ let delta;
+
+ if (min === max) {
+ delta = Math.abs(min);
+ } else {
+ delta = Math.abs(max - min);
+ }
+
+ if (delta > 1000) {
+ _legendFormatValueChartDecimals = 0;
+ } else if (delta > 10) {
+ _legendFormatValueChartDecimals = 1;
+ } else if (delta > 1) {
+ _legendFormatValueChartDecimals = 2;
+ } else if (delta > 0.1) {
+ _legendFormatValueChartDecimals = 2;
+ } else if (delta > 0.01) {
+ _legendFormatValueChartDecimals = 4;
+ } else if (delta > 0.001) {
+ _legendFormatValueChartDecimals = 5;
+ } else if (delta > 0.0001) {
+ _legendFormatValueChartDecimals = 6;
+ } else {
+ _legendFormatValueChartDecimals = 7;
+ }
+ }
+
+ if (_legendFormatValueChartDecimals !== old) {
+ if (_legendFormatValueChartDecimals < 0) {
+ _intlNumberFormat = null;
+ } else {
+ _intlNumberFormat = NETDATA.fastNumberFormat.get(
+ _legendFormatValueChartDecimals,
+ _legendFormatValueChartDecimals
+ );
+ }
+ }
+ };
+
+ this.legendFormatValue = function (value) {
+ if (typeof value !== 'number') {
+ return '-';
+ }
+
+ value = _unitsConversion(value);
+
+ if (typeof value !== 'number') {
+ return value;
+ }
+
+ if (_intlNumberFormat !== null) {
+ return _intlNumberFormat.format(value);
+ }
+
+ let dmin, dmax;
+ if (this.value_decimal_detail !== -1) {
+ dmin = dmax = this.value_decimal_detail;
+ } else {
+ dmin = 0;
+ let abs = (value < 0) ? -value : value;
+ if (abs > 1000) {
+ dmax = 0;
+ } else if (abs > 10) {
+ dmax = 1;
+ } else if (abs > 1) {
+ dmax = 2;
+ } else if (abs > 0.1) {
+ dmax = 2;
+ } else if (abs > 0.01) {
+ dmax = 4;
+ } else if (abs > 0.001) {
+ dmax = 5;
+ } else if (abs > 0.0001) {
+ dmax = 6;
+ } else {
+ dmax = 7;
+ }
+ }
+
+ return NETDATA.fastNumberFormat.get(dmin, dmax).format(value);
+ };
+
+ this.legendSetLabelValue = function (label, value) {
+ let series = this.element_legend_childs.series[label];
+ if (typeof series === 'undefined') {
+ return;
+ }
+ if (series.value === null && series.user === null) {
+ return;
+ }
+
+ /*
+ // this slows down firefox and edge significantly
+ // since it requires to use innerHTML(), instead of innerText()
+
+ // if the value has not changed, skip DOM update
+ //if (series.last === value) return;
+
+ let s, r;
+ if (typeof value === 'number') {
+ let v = Math.abs(value);
+ s = r = this.legendFormatValue(value);
+
+ if (typeof series.last === 'number') {
+ if (v > series.last) s += '<i class="fas fa-angle-up" style="width: 8px; text-align: center; overflow: hidden; vertical-align: middle;"></i>';
+ else if (v < series.last) s += '<i class="fas fa-angle-down" style="width: 8px; text-align: center; overflow: hidden; vertical-align: middle;"></i>';
+ else s += '<i class="fas fa-angle-left" style="width: 8px; text-align: center; overflow: hidden; vertical-align: middle;"></i>';
+ }
+ else s += '<i class="fas fa-angle-right" style="width: 8px; text-align: center; overflow: hidden; vertical-align: middle;"></i>';
+
+ series.last = v;
+ }
+ else {
+ if (value === null)
+ s = r = '';
+ else
+ s = r = value;
+
+ series.last = value;
+ }
+ */
+
+ let s = this.legendFormatValue(value);
+
+ // caching: do not update the update to show the same value again
+ if (s === series.last_shown_value) {
+ return;
+ }
+ series.last_shown_value = s;
+
+ if (series.value !== null) {
+ series.value.innerText = s;
+ }
+ if (series.user !== null) {
+ series.user.innerText = s;
+ }
+ };
+
+ this.legendSetDateString = function (date) {
+ if (this.element_legend_childs.title_date !== null && date !== this.tmp.__last_shown_legend_date) {
+ this.element_legend_childs.title_date.innerText = date;
+ this.tmp.__last_shown_legend_date = date;
+ }
+ };
+
+ this.legendSetTimeString = function (time) {
+ if (this.element_legend_childs.title_time !== null && time !== this.tmp.__last_shown_legend_time) {
+ this.element_legend_childs.title_time.innerText = time;
+ this.tmp.__last_shown_legend_time = time;
+ }
+ };
+
+ this.legendSetUnitsString = function (units) {
+ if (this.element_legend_childs.title_units !== null && units !== this.tmp.__last_shown_legend_units) {
+ this.element_legend_childs.title_units.innerText = units;
+ this.tmp.__last_shown_legend_units = units;
+ }
+ };
+
+ this.legendSetDateLast = {
+ ms: 0,
+ date: undefined,
+ time: undefined
+ };
+
+ this.legendSetDate = function (ms) {
+ if (typeof ms !== 'number') {
+ this.legendShowUndefined();
+ return;
+ }
+
+ if (this.legendSetDateLast.ms !== ms) {
+ let d = new Date(ms);
+ this.legendSetDateLast.ms = ms;
+ this.legendSetDateLast.date = NETDATA.dateTime.localeDateString(d);
+ this.legendSetDateLast.time = NETDATA.dateTime.localeTimeString(d);
+ }
+
+ this.legendSetDateString(this.legendSetDateLast.date);
+ this.legendSetTimeString(this.legendSetDateLast.time);
+ this.legendSetUnitsString(this.units_current)
+ };
+
+ this.legendShowUndefined = function () {
+ this.legendSetDateString(this.legendPluginModuleString(false));
+ this.legendSetTimeString(this.chart.context.toString());
+ // this.legendSetUnitsString(' ');
+
+ if (this.data && this.element_legend_childs.series !== null) {
+ let labels = this.data.dimension_names;
+ let i = labels.length;
+ while (i--) {
+ let label = labels[i];
+
+ if (typeof label === 'undefined' || typeof this.element_legend_childs.series[label] === 'undefined') {
+ continue;
+ }
+ this.legendSetLabelValue(label, null);
+ }
+ }
+ };
+
+ this.legendShowLatestValues = function () {
+ if (this.chart === null) {
+ return;
+ }
+ if (this.selected) {
+ return;
+ }
+
+ if (this.data === null || this.element_legend_childs.series === null) {
+ this.legendShowUndefined();
+ return;
+ }
+
+ let show_undefined = true;
+ if (Math.abs(this.netdata_last - this.view_before) <= this.data_update_every) {
+ show_undefined = false;
+ }
+
+ if (show_undefined) {
+ this.legendShowUndefined();
+ return;
+ }
+
+ this.legendSetDate(this.view_before);
+
+ let labels = this.data.dimension_names;
+ let i = labels.length;
+ while (i--) {
+ let label = labels[i];
+
+ if (typeof label === 'undefined') {
+ continue;
+ }
+ if (typeof this.element_legend_childs.series[label] === 'undefined') {
+ continue;
+ }
+
+ this.legendSetLabelValue(label, this.data.view_latest_values[i]);
+ }
+ };
+
+ this.legendReset = function () {
+ this.legendShowLatestValues();
+ };
+
+ // this should be called just ONCE per dimension per chart
+ this.__chartDimensionColor = function (label) {
+ let c = NETDATA.commonColors.get(this, label);
+
+ // it is important to maintain a list of colors
+ // for this chart only, since the chart library
+ // uses this to assign colors to dimensions in the same
+ // order the dimension are given to it
+ this.colors.push(c);
+
+ return c;
+ };
+
+ this.chartPrepareColorPalette = function () {
+ NETDATA.commonColors.refill(this);
+ };
+
+ // get the ordered list of chart colors
+ // this includes user defined colors
+ this.chartCustomColors = function () {
+ this.chartPrepareColorPalette();
+
+ let colors;
+ if (this.colors_custom.length) {
+ colors = this.colors_custom;
+ } else {
+ colors = this.colors;
+ }
+
+ if (this.debug) {
+ this.log("chartCustomColors() returns:");
+ this.log(colors);
+ }
+
+ return colors;
+ };
+
+ // get the ordered list of chart ASSIGNED colors
+ // (this returns only the colors that have been
+ // assigned to dimensions, prepended with any
+ // custom colors defined)
+ this.chartColors = function () {
+ this.chartPrepareColorPalette();
+
+ if (this.debug) {
+ this.log("chartColors() returns:");
+ this.log(this.colors);
+ }
+
+ return this.colors;
+ };
+
+ this.legendPluginModuleString = function (withContext) {
+ let str = ' ';
+ let context = '';
+
+ if (typeof this.chart !== 'undefined') {
+ if (withContext && typeof this.chart.context === 'string') {
+ context = this.chart.context;
+ }
+
+ if (typeof this.chart.plugin === 'string' && this.chart.plugin !== '') {
+ str = this.chart.plugin;
+
+ if (str.endsWith(".plugin")) {
+ str = str.substring(0, str.length - 7);
+ }
+
+ if (typeof this.chart.module === 'string' && this.chart.module !== '') {
+ str += ':' + this.chart.module;
+ }
+
+ if (withContext && context !== '') {
+ str += ', ' + context;
+ }
+ }
+ else if (withContext && context !== '') {
+ str = context;
+ }
+ }
+
+ return str;
+ };
+
+ this.legendResolutionTooltip = function () {
+ if (!this.chart) {
+ return '';
+ }
+
+ let collected = this.chart.update_every;
+ let viewed = (this.data) ? this.data.view_update_every : collected;
+
+ if (collected === viewed) {
+ return "resolution " + NETDATA.seconds4human(collected);
+ }
+
+ return "resolution " + NETDATA.seconds4human(viewed) + ", collected every " + NETDATA.seconds4human(collected);
+ };
+
+ this.legendUpdateDOM = function () {
+ let needed = false, dim, keys, len;
+
+ // check that the legend DOM is up to date for the downloaded dimensions
+ if (typeof this.element_legend_childs.series !== 'object' || this.element_legend_childs.series === null) {
+ // this.log('the legend does not have any series - requesting legend update');
+ needed = true;
+ } else if (this.data === null) {
+ // this.log('the chart does not have any data - requesting legend update');
+ needed = true;
+ } else if (typeof this.element_legend_childs.series.labels_key === 'undefined') {
+ needed = true;
+ } else {
+ let labels = this.data.dimension_names.toString();
+ if (labels !== this.element_legend_childs.series.labels_key) {
+ needed = true;
+
+ if (this.debug) {
+ this.log('NEW LABELS: "' + labels + '" NOT EQUAL OLD LABELS: "' + this.element_legend_childs.series.labels_key + '"');
+ }
+ }
+ }
+
+ if (!needed) {
+ // make sure colors available
+ this.chartPrepareColorPalette();
+
+ // do we have to update the current values?
+ // we do this, only when the visible chart is current
+ if (Math.abs(this.netdata_last - this.view_before) <= this.data_update_every) {
+ if (this.debug) {
+ this.log('chart is in latest position... updating values on legend...');
+ }
+
+ //let labels = this.data.dimension_names;
+ //let i = labels.length;
+ //while (i--)
+ // this.legendSetLabelValue(labels[i], this.data.view_latest_values[i]);
+ }
+ return;
+ }
+
+ if (this.colors === null) {
+ // this is the first time we update the chart
+ // let's assign colors to all dimensions
+ if (this.library.track_colors()) {
+ this.colors = [];
+ keys = Object.keys(this.chart.dimensions);
+ len = keys.length;
+ for (let i = 0; i < len; i++) {
+ NETDATA.commonColors.get(this, this.chart.dimensions[keys[i]].name);
+ }
+ }
+ }
+
+ // we will re-generate the colors for the chart
+ // based on the dimensions this result has data for
+ this.colors = [];
+
+ if (this.debug) {
+ this.log('updating Legend DOM');
+ }
+
+ // mark all dimensions as invalid
+ this.dimensions_visibility.invalidateAll();
+
+ const genLabel = function (state, parent, dim, name, count) {
+ let color = state.__chartDimensionColor(name);
+
+ let user_element = null;
+ let user_id = NETDATA.dataAttribute(state.element, 'show-value-of-' + name.toLowerCase() + '-at', null);
+ if (user_id === null) {
+ user_id = NETDATA.dataAttribute(state.element, 'show-value-of-' + dim.toLowerCase() + '-at', null);
+ }
+ if (user_id !== null) {
+ user_element = document.getElementById(user_id) || null;
+ if (user_element === null) {
+ state.log('Cannot find element with id: ' + user_id);
+ }
+ }
+
+ state.element_legend_childs.series[name] = {
+ name: document.createElement('span'),
+ value: document.createElement('span'),
+ user: user_element,
+ last: null,
+ last_shown_value: null
+ };
+
+ let label = state.element_legend_childs.series[name];
+
+ // create the dimension visibility tracking for this label
+ state.dimensions_visibility.dimensionAdd(name, label.name, label.value, color);
+
+ let rgb = NETDATA.colorHex2Rgb(color);
+ label.name.innerHTML = '<table class="netdata-legend-name-table-'
+ + state.chart.chart_type
+ + '" style="background-color: '
+ + 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + NETDATA.options.current['color_fill_opacity_' + state.chart.chart_type] + ') !important'
+ + '"><tr class="netdata-legend-name-tr"><td class="netdata-legend-name-td"></td></tr></table>';
+
+ let text = document.createTextNode(' ' + name);
+ label.name.appendChild(text);
+
+ if (count > 0) {
+ parent.appendChild(document.createElement('br'));
+ }
+
+ parent.appendChild(label.name);
+ parent.appendChild(label.value);
+ };
+
+ let content = document.createElement('div');
+
+ if (this.element_chart === null) {
+ this.element_chart = document.createElement('div');
+ this.element_chart.id = this.library_name + '-' + this.uuid + '-chart';
+ this.element.appendChild(this.element_chart);
+
+ if (this.hasLegend()) {
+ this.element_chart.className = 'netdata-chart-with-legend-right netdata-' + this.library_name + '-chart-with-legend-right';
+ } else {
+ this.element_chart.className = ' netdata-chart netdata-' + this.library_name + '-chart';
+ }
+ }
+
+ if (this.hasLegend()) {
+ if (this.element_legend === null) {
+ this.element_legend = document.createElement('div');
+ this.element_legend.className = 'netdata-chart-legend netdata-' + this.library_name + '-legend';
+ this.element.appendChild(this.element_legend);
+ } else {
+ this.element_legend.innerHTML = '';
+ }
+
+ this.element_legend_childs = {
+ content: content,
+ resize_handler: null,
+ toolbox: null,
+ toolbox_left: null,
+ toolbox_right: null,
+ toolbox_reset: null,
+ toolbox_zoomin: null,
+ toolbox_zoomout: null,
+ toolbox_volume: null,
+ title_date: document.createElement('span'),
+ title_time: document.createElement('span'),
+ title_units: document.createElement('span'),
+ perfect_scroller: document.createElement('div'),
+ series: {}
+ };
+
+ if (NETDATA.options.current.legend_toolbox && this.library.toolboxPanAndZoom !== null) {
+ this.element_legend_childs.toolbox = document.createElement('div');
+ this.element_legend_childs.toolbox_left = document.createElement('div');
+ this.element_legend_childs.toolbox_right = document.createElement('div');
+ this.element_legend_childs.toolbox_reset = document.createElement('div');
+ this.element_legend_childs.toolbox_zoomin = document.createElement('div');
+ this.element_legend_childs.toolbox_zoomout = document.createElement('div');
+ this.element_legend_childs.toolbox_volume = document.createElement('div');
+
+ const getPanAndZoomStep = function (event) {
+ if (event.ctrlKey) {
+ return NETDATA.options.current.pan_and_zoom_factor * NETDATA.options.current.pan_and_zoom_factor_multiplier_control;
+ } else if (event.shiftKey) {
+ return NETDATA.options.current.pan_and_zoom_factor * NETDATA.options.current.pan_and_zoom_factor_multiplier_shift;
+ } else if (event.altKey) {
+ return NETDATA.options.current.pan_and_zoom_factor * NETDATA.options.current.pan_and_zoom_factor_multiplier_alt;
+ } else {
+ return NETDATA.options.current.pan_and_zoom_factor;
+ }
+ };
+
+ this.element_legend_childs.toolbox.className += ' netdata-legend-toolbox';
+ this.element.appendChild(this.element_legend_childs.toolbox);
+
+ this.element_legend_childs.toolbox_left.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_left.innerHTML = NETDATA.icons.left;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_left);
+ this.element_legend_childs.toolbox_left.onclick = function (e) {
+ e.preventDefault();
+
+ let step = (that.view_before - that.view_after) * getPanAndZoomStep(e);
+ let before = that.view_before - step;
+ let after = that.view_after - step;
+ if (after >= that.netdata_first) {
+ that.library.toolboxPanAndZoom(that, after, before);
+ }
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_left).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Pan Left',
+ content: 'Pan the chart to the left. You can also <b>drag it</b> with your mouse or your finger (on touch devices).<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ this.element_legend_childs.toolbox_reset.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_reset.innerHTML = NETDATA.icons.reset;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_reset);
+ this.element_legend_childs.toolbox_reset.onclick = function (e) {
+ e.preventDefault();
+ NETDATA.resetAllCharts(that);
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_reset).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Chart Reset',
+ content: 'Reset all the charts to their default auto-refreshing state. You can also <b>double click</b> the chart contents with your mouse or your finger (on touch devices).<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ this.element_legend_childs.toolbox_right.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_right.innerHTML = NETDATA.icons.right;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_right);
+ this.element_legend_childs.toolbox_right.onclick = function (e) {
+ e.preventDefault();
+ let step = (that.view_before - that.view_after) * getPanAndZoomStep(e);
+ let before = that.view_before + step;
+ let after = that.view_after + step;
+ if (before <= that.netdata_last) {
+ that.library.toolboxPanAndZoom(that, after, before);
+ }
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_right).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Pan Right',
+ content: 'Pan the chart to the right. You can also <b>drag it</b> with your mouse or your finger (on touch devices).<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ this.element_legend_childs.toolbox_zoomin.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_zoomin.innerHTML = NETDATA.icons.zoomIn;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_zoomin);
+ this.element_legend_childs.toolbox_zoomin.onclick = function (e) {
+ e.preventDefault();
+ let dt = ((that.view_before - that.view_after) * (getPanAndZoomStep(e) * 0.8) / 2);
+ let before = that.view_before - dt;
+ let after = that.view_after + dt;
+ that.library.toolboxPanAndZoom(that, after, before);
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_zoomin).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Chart Zoom In',
+ content: 'Zoom in the chart. You can also press SHIFT and select an area of the chart, or press SHIFT or ALT and use the mouse wheel or 2-finger touchpad scroll to zoom in or out.<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ this.element_legend_childs.toolbox_zoomout.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_zoomout.innerHTML = NETDATA.icons.zoomOut;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_zoomout);
+ this.element_legend_childs.toolbox_zoomout.onclick = function (e) {
+ e.preventDefault();
+ let dt = (((that.view_before - that.view_after) / (1.0 - (getPanAndZoomStep(e) * 0.8)) - (that.view_before - that.view_after)) / 2);
+ let before = that.view_before + dt;
+ let after = that.view_after - dt;
+
+ that.library.toolboxPanAndZoom(that, after, before);
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_zoomout).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Chart Zoom Out',
+ content: 'Zoom out the chart. You can also press SHIFT or ALT and use the mouse wheel, or 2-finger touchpad scroll to zoom in or out.<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ //this.element_legend_childs.toolbox_volume.className += ' netdata-legend-toolbox-button';
+ //this.element_legend_childs.toolbox_volume.innerHTML = '<i class="fas fa-sort-amount-down"></i>';
+ //this.element_legend_childs.toolbox_volume.title = 'Visible Volume';
+ //this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_volume);
+ //this.element_legend_childs.toolbox_volume.onclick = function(e) {
+ //e.preventDefault();
+ //alert('clicked toolbox_volume on ' + that.id);
+ //}
+ }
+
+ if (NETDATA.options.current.resize_charts) {
+ this.element_legend_childs.resize_handler = document.createElement('div');
+
+ this.element_legend_childs.resize_handler.className += " netdata-legend-resize-handler";
+ this.element_legend_childs.resize_handler.innerHTML = NETDATA.icons.resize;
+ this.element.appendChild(this.element_legend_childs.resize_handler);
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.resize_handler).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Chart Resize',
+ content: 'Drag this point with your mouse or your finger (on touch devices), to resize the chart vertically. You can also <b>double click it</b> or <b>double tap it</b> to reset between 2 states: the default and the one that fits all the values.<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ // mousedown event
+ this.element_legend_childs.resize_handler.onmousedown =
+ function (e) {
+ that.resizeHandler(e);
+ };
+
+ // touchstart event
+ this.element_legend_childs.resize_handler.addEventListener('touchstart', function (e) {
+ that.resizeHandler(e);
+ }, false);
+ }
+
+ if (this.chart) {
+ this.element_legend_childs.title_date.title = this.legendPluginModuleString(true);
+ this.element_legend_childs.title_time.title = this.legendResolutionTooltip();
+ }
+
+ this.element_legend_childs.title_date.className += " netdata-legend-title-date";
+ this.element_legend.appendChild(this.element_legend_childs.title_date);
+ this.tmp.__last_shown_legend_date = undefined;
+
+ this.element_legend.appendChild(document.createElement('br'));
+
+ this.element_legend_childs.title_time.className += " netdata-legend-title-time";
+ this.element_legend.appendChild(this.element_legend_childs.title_time);
+ this.tmp.__last_shown_legend_time = undefined;
+
+ this.element_legend.appendChild(document.createElement('br'));
+
+ this.element_legend_childs.title_units.className += " netdata-legend-title-units";
+ this.element_legend_childs.title_units.innerText = this.units_current;
+ this.element_legend.appendChild(this.element_legend_childs.title_units);
+ this.tmp.__last_shown_legend_units = undefined;
+
+ this.element_legend.appendChild(document.createElement('br'));
+
+ this.element_legend_childs.perfect_scroller.className = 'netdata-legend-series';
+ this.element_legend.appendChild(this.element_legend_childs.perfect_scroller);
+
+ content.className = 'netdata-legend-series-content';
+ this.element_legend_childs.perfect_scroller.appendChild(content);
+
+ this.element_legend_childs.content = content;
+
+ if (NETDATA.options.current.show_help) {
+ $(content).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ title: 'Chart Legend',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ content: 'You can click or tap on the values or the labels to select dimensions. By pressing SHIFT or CONTROL, you can enable or disable multiple dimensions.<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+ } else {
+ this.element_legend_childs = {
+ content: content,
+ resize_handler: null,
+ toolbox: null,
+ toolbox_left: null,
+ toolbox_right: null,
+ toolbox_reset: null,
+ toolbox_zoomin: null,
+ toolbox_zoomout: null,
+ toolbox_volume: null,
+ title_date: null,
+ title_time: null,
+ title_units: null,
+ perfect_scroller: null,
+ series: {}
+ };
+ }
+
+ if (this.data) {
+ this.element_legend_childs.series.labels_key = this.data.dimension_names.toString();
+ if (this.debug) {
+ this.log('labels from data: "' + this.element_legend_childs.series.labels_key + '"');
+ }
+
+ for (let i = 0, len = this.data.dimension_names.length; i < len; i++) {
+ genLabel(this, content, this.data.dimension_ids[i], this.data.dimension_names[i], i);
+ }
+ } else {
+ let tmp = [];
+ keys = Object.keys(this.chart.dimensions);
+ for (let i = 0, len = keys.length; i < len; i++) {
+ dim = keys[i];
+ tmp.push(this.chart.dimensions[dim].name);
+ genLabel(this, content, dim, this.chart.dimensions[dim].name, i);
+ }
+ this.element_legend_childs.series.labels_key = tmp.toString();
+ if (this.debug) {
+ this.log('labels from chart: "' + this.element_legend_childs.series.labels_key + '"');
+ }
+ }
+
+ // create a hidden div to be used for hidding
+ // the original legend of the chart library
+ let el = document.createElement('div');
+ if (this.element_legend !== null) {
+ this.element_legend.appendChild(el);
+ }
+ el.style.display = 'none';
+
+ this.element_legend_childs.hidden = document.createElement('div');
+ el.appendChild(this.element_legend_childs.hidden);
+
+ if (this.element_legend_childs.perfect_scroller !== null) {
+ Ps.initialize(this.element_legend_childs.perfect_scroller, {
+ wheelSpeed: 0.2,
+ wheelPropagation: true,
+ swipePropagation: true,
+ minScrollbarLength: null,
+ maxScrollbarLength: null,
+ useBothWheelAxes: false,
+ suppressScrollX: true,
+ suppressScrollY: false,
+ scrollXMarginOffset: 0,
+ scrollYMarginOffset: 0,
+ theme: 'default'
+ });
+ Ps.update(this.element_legend_childs.perfect_scroller);
+ }
+
+ this.legendShowLatestValues();
+ };
+
+ this.hasLegend = function () {
+ if (typeof this.tmp.___hasLegendCache___ !== 'undefined') {
+ return this.tmp.___hasLegendCache___;
+ }
+
+ let leg = false;
+ if (this.library && this.library.legend(this) === 'right-side') {
+ leg = true;
+ }
+
+ this.tmp.___hasLegendCache___ = leg;
+ return leg;
+ };
+
+ this.legendWidth = function () {
+ return (this.hasLegend()) ? 140 : 0;
+ };
+
+ this.legendHeight = function () {
+ return $(this.element).height();
+ };
+
+ this.chartWidth = function () {
+ return $(this.element).width() - this.legendWidth();
+ };
+
+ this.chartHeight = function () {
+ return $(this.element).height();
+ };
+
+ this.chartPixelsPerPoint = function () {
+ // force an options provided detail
+ let px = this.pixels_per_point;
+
+ if (this.library && px < this.library.pixels_per_point(this)) {
+ px = this.library.pixels_per_point(this);
+ }
+
+ if (px < NETDATA.options.current.pixels_per_point) {
+ px = NETDATA.options.current.pixels_per_point;
+ }
+
+ return px;
+ };
+
+ this.needsRecreation = function () {
+ let ret = (
+ this.chart_created &&
+ this.library &&
+ this.library.autoresize() === false &&
+ this.tm.last_resized < NETDATA.options.last_page_resize
+ );
+
+ if (this.debug) {
+ this.log('needsRecreation(): ' + ret.toString() + ', chart_created = ' + this.chart_created.toString());
+ }
+
+ return ret;
+ };
+
+ this.chartDataUniqueID = function () {
+ return this.id + ',' + this.library_name + ',' + this.dimensions + ',' + this.chartURLOptions(true);
+ };
+
+ this.chartURLOptions = function (isForUniqueId) {
+ let ret = '';
+
+ if (this.override_options !== null) {
+ ret = this.override_options.toString();
+ } else {
+ ret = this.library.options(this);
+ }
+
+ if (this.append_options !== null) {
+ ret += '%7C' + this.append_options.toString();
+ }
+
+ ret += '%7C' + 'jsonwrap';
+
+ // always add `nonzero` when it's used to create a chartDataUniqueID
+ // we cannot just remove `nonzero` because of backwards compatibility with old snapshots
+ if (isForUniqueId || NETDATA.options.current.eliminate_zero_dimensions) {
+ ret += '%7C' + 'nonzero';
+ }
+
+ return ret;
+ };
+
+ this.chartURL = function () {
+ let after, before, points_multiplier = 1;
+ if (NETDATA.globalPanAndZoom.isActive()) {
+ if (this.current.force_before_ms !== null && this.current.force_after_ms !== null) {
+ this.tm.pan_and_zoom_seq = 0;
+
+ before = Math.round(this.current.force_before_ms / 1000);
+ after = Math.round(this.current.force_after_ms / 1000);
+ this.view_after = after * 1000;
+ this.view_before = before * 1000;
+
+ if (NETDATA.options.current.pan_and_zoom_data_padding) {
+ this.requested_padding = Math.round((before - after) / 2);
+ after -= this.requested_padding;
+ before += this.requested_padding;
+ this.requested_padding *= 1000;
+ points_multiplier = 2;
+ }
+
+ this.current.force_before_ms = null;
+ this.current.force_after_ms = null;
+ } else {
+ this.tm.pan_and_zoom_seq = NETDATA.globalPanAndZoom.seq;
+
+ after = Math.round(NETDATA.globalPanAndZoom.force_after_ms / 1000);
+ before = Math.round(NETDATA.globalPanAndZoom.force_before_ms / 1000);
+ this.view_after = after * 1000;
+ this.view_before = before * 1000;
+
+ this.requested_padding = null;
+ points_multiplier = 1;
+ }
+ } else {
+ this.tm.pan_and_zoom_seq = 0;
+
+ before = this.before;
+ after = this.after;
+ this.view_after = after * 1000;
+ this.view_before = before * 1000;
+
+ this.requested_padding = null;
+ points_multiplier = 1;
+ }
+
+ this.requested_after = after * 1000;
+ this.requested_before = before * 1000;
+
+ let data_points;
+ if (NETDATA.options.force_data_points !== 0) {
+ data_points = NETDATA.options.force_data_points;
+ this.data_points = data_points;
+ } else {
+ this.data_points = this.points || Math.round(this.chartWidth() / this.chartPixelsPerPoint());
+ data_points = this.data_points * points_multiplier;
+ }
+
+ // build the data URL
+ this.data_url = this.host + this.chart.data_url;
+ this.data_url += "&format=" + this.library.format();
+ this.data_url += "&points=" + (data_points).toString();
+ this.data_url += "&group=" + this.method;
+ this.data_url += ">ime=" + this.gtime;
+ this.data_url += "&options=" + this.chartURLOptions();
+
+ if (after) {
+ this.data_url += "&after=" + after.toString();
+ }
+
+ if (before) {
+ this.data_url += "&before=" + before.toString();
+ }
+
+ if (this.dimensions) {
+ this.data_url += "&dimensions=" + this.dimensions;
+ }
+
+ if (NETDATA.options.debug.chart_data_url || this.debug) {
+ this.log('chartURL(): ' + this.data_url + ' WxH:' + this.chartWidth() + 'x' + this.chartHeight() + ' points: ' + data_points.toString() + ' library: ' + this.library_name);
+ }
+ };
+
+ this.redrawChart = function () {
+ if (this.data !== null) {
+ this.updateChartWithData(this.data);
+ }
+ };
+
+ this.updateChartWithData = function (data) {
+ if (this.debug) {
+ this.log('updateChartWithData() called.');
+ }
+
+ // this may force the chart to be re-created
+ resizeChart();
+
+ this.data = data;
+
+ let started = Date.now();
+ let view_update_every = data.view_update_every * 1000;
+
+ if (this.data_update_every !== view_update_every) {
+ if (this.element_legend_childs.title_time) {
+ this.element_legend_childs.title_time.title = this.legendResolutionTooltip();
+ }
+ }
+
+ // if the result is JSON, find the latest update-every
+ this.data_update_every = view_update_every;
+ this.data_after = data.after * 1000;
+ this.data_before = data.before * 1000;
+ this.netdata_first = data.first_entry * 1000;
+ this.netdata_last = data.last_entry * 1000;
+ this.data_points = data.points;
+
+ data.state = this;
+
+ if (NETDATA.options.current.pan_and_zoom_data_padding && this.requested_padding !== null) {
+ if (this.view_after < this.data_after) {
+ // console.log('adjusting view_after from ' + this.view_after + ' to ' + this.data_after);
+ this.view_after = this.data_after;
+ }
+
+ if (this.view_before > this.data_before) {
+ // console.log('adjusting view_before from ' + this.view_before + ' to ' + this.data_before);
+ this.view_before = this.data_before;
+ }
+ } else {
+ this.view_after = this.data_after;
+ this.view_before = this.data_before;
+ }
+
+ if (this.debug) {
+ this.log('UPDATE No ' + this.updates_counter + ' COMPLETED');
+
+ if (this.current.force_after_ms) {
+ this.log('STATUS: forced : ' + (this.current.force_after_ms / 1000).toString() + ' - ' + (this.current.force_before_ms / 1000).toString());
+ } else {
+ this.log('STATUS: forced : unset');
+ }
+
+ this.log('STATUS: requested : ' + (this.requested_after / 1000).toString() + ' - ' + (this.requested_before / 1000).toString());
+ this.log('STATUS: downloaded: ' + (this.data_after / 1000).toString() + ' - ' + (this.data_before / 1000).toString());
+ this.log('STATUS: rendered : ' + (this.view_after / 1000).toString() + ' - ' + (this.view_before / 1000).toString());
+ this.log('STATUS: points : ' + (this.data_points).toString());
+ }
+
+ if (this.data_points === 0) {
+ noDataToShow();
+ return;
+ }
+
+ if (this.updates_since_last_creation >= this.library.max_updates_to_recreate()) {
+ if (this.debug) {
+ this.log('max updates of ' + this.updates_since_last_creation.toString() + ' reached. Forcing re-generation.');
+ }
+
+ init('force');
+ return;
+ }
+
+ // check and update the legend
+ this.legendUpdateDOM();
+
+ if (this.chart_created && typeof this.library.update === 'function') {
+ if (this.debug) {
+ this.log('updating chart...');
+ }
+
+ if (!callChartLibraryUpdateSafely(data)) {
+ return;
+ }
+ } else {
+ if (this.debug) {
+ this.log('creating chart...');
+ }
+
+ if (!callChartLibraryCreateSafely(data)) {
+ return;
+ }
+ }
+
+ if (this.isVisible()) {
+ hideMessage();
+ this.legendShowLatestValues();
+ } else {
+ this.__redraw_on_unhide = true;
+
+ if (this.debug) {
+ this.log("drawn while not visible");
+ }
+ }
+
+ if (this.selected) {
+ NETDATA.globalSelectionSync.stop();
+ }
+
+ // update the performance counters
+ let now = Date.now();
+ this.tm.last_updated = now;
+
+ // don't update last_autorefreshed if this chart is
+ // forced to be updated with global PanAndZoom
+ if (NETDATA.globalPanAndZoom.isActive()) {
+ this.tm.last_autorefreshed = 0;
+ } else {
+ if (NETDATA.options.current.parallel_refresher && NETDATA.options.current.concurrent_refreshes && typeof this.force_update_every !== 'number') {
+ this.tm.last_autorefreshed = now - (now % this.data_update_every);
+ } else {
+ this.tm.last_autorefreshed = now;
+ }
+ }
+
+ this.refresh_dt_ms = now - started;
+ NETDATA.options.auto_refresher_fast_weight += this.refresh_dt_ms;
+
+ if (this.refresh_dt_element !== null) {
+ this.refresh_dt_element.innerText = this.refresh_dt_ms.toString();
+ }
+
+ if (this.foreignElementBefore !== null) {
+ this.foreignElementBefore.innerText = NETDATA.dateTime.localeDateString(this.view_before) + ' ' + NETDATA.dateTime.localeTimeString(this.view_before);
+ }
+
+ if (this.foreignElementAfter !== null) {
+ this.foreignElementAfter.innerText = NETDATA.dateTime.localeDateString(this.view_after) + ' ' + NETDATA.dateTime.localeTimeString(this.view_after);
+ }
+
+ if (this.foreignElementDuration !== null) {
+ this.foreignElementDuration.innerText = NETDATA.seconds4human(Math.floor((this.view_before - this.view_after) / 1000) + 1);
+ }
+
+ if (this.foreignElementUpdateEvery !== null) {
+ this.foreignElementUpdateEvery.innerText = NETDATA.seconds4human(Math.floor(this.data_update_every / 1000));
+ }
+ };
+
+ this.getSnapshotData = function (key) {
+ if (this.debug) {
+ this.log('updating from snapshot: ' + key);
+ }
+
+ if (typeof netdataSnapshotData.data[key] === 'undefined') {
+ this.log('snapshot does not include data for key "' + key + '"');
+ return null;
+ }
+
+ if (typeof netdataSnapshotData.data[key] !== 'string') {
+ this.log('snapshot data for key "' + key + '" is not string');
+ return null;
+ }
+
+ let uncompressed;
+ try {
+ uncompressed = netdataSnapshotData.uncompress(netdataSnapshotData.data[key]);
+
+ if (uncompressed === null) {
+ this.log('uncompressed snapshot data for key ' + key + ' is null');
+ return null;
+ }
+
+ if (typeof uncompressed === 'undefined') {
+ this.log('uncompressed snapshot data for key ' + key + ' is undefined');
+ return null;
+ }
+ } catch (e) {
+ this.log('decompression of snapshot data for key ' + key + ' failed');
+ console.log(e);
+ uncompressed = null;
+ }
+
+ if (typeof uncompressed !== 'string') {
+ this.log('uncompressed snapshot data for key ' + key + ' is not string');
+ return null;
+ }
+
+ let data;
+ try {
+ data = JSON.parse(uncompressed);
+ } catch (e) {
+ this.log('parsing snapshot data for key ' + key + ' failed');
+ console.log(e);
+ data = null;
+ }
+
+ return data;
+ };
+
+ this.updateChart = function (callback) {
+ if (this.debug) {
+ this.log('updateChart()');
+ }
+
+ if (this.fetching_data) {
+ if (this.debug) {
+ this.log('updateChart(): I am already updating...');
+ }
+
+ if (typeof callback === 'function') {
+ return callback(false, 'already running');
+ }
+
+ return;
+ }
+
+ // due to late initialization of charts and libraries
+ // we need to check this too
+ if (!this.enabled) {
+ if (this.debug) {
+ this.log('updateChart(): I am not enabled');
+ }
+
+ if (typeof callback === 'function') {
+ return callback(false, 'not enabled');
+ }
+
+ return;
+ }
+
+ if (!canBeRendered()) {
+ if (this.debug) {
+ this.log('updateChart(): cannot be rendered');
+ }
+
+ if (typeof callback === 'function') {
+ return callback(false, 'cannot be rendered');
+ }
+
+ return;
+ }
+
+ if (that.dom_created !== true) {
+ if (this.debug) {
+ this.log('updateChart(): creating DOM');
+ }
+
+ createDOM();
+ }
+
+ if (this.chart === null) {
+ if (this.debug) {
+ this.log('updateChart(): getting chart');
+ }
+
+ return this.getChart(function () {
+ return that.updateChart(callback);
+ });
+ }
+
+ if (!this.library.initialized) {
+ if (this.library.enabled) {
+ if (this.debug) {
+ this.log('updateChart(): initializing chart library');
+ }
+
+ return this.library.initialize(function () {
+ return that.updateChart(callback);
+ });
+ } else {
+ error('chart library "' + this.library_name + '" is not available.');
+
+ if (typeof callback === 'function') {
+ return callback(false, 'library not available');
+ }
+
+ return;
+ }
+ }
+
+ this.clearSelection();
+ this.chartURL();
+
+ NETDATA.statistics.refreshes_total++;
+ NETDATA.statistics.refreshes_active++;
+
+ if (NETDATA.statistics.refreshes_active > NETDATA.statistics.refreshes_active_max) {
+ NETDATA.statistics.refreshes_active_max = NETDATA.statistics.refreshes_active;
+ }
+
+ let ok = false;
+ this.fetching_data = true;
+
+ if (netdataSnapshotData !== null) {
+ let key = this.chartDataUniqueID();
+ let data = this.getSnapshotData(key);
+ if (data !== null) {
+ ok = true;
+ data = NETDATA.xss.checkData('/api/v1/data', data, this.library.xssRegexIgnore);
+ this.updateChartWithData(data);
+ } else {
+ ok = false;
+ error('cannot get data from snapshot for key: "' + key + '"');
+ that.tm.last_autorefreshed = Date.now();
+ }
+
+ NETDATA.statistics.refreshes_active--;
+ this.fetching_data = false;
+
+ if (typeof callback === 'function') {
+ callback(ok, 'snapshot');
+ }
+
+ return;
+ }
+
+ if (this.debug) {
+ this.log('updating from ' + this.data_url);
+ }
+
+ this.xhr = $.ajax({
+ url: this.data_url,
+ cache: false,
+ async: true,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkData('/api/v1/data', data, that.library.xssRegexIgnore);
+
+ that.xhr = undefined;
+ that.retries_on_data_failures = 0;
+ ok = true;
+
+ if (that.debug) {
+ that.log('data received. updating chart.');
+ }
+
+ that.updateChartWithData(data);
+ })
+ .fail(function (msg) {
+ that.xhr = undefined;
+
+ if (msg.statusText !== 'abort') {
+ that.retries_on_data_failures++;
+ if (that.retries_on_data_failures > NETDATA.options.current.retries_on_data_failures) {
+ // that.log('failed ' + that.retries_on_data_failures.toString() + ' times - giving up');
+ that.retries_on_data_failures = 0;
+ error('data download failed for url: ' + that.data_url);
+ }
+ else {
+ that.tm.last_autorefreshed = Date.now();
+ // that.log('failed ' + that.retries_on_data_failures.toString() + ' times, but I will retry');
+ }
+ }
+ })
+ .always(function () {
+ that.xhr = undefined;
+
+ NETDATA.statistics.refreshes_active--;
+ that.fetching_data = false;
+
+ if (typeof callback === 'function') {
+ return callback(ok, 'download');
+ }
+ });
+ };
+
+ const __isVisible = function () {
+ let ret = true;
+
+ if (NETDATA.options.current.update_only_visible !== false) {
+ // tolerance is the number of pixels a chart can be off-screen
+ // to consider it as visible and refresh it as if was visible
+ let tolerance = 0;
+
+ that.tm.last_visible_check = Date.now();
+
+ let rect = that.element.getBoundingClientRect();
+
+ let screenTop = window.scrollY;
+ let screenBottom = screenTop + window.innerHeight;
+
+ let chartTop = rect.top + screenTop;
+ let chartBottom = chartTop + rect.height;
+
+ ret = !(rect.width === 0 || rect.height === 0 || chartBottom + tolerance < screenTop || chartTop - tolerance > screenBottom);
+ }
+
+ if (that.debug) {
+ that.log('__isVisible(): ' + ret);
+ }
+
+ return ret;
+ };
+
+ this.isVisible = function (nocache) {
+ // this.log('last_visible_check: ' + this.tm.last_visible_check + ', last_page_scroll: ' + NETDATA.options.last_page_scroll);
+
+ // caching - we do not evaluate the charts visibility
+ // if the page has not been scrolled since the last check
+ if ((typeof nocache !== 'undefined' && nocache)
+ || typeof this.tmp.___isVisible___ === 'undefined'
+ || this.tm.last_visible_check <= NETDATA.options.last_page_scroll) {
+ this.tmp.___isVisible___ = __isVisible();
+ if (this.tmp.___isVisible___) {
+ this.unhideChart();
+ } else {
+ this.hideChart();
+ }
+ }
+
+ if (this.debug) {
+ this.log('isVisible(' + nocache + '): ' + this.tmp.___isVisible___);
+ }
+
+ return this.tmp.___isVisible___;
+ };
+
+ this.isAutoRefreshable = function () {
+ return (this.current.autorefresh);
+ };
+
+ this.canBeAutoRefreshed = function () {
+ if (!this.enabled) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> not enabled');
+ }
+
+ return false;
+ }
+
+ if (this.running) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> already running');
+ }
+
+ return false;
+ }
+
+ if (this.library === null || this.library.enabled === false) {
+ error('charting library "' + this.library_name + '" is not available');
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> chart library ' + this.library_name + ' is not available');
+ }
+
+ return false;
+ }
+
+ if (!this.isVisible()) {
+ if (NETDATA.options.debug.visibility || this.debug) {
+ this.log('canBeAutoRefreshed() -> not visible');
+ }
+
+ return false;
+ }
+
+ let now = Date.now();
+
+ if (this.current.force_update_at !== 0 && this.current.force_update_at < now) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> timed force update - allowing this update');
+ }
+
+ this.current.force_update_at = 0;
+ return true;
+ }
+
+ if (!this.isAutoRefreshable()) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> not auto-refreshable');
+ }
+
+ return false;
+ }
+
+ // allow the first update, even if the page is not visible
+ if (NETDATA.options.page_is_visible === false && this.updates_counter && this.updates_since_last_unhide) {
+ if (NETDATA.options.debug.focus || this.debug) {
+ this.log('canBeAutoRefreshed() -> not the first update, and page does not have focus');
+ }
+
+ return false;
+ }
+
+ if (this.needsRecreation()) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> needs re-creation.');
+ }
+
+ return true;
+ }
+
+ if (NETDATA.options.auto_refresher_stop_until >= now) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> stopped until is in future.');
+ }
+
+ return false;
+ }
+
+ // options valid only for autoRefresh()
+ if (NETDATA.globalPanAndZoom.isActive()) {
+ if (NETDATA.globalPanAndZoom.shouldBeAutoRefreshed(this)) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): global panning: I need an update.');
+ }
+
+ return true;
+ }
+ else {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): global panning: I am already up to date.');
+ }
+
+ return false;
+ }
+ }
+
+ if (this.selected) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): I have a selection in place.');
+ }
+
+ return false;
+ }
+
+ if (this.paused) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): I am paused.');
+ }
+
+ return false;
+ }
+
+ let data_update_every = this.data_update_every;
+ if (typeof this.force_update_every === 'number') {
+ data_update_every = this.force_update_every;
+ }
+
+ if (now - this.tm.last_autorefreshed >= data_update_every) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): It is time to update me. Now: ' + now.toString() + ', last_autorefreshed: ' + this.tm.last_autorefreshed + ', data_update_every: ' + data_update_every + ', delta: ' + (now - this.tm.last_autorefreshed).toString());
+ }
+
+ return true;
+ }
+
+ return false;
+ };
+
+ this.autoRefresh = function (callback) {
+ let state = that;
+
+ if (state.canBeAutoRefreshed() && state.running === false) {
+ state.running = true;
+ state.updateChart(function () {
+ state.running = false;
+
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ });
+ } else {
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ }
+ };
+
+ this.__defaultsFromDownloadedChart = function (chart) {
+ this.chart = chart;
+ this.chart_url = chart.url;
+ this.data_update_every = chart.update_every * 1000;
+ this.data_points = Math.round(this.chartWidth() / this.chartPixelsPerPoint());
+ this.tm.last_info_downloaded = Date.now();
+
+ if (this.title === null) {
+ this.title = chart.title;
+ }
+
+ if (this.units === null) {
+ this.units = chart.units;
+ this.units_current = this.units;
+ }
+ };
+
+ // fetch the chart description from the netdata server
+ this.getChart = function (callback) {
+ this.chart = NETDATA.chartRegistry.get(this.host, this.id);
+ if (this.chart) {
+ this.__defaultsFromDownloadedChart(this.chart);
+
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ } else if (netdataSnapshotData !== null) {
+ // console.log(this);
+ // console.log(NETDATA.chartRegistry);
+ NETDATA.error(404, 'host: ' + this.host + ', chart: ' + this.id);
+ error('chart not found in snapshot');
+
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ } else {
+ this.chart_url = "/api/v1/chart?chart=" + this.id;
+
+ if (this.debug) {
+ this.log('downloading ' + this.chart_url);
+ }
+
+ $.ajax({
+ url: this.host + this.chart_url,
+ cache: false,
+ async: true,
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (chart) {
+ chart = NETDATA.xss.checkOptional('/api/v1/chart', chart);
+
+ chart.url = that.chart_url;
+ that.__defaultsFromDownloadedChart(chart);
+ NETDATA.chartRegistry.add(that.host, that.id, chart);
+ })
+ .fail(function () {
+ NETDATA.error(404, that.chart_url);
+ error('chart not found on url "' + that.chart_url + '"');
+ })
+ .always(function () {
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ });
+ }
+ };
+
+ // ============================================================================================================
+ // INITIALIZATION
+
+ initDOM();
+ init('fast');
+};
+
+NETDATA.resetAllCharts = function (state) {
+ // first clear the global selection sync
+ // to make sure no chart is in selected state
+ NETDATA.globalSelectionSync.stop();
+
+ // there are 2 possibilities here
+ // a. state is the global Pan and Zoom master
+ // b. state is not the global Pan and Zoom master
+
+ // let master = true;
+ // if (NETDATA.globalPanAndZoom.isMaster(state) === false) {
+ // master = false;
+ // }
+ const master = NETDATA.globalPanAndZoom.isMaster(state);
+
+ // clear the global Pan and Zoom
+ // this will also refresh the master
+ // and unblock any charts currently mirroring the master
+ NETDATA.globalPanAndZoom.clearMaster();
+
+ // if we were not the master, reset our status too
+ // this is required because most probably the mouse
+ // is over this chart, blocking it from auto-refreshing
+ if (master === false && (state.paused || state.selected)) {
+ state.resetChart();
+ }
+};
+
+// get or create a chart state, given a DOM element
+NETDATA.chartState = function (element) {
+ let self = $(element);
+
+ let state = self.data('netdata-state-object') || null;
+ if (state === null) {
+ state = new chartState(element);
+ self.data('netdata-state-object', state);
+ }
+ return state;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// Library functions
+
+// Load a script without jquery
+// This is used to load jquery - after it is loaded, we use jquery
+NETDATA._loadjQuery = function (callback) {
+ if (typeof jQuery === 'undefined') {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('loading ' + NETDATA.jQuery);
+ }
+
+ let script = document.createElement('script');
+ script.type = 'text/javascript';
+ script.async = true;
+ script.src = NETDATA.jQuery;
+
+ // script.onabort = onError;
+ script.onerror = function () {
+ NETDATA.error(101, NETDATA.jQuery);
+ };
+ if (typeof callback === "function") {
+ script.onload = function () {
+ $ = jQuery;
+ return callback();
+ };
+ }
+
+ let s = document.getElementsByTagName('script')[0];
+ s.parentNode.insertBefore(script, s);
+ }
+ else if (typeof callback === "function") {
+ $ = jQuery;
+ return callback();
+ }
+};
+
+NETDATA._loadCSS = function (filename) {
+ // don't use jQuery here
+ // styles are loaded before jQuery
+ // to eliminate showing an unstyled page to the user
+
+ let fileref = document.createElement("link");
+ fileref.setAttribute("rel", "stylesheet");
+ fileref.setAttribute("type", "text/css");
+ fileref.setAttribute("href", filename);
+
+ if (typeof fileref !== 'undefined') {
+ document.getElementsByTagName("head")[0].appendChild(fileref);
+ }
+};
+
+// user function to signal us the DOM has been
+// updated.
+NETDATA.updatedDom = function () {
+ NETDATA.options.updated_dom = true;
+};
+
+NETDATA.ready = function (callback) {
+ NETDATA.options.pauseCallback = callback;
+};
+
+NETDATA.pause = function (callback) {
+ if (typeof callback === 'function') {
+ if (NETDATA.options.pause) {
+ return callback();
+ } else {
+ NETDATA.options.pauseCallback = callback;
+ }
+ }
+};
+
+NETDATA.unpause = function () {
+ NETDATA.options.pauseCallback = null;
+ NETDATA.options.updated_dom = true;
+ NETDATA.options.pause = false;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+
+// this is purely sequential charts refresher
+// it is meant to be autonomous
+NETDATA.chartRefresherNoParallel = function (index, callback) {
+ let targets = NETDATA.intersectionObserver.targets();
+
+ if (NETDATA.options.debug.main_loop) {
+ console.log('NETDATA.chartRefresherNoParallel(' + index + ')');
+ }
+
+ if (NETDATA.options.updated_dom) {
+ // the dom has been updated
+ // get the dom parts again
+ NETDATA.parseDom(callback);
+ return;
+ }
+ if (index >= targets.length) {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('waiting to restart main loop...');
+ }
+
+ NETDATA.options.auto_refresher_fast_weight = 0;
+ callback();
+ } else {
+ let state = targets[index];
+
+ if (NETDATA.options.auto_refresher_fast_weight < NETDATA.options.current.fast_render_timeframe) {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('fast rendering...');
+ }
+
+ if (state.isVisible()) {
+ NETDATA.timeout.set(function () {
+ state.autoRefresh(function () {
+ NETDATA.chartRefresherNoParallel(++index, callback);
+ });
+ }, 0);
+ } else {
+ NETDATA.chartRefresherNoParallel(++index, callback);
+ }
+ } else {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('waiting for next refresh...');
+ }
+ NETDATA.options.auto_refresher_fast_weight = 0;
+
+ NETDATA.timeout.set(function () {
+ state.autoRefresh(function () {
+ NETDATA.chartRefresherNoParallel(++index, callback);
+ });
+ }, NETDATA.options.current.idle_between_charts);
+ }
+ }
+};
+
+NETDATA.chartRefresherWaitTime = function () {
+ return NETDATA.options.current.idle_parallel_loops;
+};
+
+// the default refresher
+NETDATA.chartRefresherLastRun = 0;
+NETDATA.chartRefresherRunsAfterParseDom = 0;
+NETDATA.chartRefresherTimeoutId = undefined;
+
+NETDATA.chartRefresherReschedule = function () {
+ if (NETDATA.options.current.async_on_scroll) {
+ if (NETDATA.chartRefresherTimeoutId) {
+ NETDATA.timeout.clear(NETDATA.chartRefresherTimeoutId);
+ }
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(NETDATA.chartRefresher, NETDATA.options.current.onscroll_worker_duration_threshold);
+ //console.log('chartRefresherReschedule()');
+ }
+};
+
+NETDATA.chartRefresher = function () {
+ // console.log('chartRefresher() begin ' + (Date.now() - NETDATA.chartRefresherLastRun).toString() + ' ms since last run');
+
+ if (NETDATA.options.page_is_visible === false
+ && NETDATA.options.current.stop_updates_when_focus_is_lost
+ && NETDATA.chartRefresherLastRun > NETDATA.options.last_page_resize
+ && NETDATA.chartRefresherLastRun > NETDATA.options.last_page_scroll
+ && NETDATA.chartRefresherRunsAfterParseDom > 10
+ ) {
+ setTimeout(
+ NETDATA.chartRefresher,
+ NETDATA.options.current.idle_lost_focus
+ );
+
+ // console.log('chartRefresher() page without focus, will run in ' + NETDATA.options.current.idle_lost_focus.toString() + ' ms, ' + NETDATA.chartRefresherRunsAfterParseDom.toString());
+ return;
+ }
+ NETDATA.chartRefresherRunsAfterParseDom++;
+
+ let now = Date.now();
+ NETDATA.chartRefresherLastRun = now;
+
+ if (now < NETDATA.options.on_scroll_refresher_stop_until) {
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.chartRefresherWaitTime()
+ );
+
+ // console.log('chartRefresher() end1 will run in ' + NETDATA.chartRefresherWaitTime().toString() + ' ms');
+ return;
+ }
+
+ if (now < NETDATA.options.auto_refresher_stop_until) {
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.chartRefresherWaitTime()
+ );
+
+ // console.log('chartRefresher() end2 will run in ' + NETDATA.chartRefresherWaitTime().toString() + ' ms');
+ return;
+ }
+
+ if (NETDATA.options.pause) {
+ // console.log('auto-refresher is paused');
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.chartRefresherWaitTime()
+ );
+
+ // console.log('chartRefresher() end3 will run in ' + NETDATA.chartRefresherWaitTime().toString() + ' ms');
+ return;
+ }
+
+ if (typeof NETDATA.options.pauseCallback === 'function') {
+ // console.log('auto-refresher is calling pauseCallback');
+
+ NETDATA.options.pause = true;
+ NETDATA.options.pauseCallback();
+ NETDATA.chartRefresher();
+
+ // console.log('chartRefresher() end4 (nested)');
+ return;
+ }
+
+ if (!NETDATA.options.current.parallel_refresher) {
+ // console.log('auto-refresher is calling chartRefresherNoParallel(0)');
+ NETDATA.chartRefresherNoParallel(0, function () {
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.options.current.idle_between_loops
+ );
+ });
+ // console.log('chartRefresher() end5 (no parallel, nested)');
+ return;
+ }
+
+ if (NETDATA.options.updated_dom) {
+ // the dom has been updated
+ // get the dom parts again
+ // console.log('auto-refresher is calling parseDom()');
+ NETDATA.parseDom(NETDATA.chartRefresher);
+ // console.log('chartRefresher() end6 (parseDom)');
+ return;
+ }
+
+ if (!NETDATA.globalSelectionSync.active()) {
+ let parallel = [];
+ let targets = NETDATA.intersectionObserver.targets();
+ let len = targets.length;
+ let state;
+ while (len--) {
+ state = targets[len];
+ if (state.running || state.isVisible() === false) {
+ continue;
+ }
+
+ if (!state.library.initialized) {
+ if (state.library.enabled) {
+ state.library.initialize(NETDATA.chartRefresher);
+ //console.log('chartRefresher() end6 (library init)');
+ return;
+ }
+ else {
+ state.error('chart library "' + state.library_name + '" is not enabled.');
+ }
+ }
+
+ if (NETDATA.scrollUp) {
+ parallel.unshift(state);
+ } else {
+ parallel.push(state);
+ }
+ }
+
+ len = parallel.length;
+ while (len--) {
+ state = parallel[len];
+ // console.log('auto-refresher executing in parallel for ' + parallel.length.toString() + ' charts');
+ // this will execute the jobs in parallel
+
+ if (!state.running) {
+ NETDATA.timeout.set(state.autoRefresh, 0);
+ }
+ }
+ //else {
+ // console.log('auto-refresher nothing to do');
+ //}
+ }
+
+ // run the next refresh iteration
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.chartRefresherWaitTime()
+ );
+
+ //console.log('chartRefresher() completed in ' + (Date.now() - now).toString() + ' ms');
+};
+
+NETDATA.parseDom = function (callback) {
+ //console.log('parseDom()');
+
+ NETDATA.options.last_page_scroll = Date.now();
+ NETDATA.options.updated_dom = false;
+ NETDATA.chartRefresherRunsAfterParseDom = 0;
+
+ let targets = $('div[data-netdata]'); //.filter(':visible');
+
+ if (NETDATA.options.debug.main_loop) {
+ console.log('DOM updated - there are ' + targets.length + ' charts on page.');
+ }
+
+ NETDATA.intersectionObserver.globalReset();
+ NETDATA.options.targets = [];
+ let len = targets.length;
+ while (len--) {
+ // the initialization will take care of sizing
+ // and the "loading..." message
+ let state = NETDATA.chartState(targets[len]);
+ NETDATA.options.targets.push(state);
+ NETDATA.intersectionObserver.observe(state);
+ }
+
+ if (NETDATA.globalChartUnderlay.isActive()) {
+ NETDATA.globalChartUnderlay.setup();
+ } else {
+ NETDATA.globalChartUnderlay.clear();
+ }
+
+ if (typeof callback === 'function') {
+ return callback();
+ }
+};
+
+// this is the main function - where everything starts
+NETDATA.started = false;
+NETDATA.start = function () {
+ // this should be called only once
+
+ if (NETDATA.started) {
+ console.log('netdata is already started');
+ return;
+ }
+
+ NETDATA.started = true;
+ NETDATA.options.page_is_visible = true;
+
+ $(window).blur(function () {
+ if (NETDATA.options.current.stop_updates_when_focus_is_lost) {
+ NETDATA.options.page_is_visible = false;
+ if (NETDATA.options.debug.focus) {
+ console.log('Lost Focus!');
+ }
+ }
+ });
+
+ $(window).focus(function () {
+ if (NETDATA.options.current.stop_updates_when_focus_is_lost) {
+ NETDATA.options.page_is_visible = true;
+ if (NETDATA.options.debug.focus) {
+ console.log('Focus restored!');
+ }
+ }
+ });
+
+ if (typeof document.hasFocus === 'function' && !document.hasFocus()) {
+ if (NETDATA.options.current.stop_updates_when_focus_is_lost) {
+ NETDATA.options.page_is_visible = false;
+ if (NETDATA.options.debug.focus) {
+ console.log('Document has no focus!');
+ }
+ }
+ }
+
+ // bootstrap tab switching
+ $('a[data-toggle="tab"]').on('shown.bs.tab', NETDATA.onscroll);
+
+ // bootstrap modal switching
+ let $modal = $('.modal');
+ $modal.on('hidden.bs.modal', NETDATA.onscroll);
+ $modal.on('shown.bs.modal', NETDATA.onscroll);
+
+ // bootstrap collapse switching
+ let $collapse = $('.collapse');
+ $collapse.on('hidden.bs.collapse', NETDATA.onscroll);
+ $collapse.on('shown.bs.collapse', NETDATA.onscroll);
+
+ NETDATA.parseDom(NETDATA.chartRefresher);
+
+ // Alarms initialization
+ setTimeout(NETDATA.alarms.init, 1000);
+
+ // Registry initialization
+ setTimeout(NETDATA.registry.init, netdataRegistryAfterMs);
+
+ if (typeof netdataCallback === 'function') {
+ netdataCallback();
+ }
+};
+
+NETDATA.globalReset = function () {
+ NETDATA.intersectionObserver.globalReset();
+ NETDATA.globalSelectionSync.globalReset();
+ NETDATA.globalPanAndZoom.globalReset();
+ NETDATA.chartRegistry.globalReset();
+ NETDATA.commonMin.globalReset();
+ NETDATA.commonMax.globalReset();
+ NETDATA.commonColors.globalReset();
+ NETDATA.unitsConversion.globalReset();
+ NETDATA.options.targets = [];
+ NETDATA.parseDom();
+ NETDATA.unpause();
+};
+
+// Registry of netdata hosts
+
+NETDATA.alarms = {
+ onclick: null, // the callback to handle the click - it will be called with the alarm log entry
+ chart_div_offset: -50, // give that space above the chart when scrolling to it
+ chart_div_id_prefix: 'chart_', // the chart DIV IDs have this prefix (they should be NETDATA.name2id(chart.id))
+ chart_div_animation_duration: 0,// the duration of the animation while scrolling to a chart
+
+ ms_penalty: 0, // the time penalty of the next alarm
+ ms_between_notifications: 500, // firefox moves the alarms off-screen (above, outside the top of the screen)
+ // if alarms are shown faster than: one per 500ms
+
+ update_every: 10000, // the time in ms between alarm checks
+
+ notifications: false, // when true, the browser supports notifications (may not be granted though)
+ last_notification_id: 0, // the id of the last alarm_log we have raised an alarm for
+ first_notification_id: 0, // the id of the first alarm_log entry for this session
+ // this is used to prevent CLEAR notifications for past events
+ // notifications_shown: [],
+
+ server: null, // the server to connect to for fetching alarms
+ current: null, // the list of raised alarms - updated in the background
+
+ // a callback function to call every time the list of raised alarms is refreshed
+ callback: (typeof netdataAlarmsActiveCallback === 'function') ? netdataAlarmsActiveCallback : null,
+
+ // a callback function to call every time a notification is shown
+ // the return value is used to decide if the notification will be shown
+ notificationCallback: (typeof netdataAlarmsNotifCallback === 'function') ? netdataAlarmsNotifCallback : null,
+
+ recipients: null, // the list (array) of recipients to show alarms for, or null
+
+ recipientMatches: function (to_string, wanted_array) {
+ if (typeof wanted_array === 'undefined' || wanted_array === null || Array.isArray(wanted_array) === false) {
+ return true;
+ }
+
+ let r = ' ' + to_string.toString() + ' ';
+ let len = wanted_array.length;
+ while (len--) {
+ if (r.indexOf(' ' + wanted_array[len] + ' ') >= 0) {
+ return true;
+ }
+ }
+
+ return false;
+ },
+
+ activeForRecipients: function () {
+ let active = {};
+ let data = NETDATA.alarms.current;
+
+ if (typeof data === 'undefined' || data === null) {
+ return active;
+ }
+
+ for (let x in data.alarms) {
+ if (!data.alarms.hasOwnProperty(x)) {
+ continue;
+ }
+
+ let alarm = data.alarms[x];
+ if ((alarm.status === 'WARNING' || alarm.status === 'CRITICAL') && NETDATA.alarms.recipientMatches(alarm.recipient, NETDATA.alarms.recipients)) {
+ active[x] = alarm;
+ }
+ }
+
+ return active;
+ },
+
+ notify: function (entry) {
+ // console.log('alarm ' + entry.unique_id);
+
+ if (entry.updated) {
+ // console.log('alarm ' + entry.unique_id + ' has been updated by another alarm');
+ return;
+ }
+
+ let value_string = entry.value_string;
+
+ if (NETDATA.alarms.current !== null) {
+ // get the current value_string
+ let t = NETDATA.alarms.current.alarms[entry.chart + '.' + entry.name];
+ if (typeof t !== 'undefined' && entry.status === t.status && typeof t.value_string !== 'undefined') {
+ value_string = t.value_string;
+ }
+ }
+
+ let name = entry.name.replace(/_/g, ' ');
+ let status = entry.status.toLowerCase();
+ let title = name + ' = ' + value_string.toString();
+ let tag = entry.alarm_id;
+ let icon = 'images/banner-icon-144x144.png';
+ let interaction = false;
+ let data = entry;
+ let show = true;
+
+ // console.log('alarm ' + entry.unique_id + ' ' + entry.chart + '.' + entry.name + ' is ' + entry.status);
+
+ switch (entry.status) {
+ case 'REMOVED':
+ show = false;
+ break;
+
+ case 'UNDEFINED':
+ return;
+
+ case 'UNINITIALIZED':
+ return;
+
+ case 'CLEAR':
+ if (entry.unique_id < NETDATA.alarms.first_notification_id) {
+ // console.log('alarm ' + entry.unique_id + ' is not current');
+ return;
+ }
+ if (entry.old_status === 'UNINITIALIZED' || entry.old_status === 'UNDEFINED') {
+ // console.log('alarm' + entry.unique_id + ' switch to CLEAR from ' + entry.old_status);
+ return;
+ }
+ if (entry.no_clear_notification) {
+ // console.log('alarm' + entry.unique_id + ' is CLEAR but has no_clear_notification flag');
+ return;
+ }
+ title = name + ' back to normal (' + value_string.toString() + ')';
+ icon = 'images/check-mark-2-128-green.png';
+ interaction = false;
+ break;
+
+ case 'WARNING':
+ if (entry.old_status === 'CRITICAL') {
+ status = 'demoted to ' + entry.status.toLowerCase();
+ }
+
+ icon = 'images/alert-128-orange.png';
+ interaction = false;
+ break;
+
+ case 'CRITICAL':
+ if (entry.old_status === 'WARNING') {
+ status = 'escalated to ' + entry.status.toLowerCase();
+ }
+
+ icon = 'images/alert-128-red.png';
+ interaction = true;
+ break;
+
+ default:
+ console.log('invalid alarm status ' + entry.status);
+ return;
+ }
+
+ // filter recipients
+ if (show) {
+ show = NETDATA.alarms.recipientMatches(entry.recipient, NETDATA.alarms.recipients);
+ }
+
+ /*
+ // cleanup old notifications with the same alarm_id as this one
+ // it does not seem to work on any web browser - so notifications cannot be removed
+
+ let len = NETDATA.alarms.notifications_shown.length;
+ while (len--) {
+ let n = NETDATA.alarms.notifications_shown[len];
+ if (n.data.alarm_id === entry.alarm_id) {
+ console.log('removing old alarm ' + n.data.unique_id);
+
+ // close the notification
+ n.close.bind(n);
+
+ // remove it from the array
+ NETDATA.alarms.notifications_shown.splice(len, 1);
+ len = NETDATA.alarms.notifications_shown.length;
+ }
+ }
+ */
+
+ if (show) {
+ if (typeof NETDATA.alarms.notificationCallback === 'function') {
+ show = NETDATA.alarms.notificationCallback(entry);
+ }
+
+ if (show) {
+ setTimeout(function () {
+ // show this notification
+ // console.log('new notification: ' + title);
+ let n = new Notification(title, {
+ body: entry.hostname + ' - ' + entry.chart + ' (' + entry.family + ') - ' + status + ': ' + entry.info,
+ tag: tag,
+ requireInteraction: interaction,
+ icon: NETDATA.serverStatic + icon,
+ data: data
+ });
+
+ n.onclick = function (event) {
+ event.preventDefault();
+ NETDATA.alarms.onclick(event.target.data);
+ };
+
+ // console.log(n);
+ // NETDATA.alarms.notifications_shown.push(n);
+ // console.log(entry);
+ }, NETDATA.alarms.ms_penalty);
+
+ NETDATA.alarms.ms_penalty += NETDATA.alarms.ms_between_notifications;
+ }
+ }
+ },
+
+ scrollToChart: function (chart_id) {
+ if (typeof chart_id === 'string') {
+ let offset = $('#' + NETDATA.alarms.chart_div_id_prefix + NETDATA.name2id(chart_id)).offset();
+ if (typeof offset !== 'undefined') {
+ $('html, body').animate({scrollTop: offset.top + NETDATA.alarms.chart_div_offset}, NETDATA.alarms.chart_div_animation_duration);
+ return true;
+ }
+ }
+ return false;
+ },
+
+ scrollToAlarm: function (alarm) {
+ if (typeof alarm === 'object') {
+ let ret = NETDATA.alarms.scrollToChart(alarm.chart);
+
+ if (ret && NETDATA.options.page_is_visible === false) {
+ window.focus();
+ }
+ // alert('netdata dashboard will now scroll to chart: ' + alarm.chart + '\n\nThis alarm opened to bring the browser window in front of the screen. Click on the dashboard to prevent it from appearing again.');
+ }
+
+ },
+
+ notifyAll: function () {
+ // console.log('FETCHING ALARM LOG');
+ NETDATA.alarms.get_log(NETDATA.alarms.last_notification_id, function (data) {
+ // console.log('ALARM LOG FETCHED');
+
+ if (data === null || typeof data !== 'object') {
+ console.log('invalid alarms log response');
+ return;
+ }
+
+ if (data.length === 0) {
+ console.log('received empty alarm log');
+ return;
+ }
+
+ // console.log('received alarm log of ' + data.length + ' entries, from ' + data[data.length - 1].unique_id.toString() + ' to ' + data[0].unique_id.toString());
+
+ data.sort(function (a, b) {
+ if (a.unique_id > b.unique_id) {
+ return -1;
+ }
+ if (a.unique_id < b.unique_id) {
+ return 1;
+ }
+ return 0;
+ });
+
+ NETDATA.alarms.ms_penalty = 0;
+
+ let len = data.length;
+ while (len--) {
+ if (data[len].unique_id > NETDATA.alarms.last_notification_id) {
+ NETDATA.alarms.notify(data[len]);
+ }
+ //else
+ // console.log('ignoring alarm (older) with id ' + data[len].unique_id.toString());
+ }
+
+ NETDATA.alarms.last_notification_id = data[0].unique_id;
+
+ if (typeof netdataAlarmsRemember === 'undefined' || netdataAlarmsRemember) {
+ NETDATA.localStorageSet('last_notification_id', NETDATA.alarms.last_notification_id, null);
+ }
+ // console.log('last notification id = ' + NETDATA.alarms.last_notification_id);
+ })
+ },
+
+ check_notifications: function () {
+ // returns true if we should fire 1+ notifications
+
+ if (NETDATA.alarms.notifications !== true) {
+ // console.log('web notifications are not available');
+ return false;
+ }
+
+ if (Notification.permission !== 'granted') {
+ // console.log('web notifications are not granted');
+ return false;
+ }
+
+ if (typeof NETDATA.alarms.current !== 'undefined' && typeof NETDATA.alarms.current.alarms === 'object') {
+ // console.log('can do alarms: old id = ' + NETDATA.alarms.last_notification_id + ' new id = ' + NETDATA.alarms.current.latest_alarm_log_unique_id);
+
+ if (NETDATA.alarms.current.latest_alarm_log_unique_id > NETDATA.alarms.last_notification_id) {
+ // console.log('new alarms detected');
+ return true;
+ }
+ //else console.log('no new alarms');
+ }
+ // else console.log('cannot process alarms');
+
+ return false;
+ },
+
+ get: function (what, callback) {
+ $.ajax({
+ url: NETDATA.alarms.server + '/api/v1/alarms?' + what.toString(),
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkOptional('/api/v1/alarms', data /*, '.*\.(calc|calc_parsed|warn|warn_parsed|crit|crit_parsed)$' */);
+
+ if (NETDATA.alarms.first_notification_id === 0 && typeof data.latest_alarm_log_unique_id === 'number') {
+ NETDATA.alarms.first_notification_id = data.latest_alarm_log_unique_id;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(415, NETDATA.alarms.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ update_forever: function () {
+ if (netdataShowAlarms !== true || netdataSnapshotData !== null) {
+ return;
+ }
+
+ NETDATA.alarms.get('active', function (data) {
+ if (data !== null) {
+ NETDATA.alarms.current = data;
+
+ if (NETDATA.alarms.check_notifications()) {
+ NETDATA.alarms.notifyAll();
+ }
+
+ if (typeof NETDATA.alarms.callback === 'function') {
+ NETDATA.alarms.callback(data);
+ }
+
+ // Health monitoring is disabled on this netdata
+ if (data.status === false) {
+ return;
+ }
+ }
+
+ setTimeout(NETDATA.alarms.update_forever, NETDATA.alarms.update_every);
+ });
+ },
+
+ get_log: function (last_id, callback) {
+ // console.log('fetching all log after ' + last_id.toString());
+ $.ajax({
+ url: NETDATA.alarms.server + '/api/v1/alarm_log?after=' + last_id.toString(),
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkOptional('/api/v1/alarm_log', data);
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(416, NETDATA.alarms.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ init: function () {
+ NETDATA.alarms.server = NETDATA.fixHost(NETDATA.serverDefault);
+
+ if (typeof netdataAlarmsRemember === 'undefined' || netdataAlarmsRemember) {
+ NETDATA.alarms.last_notification_id =
+ NETDATA.localStorageGet('last_notification_id', NETDATA.alarms.last_notification_id, null);
+ }
+
+ if (NETDATA.alarms.onclick === null) {
+ NETDATA.alarms.onclick = NETDATA.alarms.scrollToAlarm;
+ }
+
+ if (typeof netdataAlarmsRecipients !== 'undefined' && Array.isArray(netdataAlarmsRecipients)) {
+ NETDATA.alarms.recipients = netdataAlarmsRecipients;
+ }
+
+ if (netdataShowAlarms) {
+ NETDATA.alarms.update_forever();
+
+ if ('Notification' in window) {
+ // console.log('notifications available');
+ NETDATA.alarms.notifications = true;
+
+ if (Notification.permission === 'default') {
+ Notification.requestPermission();
+ }
+ }
+ }
+ }
+};
+
+// Registry of netdata hosts
+
+NETDATA.registry = {
+ server: null, // the netdata registry server
+ isCloudEnabled: false,// is netdata.cloud functionality enabled?
+ cloudBaseURL: null, // the netdata cloud base url
+ person_guid: null, // the unique ID of this browser / user
+ machine_guid: null, // the unique ID the netdata server that served dashboard.js
+ hostname: 'unknown', // the hostname of the netdata server that served dashboard.js
+ machines: null, // the user's other URLs
+ machines_array: null, // the user's other URLs in an array
+ person_urls: null,
+ anonymous_statistics_checked: false,
+ MASKED_DATA: "***",
+
+ isUsingGlobalRegistry: function() {
+ return NETDATA.registry.server == "https://registry.my-netdata.io";
+ },
+
+ isRegistryEnabled: function() {
+ return !(NETDATA.registry.isUsingGlobalRegistry() || isSignedIn())
+ },
+
+ parsePersonUrls: function (person_urls) {
+ NETDATA.registry.person_urls = person_urls;
+
+ if (person_urls) {
+ NETDATA.registry.machines = {};
+ NETDATA.registry.machines_array = [];
+
+ let apu = person_urls;
+ let i = apu.length;
+ while (i--) {
+ if (typeof NETDATA.registry.machines[apu[i][0]] === 'undefined') {
+ // console.log('adding: ' + apu[i][4] + ', ' + ((now - apu[i][2]) / 1000).toString());
+
+ let obj = {
+ guid: apu[i][0],
+ url: apu[i][1],
+ last_t: apu[i][2],
+ accesses: apu[i][3],
+ name: apu[i][4],
+ alternate_urls: []
+ };
+ obj.alternate_urls.push(apu[i][1]);
+
+ NETDATA.registry.machines[apu[i][0]] = obj;
+ NETDATA.registry.machines_array.push(obj);
+ } else {
+ // console.log('appending: ' + apu[i][4] + ', ' + ((now - apu[i][2]) / 1000).toString());
+
+ let pu = NETDATA.registry.machines[apu[i][0]];
+ if (pu.last_t < apu[i][2]) {
+ pu.url = apu[i][1];
+ pu.last_t = apu[i][2];
+ pu.name = apu[i][4];
+ }
+ pu.accesses += apu[i][3];
+ pu.alternate_urls.push(apu[i][1]);
+ }
+ }
+ }
+
+ if (typeof netdataRegistryCallback === 'function') {
+ netdataRegistryCallback(NETDATA.registry.machines_array);
+ }
+ },
+
+ init: function () {
+ if (netdataRegistry !== true) {
+ return;
+ }
+
+ NETDATA.registry.hello(NETDATA.serverDefault, function (data) {
+ if (data) {
+ NETDATA.registry.server = data.registry;
+ if (data.cloud_base_url !== "") {
+ NETDATA.registry.isCloudEnabled = true;
+ NETDATA.registry.cloudBaseURL = data.cloud_base_url;
+ } else {
+ NETDATA.registry.isCloudEnabled = false;
+ NETDATA.registry.cloudBaseURL = "";
+ }
+ NETDATA.registry.machine_guid = data.machine_guid;
+ NETDATA.registry.hostname = data.hostname;
+ if (!NETDATA.registry.anonymous_statistics_checked) {
+ NETDATA.registry.anonymous_statistics_checked=true;
+ if (data.anonymous_statistics) {
+ (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+ new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+ j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=false;j.src=
+ 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+ })(window,document,'script','dataLayer','GTM-N6CBMJD');
+ dataLayer.push({"anonymous_statistics" : "true", "machine_guid" : data.machine_guid});
+ }
+ }
+ NETDATA.registry.access(2, function (person_urls) {
+ NETDATA.registry.parsePersonUrls(person_urls);
+ });
+ }
+ });
+ },
+
+ hello: function (host, callback) {
+ host = NETDATA.fixHost(host);
+
+ // send HELLO to a netdata server:
+ // 1. verifies the server is reachable
+ // 2. responds with the registry URL, the machine GUID of this netdata server and its hostname
+ $.ajax({
+ url: host + '/api/v1/registry?action=hello',
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkOptional('/api/v1/registry?action=hello', data);
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(408, host + ' response: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(407, host);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ access: function (max_redirects, callback) {
+ let name = NETDATA.registry.MASKED_DATA;
+ let url = NETDATA.registry.MASKED_DATA;
+
+ if (!NETDATA.registry.isUsingGlobalRegistry()) {
+ // If the user is using a private registry keep sending identifiable
+ // data.
+ name = NETDATA.registry.hostname;
+ url = NETDATA.serverDefault;
+ }
+
+ console.log("ACCESS", name, url);
+
+ // send ACCESS to a netdata registry:
+ // 1. it lets it know we are accessing a netdata server (its machine GUID and its URL)
+ // 2. it responds with a list of netdata servers we know
+ // the registry identifies us using a cookie it sets the first time we access it
+ // the registry may respond with a redirect URL to send us to another registry
+ $.ajax({
+ url: NETDATA.registry.server + '/api/v1/registry?action=access&machine=' + NETDATA.registry.machine_guid + '&name=' + encodeURIComponent(name) + '&url=' + encodeURIComponent(url), // + '&visible_url=' + encodeURIComponent(document.location),
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkAlways('/api/v1/registry?action=access', data);
+
+ let redirect = null;
+ if (typeof data.registry === 'string') {
+ redirect = data.registry;
+ }
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(409, NETDATA.registry.server + ' responded with: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (data === null) {
+ if (redirect !== null && max_redirects > 0) {
+ NETDATA.registry.server = redirect;
+ NETDATA.registry.access(max_redirects - 1, callback);
+ }
+ else {
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ }
+ } else {
+ if (typeof data.person_guid === 'string') {
+ NETDATA.registry.person_guid = data.person_guid;
+ }
+
+ if (typeof callback === 'function') {
+ const urls = data.urls.filter((u) => u[1] !== NETDATA.registry.MASKED_DATA);
+ return callback(urls);
+ }
+ }
+ })
+ .fail(function () {
+ NETDATA.error(410, NETDATA.registry.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ delete: function (delete_url, callback) {
+ // send DELETE to a netdata registry:
+ $.ajax({
+ url: NETDATA.registry.server + '/api/v1/registry?action=delete&machine=' + NETDATA.registry.machine_guid + '&name=' + encodeURIComponent(NETDATA.registry.hostname) + '&url=' + encodeURIComponent(NETDATA.serverDefault) + '&delete_url=' + encodeURIComponent(delete_url),
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkAlways('/api/v1/registry?action=delete', data);
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(411, NETDATA.registry.server + ' responded with: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(412, NETDATA.registry.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ search: function (machine_guid, callback) {
+ // SEARCH for the URLs of a machine:
+ $.ajax({
+ url: NETDATA.registry.server + '/api/v1/registry?action=search&machine=' + NETDATA.registry.machine_guid + '&name=' + encodeURIComponent(NETDATA.registry.hostname) + '&url=' + encodeURIComponent(NETDATA.serverDefault) + '&for=' + machine_guid,
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkAlways('/api/v1/registry?action=search', data);
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(417, NETDATA.registry.server + ' responded with: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(418, NETDATA.registry.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ switch: function (new_person_guid, callback) {
+ // impersonate
+ $.ajax({
+ url: NETDATA.registry.server + '/api/v1/registry?action=switch&machine=' + NETDATA.registry.machine_guid + '&name=' + encodeURIComponent(NETDATA.registry.hostname) + '&url=' + encodeURIComponent(NETDATA.serverDefault) + '&to=' + new_person_guid,
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkAlways('/api/v1/registry?action=switch', data);
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(413, NETDATA.registry.server + ' responded with: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(414, NETDATA.registry.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ }
+};
+
+// Load required JS libraries and CSS
+
+NETDATA.requiredJs = [
+ {
+ url: NETDATA.serverStatic + 'lib/bootstrap-3.3.7.min.js',
+ async: false,
+ isAlreadyLoaded: function () {
+ // check if bootstrap is loaded
+ if (typeof $().emulateTransitionEnd === 'function') {
+ return true;
+ } else {
+ return typeof netdataNoBootstrap !== 'undefined' && netdataNoBootstrap;
+ }
+ }
+ },
+ {
+ url: NETDATA.serverStatic + 'lib/fontawesome-all-5.0.1.min.js',
+ async: true,
+ isAlreadyLoaded: function () {
+ return typeof netdataNoFontAwesome !== 'undefined' && netdataNoFontAwesome;
+ }
+ },
+ {
+ url: NETDATA.serverStatic + 'lib/perfect-scrollbar-0.6.15.min.js',
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ }
+];
+
+NETDATA.requiredCSS = [
+ {
+ url: NETDATA.themes.current.bootstrap_css,
+ isAlreadyLoaded: function () {
+ return typeof netdataNoBootstrap !== 'undefined' && netdataNoBootstrap;
+ }
+ },
+ {
+ url: NETDATA.themes.current.dashboard_css,
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ }
+];
+
+NETDATA.loadedRequiredJs = 0;
+NETDATA.loadRequiredJs = function (index, callback) {
+ if (index >= NETDATA.requiredJs.length) {
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ return;
+ }
+
+ if (NETDATA.requiredJs[index].isAlreadyLoaded()) {
+ NETDATA.loadedRequiredJs++;
+ NETDATA.loadRequiredJs(++index, callback);
+ return;
+ }
+
+ if (NETDATA.options.debug.main_loop) {
+ console.log('loading ' + NETDATA.requiredJs[index].url);
+ }
+
+ let async = true;
+ if (typeof NETDATA.requiredJs[index].async !== 'undefined' && NETDATA.requiredJs[index].async === false) {
+ async = false;
+ }
+
+ $.ajax({
+ url: NETDATA.requiredJs[index].url,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('loaded ' + NETDATA.requiredJs[index].url);
+ }
+ })
+ .fail(function () {
+ alert('Cannot load required JS library: ' + NETDATA.requiredJs[index].url);
+ })
+ .always(function () {
+ NETDATA.loadedRequiredJs++;
+
+ // if (async === false)
+ if (!async) {
+ NETDATA.loadRequiredJs(++index, callback);
+ }
+ });
+
+ // if (async === true)
+ if (async) {
+ NETDATA.loadRequiredJs(++index, callback);
+ }
+};
+
+NETDATA.loadRequiredCSS = function (index) {
+ if (index >= NETDATA.requiredCSS.length) {
+ return;
+ }
+
+ if (NETDATA.requiredCSS[index].isAlreadyLoaded()) {
+ NETDATA.loadRequiredCSS(++index);
+ return;
+ }
+
+ if (NETDATA.options.debug.main_loop) {
+ console.log('loading ' + NETDATA.requiredCSS[index].url);
+ }
+
+ NETDATA._loadCSS(NETDATA.requiredCSS[index].url);
+ NETDATA.loadRequiredCSS(++index);
+};
+
+// Boot it!
+
+if (typeof netdataPrepCallback === 'function') {
+ netdataPrepCallback();
+}
+
+NETDATA.errorReset();
+NETDATA.loadRequiredCSS(0);
+
+NETDATA._loadjQuery(function () {
+ NETDATA.loadRequiredJs(0, function () {
+ if (typeof $().emulateTransitionEnd !== 'function') {
+ // bootstrap is not available
+ NETDATA.options.current.show_help = false;
+ }
+
+ if (typeof netdataDontStart === 'undefined' || !netdataDontStart) {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('starting chart refresh thread');
+ }
+
+ NETDATA.start();
+ }
+ });
+});
+})(window, document, (typeof jQuery === 'function')?jQuery:undefined);
diff --git a/applications/luci-app-netdata/root/usr/share/netdata/webcn/dashboard_info.js b/applications/luci-app-netdata/root/usr/share/netdata/webcn/dashboard_info.js
new file mode 100755
index 0000000..72bbfa2
--- /dev/null
+++ b/applications/luci-app-netdata/root/usr/share/netdata/webcn/dashboard_info.js
@@ -0,0 +1,3844 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// Codacy declarations
+/* global NETDATA */
+
+var netdataDashboard = window.netdataDashboard || {};
+
+// Informational content for the various sections of the GUI (menus, sections, charts, etc.)
+
+// ----------------------------------------------------------------------------
+// Menus
+
+netdataDashboard.menu = {
+ 'system': {
+ title: '系统概观',
+ icon: '<i class="fas fa-bookmark"></i>',
+ info: '一眼掌握系统效能关键指标。'
+ },
+
+ 'services': {
+ title: '系统服务',
+ icon: '<i class="fas fa-cogs"></i>',
+ info: '系统服务的使用情况。netdata 以 CGROUPS 监视所有系统服务。'
+ },
+
+ 'ap': {
+ title: 'Access Points',
+ icon: '<i class="fas fa-wifi"></i>',
+ info: 'Performance metrics for the access points (i.e. wireless interfaces in AP mode) found on the system.'
+ },
+
+ 'tc': {
+ title: 'Quality of Service',
+ icon: '<i class="fas fa-globe"></i>',
+ info: 'Netdata collects and visualizes <code>tc</code> class utilization using its ' +
+ '<a href="https://github.com/netdata/netdata/blob/master/collectors/tc.plugin/tc-qos-helper.sh.in" target="_blank">tc-helper plugin</a>. ' +
+ 'If you also use <a href="http://firehol.org/#fireqos" target="_blank">FireQOS</a> for setting up QoS, ' +
+ 'netdata automatically collects interface and class names. If your QoS configuration includes overheads ' +
+ 'calculation, the values shown here will include these overheads (the total bandwidth for the same ' +
+ 'interface as reported in the Network Interfaces section, will be lower than the total bandwidth ' +
+ 'reported here). QoS data collection may have a slight time difference compared to the interface ' +
+ '(QoS data collection uses a BASH script, so a shift in data collection of a few milliseconds ' +
+ 'should be justified).'
+ },
+
+ 'net': {
+ title: '网络接口',
+ icon: '<i class="fas fa-sitemap"></i>',
+ info: '网路介面的效能指标。'
+ },
+
+ 'wireless': {
+ title: '无线接口',
+ icon: '<i class="fas fa-wifi"></i>',
+ info: '无线接口的性能指标。'
+ },
+
+ 'ip': {
+ title: '网络堆栈',
+ icon: '<i class="fas fa-cloud"></i>',
+ info: function (os) {
+ if(os === "linux")
+ return 'Metrics for the networking stack of the system. These metrics are collected from <code>/proc/net/netstat</code>, apply to both IPv4 and IPv6 traffic and are related to operation of the kernel networking stack.';
+ else
+ return 'Metrics for the networking stack of the system.';
+ }
+ },
+
+ 'ipv4': {
+ title: 'IPv4网路',
+ icon: '<i class="fas fa-cloud"></i>',
+ info: 'IPv4效能指标。' +
+ '<a href="https://en.wikipedia.org/wiki/IPv4" target="_blank">Internet Protocol version 4 (IPv4)</a> is ' +
+ 'the fourth version of the Internet Protocol (IP). It is one of the core protocols of standards-based ' +
+ 'internetworking methods in the Internet. IPv4 is a connectionless protocol for use on packet-switched ' +
+ 'networks. It operates on a best effort delivery model, in that it does not guarantee delivery, nor does ' +
+ 'it assure proper sequencing or avoidance of duplicate delivery. These aspects, including data integrity, ' +
+ 'are addressed by an upper layer transport protocol, such as the Transmission Control Protocol (TCP).'
+ },
+
+ 'ipv6': {
+ title: 'IPv6网路',
+ icon: '<i class="fas fa-cloud"></i>',
+ info: 'IPv6效能指标。 <a href="https://en.wikipedia.org/wiki/IPv6" target="_blank">Internet Protocol version 6 (IPv6)</a> is the most recent version of the Internet Protocol (IP), the communications protocol that provides an identification and location system for computers on networks and routes traffic across the Internet. IPv6 was developed by the Internet Engineering Task Force (IETF) to deal with the long-anticipated problem of IPv4 address exhaustion. IPv6 is intended to replace IPv4.'
+ },
+
+ 'sctp': {
+ title: 'SCTP 网路',
+ icon: '<i class="fas fa-cloud"></i>',
+ info: '<a href="https://en.wikipedia.org/wiki/Stream_Control_Transmission_Protocol" target="_blank">Stream Control Transmission Protocol (SCTP)</a> is a computer network protocol which operates at the transport layer and serves a role similar to the popular protocols TCP and UDP. SCTP provides some of the features of both UDP and TCP: it is message-oriented like UDP and ensures reliable, in-sequence transport of messages with congestion control like TCP. It differs from those protocols by providing multi-homing and redundant paths to increase resilience and reliability.'
+ },
+
+ 'ipvs': {
+ title: 'IP 虚拟服务器',
+ icon: '<i class="fas fa-eye"></i>',
+ info: '<a href="http://www.linuxvirtualserver.org/software/ipvs.html" target="_blank">IPVS (IP Virtual Server)</a> implements transport-layer load balancing inside the Linux kernel, so called Layer-4 switching. IPVS running on a host acts as a load balancer at the front of a cluster of real servers, it can direct requests for TCP/UDP based services to the real servers, and makes services of the real servers to appear as a virtual service on a single IP address.'
+ },
+
+ 'netfilter': {
+ title: '防火墙 (netfilter)',
+ icon: '<i class="fas fa-shield-alt"></i>',
+ info: 'netfilter组件的性能指标。'
+ },
+
+ 'ipfw': {
+ title: '防火墙(ipfw)',
+ icon: '<i class="fas fa-shield-alt"></i>',
+ info: 'ipfw规则的计数器和内存使用情况。'
+ },
+
+ 'cpu': {
+ title: 'CPUs',
+ icon: '<i class="fas fa-bolt"></i>',
+ info: '系统中每一个 CPU 的详细资讯。全部 CPU 的总量可以到 <a href="#menu_system">系统概观</a> 区段查看。'
+ },
+
+ 'mem': {
+ title: '记忆体',
+ icon: '<i class="fas fa-microchip"></i>',
+ info: '系统记忆体管理的详细资讯。'
+ },
+
+ 'disk': {
+ title: '磁碟',
+ icon: '<i class="fas fa-hdd"></i>',
+ info: '系统中所有磁碟效能资讯图表。特别留意：这是以 <code>iostat -x</code> 所取得的效能数据做为呈现。在预设情况下，netdata 不会显示单一分割区与未挂载的虚拟磁碟效能图表。若仍想要显示，可以修改 netdata 设定档中的相关设定。'
+ },
+
+ 'sensors': {
+ title: '感测器',
+ icon: '<i class="fas fa-leaf"></i>',
+ info: '系统已配置相关感测器的读数'
+ },
+
+ 'ipmi': {
+ title: 'IPMI',
+ icon: '<i class="fas fa-leaf"></i>',
+ info: 'The Intelligent Platform Management Interface (IPMI) is a set of computer interface specifications for an autonomous computer subsystem that provides management and monitoring capabilities independently of the host system\'s CPU, firmware (BIOS or UEFI) and operating system.'
+ },
+
+ 'samba': {
+ title: 'Samba',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'Performance metrics of the Samba file share operations of this system. Samba is a implementation of Windows services, including Windows SMB protocol file shares.'
+ },
+
+ 'nfsd': {
+ title: 'NFS服器器',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'Performance metrics of the Network File Server. NFS is a distributed file system protocol, allowing a user on a client computer to access files over a network, much like local storage is accessed. NFS, like many other protocols, builds on the Open Network Computing Remote Procedure Call (ONC RPC) system. The NFS is an open standard defined in Request for Comments (RFC).'
+ },
+
+ 'nfs': {
+ title: 'NFS客户端',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: '显示本机做为 NFS 客户端的效能指标。'
+ },
+
+ 'zfs': {
+ title: 'ZFS文件系统',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'ZFS档案系统的效能指标。以下图表呈现来自 <a href="https://github.com/zfsonlinux/zfs/blob/master/cmd/arcstat/arcstat.py" target="_blank">arcstat.py</a> 与 <a href="https://github.com/zfsonlinux/zfs/blob/master/cmd/arc_summary/arc_summary.py" target="_blank">arc_summary.py</a> 的效能数据。'
+ },
+
+ 'btrfs': {
+ title: 'BTRFS文件系统',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'BTRFS 档案系统磁碟空间使用指标。'
+ },
+
+ 'apps': {
+ title: '应用程序',
+ icon: '<i class="fas fa-heartbeat"></i>',
+ info: 'Per application statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through all processes and aggregates statistics for applications of interest, defined in <code>/etc/netdata/apps_groups.conf</code>, which can be edited by running <code>$ /etc/netdata/edit-config apps_groups.conf</code> (the default is <a href="https://github.com/netdata/netdata/blob/master/collectors/apps.plugin/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: '用户',
+ icon: '<i class="fas fa-user"></i>',
+ info: 'Per user statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through all processes 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: '用户组',
+ icon: '<i class="fas fa-users"></i>',
+ info: 'Per user group statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through all processes 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
+ },
+
+ 'netdata': {
+ title: 'Netdata监视',
+ icon: '<i class="fas fa-chart-bar"></i>',
+ info: 'netdata本身与外挂程式的效能数据。'
+ },
+
+ 'aclk_test': {
+ title: 'ACLK试验发报',
+ info: '用于内部执行集成测试。'
+ },
+
+ 'example': {
+ title: '范例图表',
+ info: '范例图表，展示外挂程式的架构之用。'
+ },
+
+ 'cgroup': {
+ title: '',
+ icon: '<i class="fas fa-th"></i>',
+ info: '容器资源使用率指标。netdata 从 <b>cgroups</b> (<b>control groups</b> 的缩写) 中读取这些资讯，cgroups 是 Linux 核心的一个功能，做限制与计算程序集中的资源使用率 (CPU、记忆体、磁碟 I/O、网路...等等)。<b>cgroups</b> 与 <b>namespaces</b> (程序之间的隔离) 结合提供了我们所说的：<b>容器</b>。'
+ },
+
+ 'cgqemu': {
+ title: '',
+ icon: '<i class="fas fa-th-large"></i>',
+ info: 'QEMU 虚拟机资源使用率效能指标。QEMU (Quick Emulator) 是自由与开源的虚拟机器平台，提供硬体虚拟化功能。'
+ },
+
+ 'fping': {
+ title: 'fping',
+ icon: '<i class="fas fa-exchange-alt"></i>',
+ info: 'Network latency statistics, via <b>fping</b>. <b>fping</b> is a program to send ICMP echo probes to network hosts, similar to <code>ping</code>, but much better performing when pinging multiple hosts. fping versions after 3.15 can be directly used as netdata plugins.'
+ },
+
+ 'gearman': {
+ title: 'Gearman',
+ icon: '<i class="fas fa-tasks"></i>',
+ info: 'Gearman is a job server that allows you to do work in parallel, to load balance processing, and to call functions between languages.'
+ },
+
+ 'ioping': {
+ title: 'ioping',
+ icon: '<i class="fas fa-exchange-alt"></i>',
+ info: 'Disk latency statistics, via <b>ioping</b>. <b>ioping</b> is a program to read/write data probes from/to a disk.'
+ },
+
+ 'httpcheck': {
+ title: 'Http Check',
+ icon: '<i class="fas fa-heartbeat"></i>',
+ info: 'Web Service availability and latency monitoring using HTTP checks. This plugin is a specialized version of the port check plugin.'
+ },
+
+ 'memcached': {
+ title: 'memcached',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>memcached</b>. Memcached is a general-purpose distributed memory caching system. It is often used to speed up dynamic database-driven websites by caching data and objects in RAM to reduce the number of times an external data source (such as a database or API) must be read.'
+ },
+
+ 'monit': {
+ title: 'monit',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Statuses of checks in <b>monit</b>. Monit is a utility for managing and monitoring processes, programs, files, directories and filesystems on a Unix system. Monit conducts automatic maintenance and repair and can execute meaningful causal actions in error situations.'
+ },
+
+ 'mysql': {
+ title: 'MySQL',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>mysql</b>, the open-source relational database management system (RDBMS).'
+ },
+
+ 'postgres': {
+ title: 'Postgres',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>PostgresSQL</b>, the object-relational database (ORDBMS).'
+ },
+
+ 'redis': {
+ title: 'Redis',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>redis</b>. Redis (REmote DIctionary Server) is a software project that implements data structure servers. It is open-source, networked, in-memory, and stores keys with optional durability.'
+ },
+
+ 'rethinkdbs': {
+ title: 'RethinkDB',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>rethinkdb</b>. RethinkDB is the first open-source scalable database built for realtime applications'
+ },
+
+ 'retroshare': {
+ title: 'RetroShare',
+ icon: '<i class="fas fa-share-alt"></i>',
+ info: 'Performance metrics for <b>RetroShare</b>. RetroShare is open source software for encrypted filesharing, serverless email, instant messaging, online chat, and BBS, based on a friend-to-friend network built on GNU Privacy Guard (GPG).'
+ },
+
+ 'riakkv': {
+ title: 'Riak KV',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Metrics for <b>Riak KV</b>, the distributed key-value store.'
+ },
+
+ 'ipfs': {
+ title: 'IPFS',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'Performance metrics for the InterPlanetary File System (IPFS), a content-addressable, peer-to-peer hypermedia distribution protocol.'
+ },
+
+ 'phpfpm': {
+ title: 'PHP-FPM',
+ icon: '<i class="fas fa-eye"></i>',
+ info: 'Performance metrics for <b>PHP-FPM</b>, an alternative FastCGI implementation for PHP.'
+ },
+
+ 'pihole': {
+ title: 'Pi-hole',
+ icon: '<i class="fas fa-ban"></i>',
+ info: 'Metrics for <a href="https://pi-hole.net/" target="_blank">Pi-hole</a>, a black hole for Internet advertisements.' +
+ ' The metrics returned by Pi-Hole API is all from the last 24 hours.'
+ },
+
+ 'portcheck': {
+ title: 'Port Check',
+ icon: '<i class="fas fa-heartbeat"></i>',
+ info: 'Service availability and latency monitoring using port checks.'
+ },
+
+ 'postfix': {
+ title: 'postfix',
+ icon: '<i class="fas fa-envelope"></i>',
+ info: undefined
+ },
+
+ 'dovecot': {
+ title: 'Dovecot',
+ icon: '<i class="fas fa-envelope"></i>',
+ info: undefined
+ },
+
+ 'hddtemp': {
+ title: 'HDD Temp',
+ icon: '<i class="fas fa-thermometer-half"></i>',
+ info: undefined
+ },
+
+ 'nginx': {
+ title: 'nginx',
+ icon: '<i class="fas fa-eye"></i>',
+ info: undefined
+ },
+
+ 'apache': {
+ title: 'Apache',
+ icon: '<i class="fas fa-eye"></i>',
+ info: undefined
+ },
+
+ 'lighttpd': {
+ title: 'Lighttpd',
+ icon: '<i class="fas fa-eye"></i>',
+ info: undefined
+ },
+
+ 'web_log': {
+ title: undefined,
+ icon: '<i class="fas fa-file-alt"></i>',
+ info: 'Information extracted from a server log file. <code>web_log</code> plugin incrementally parses the server log file to provide, in real-time, a break down of key server performance metrics. For web servers, an extended log file format may optionally be used (for <code>nginx</code> and <code>apache</code>) offering timing information and bandwidth for both requests and responses. <code>web_log</code> plugin may also be configured to provide a break down of requests per URL pattern (check <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/web_log/web_log.conf" target="_blank"><code>/etc/netdata/python.d/web_log.conf</code></a>).'
+ },
+
+ 'named': {
+ title: 'named',
+ icon: '<i class="fas fa-tag"></i>',
+ info: undefined
+ },
+
+ 'squid': {
+ title: 'squid',
+ icon: '<i class="fas fa-exchange-alt"></i>',
+ info: undefined
+ },
+
+ 'nut': {
+ title: 'UPS',
+ icon: '<i class="fas fa-battery-half"></i>',
+ info: undefined
+ },
+
+ 'apcupsd': {
+ title: 'UPS',
+ icon: '<i class="fas fa-battery-half"></i>',
+ info: undefined
+ },
+
+ 'smawebbox': {
+ title: 'Solar Power',
+ icon: '<i class="fas fa-sun"></i>',
+ info: undefined
+ },
+
+ 'fronius': {
+ title: 'Fronius',
+ icon: '<i class="fas fa-sun"></i>',
+ info: undefined
+ },
+
+ 'stiebeleltron': {
+ title: 'Stiebel Eltron',
+ icon: '<i class="fas fa-thermometer-half"></i>',
+ info: undefined
+ },
+
+ 'snmp': {
+ title: 'SNMP',
+ icon: '<i class="fas fa-random"></i>',
+ info: undefined
+ },
+
+ 'go_expvar': {
+ title: 'Go - expvars',
+ icon: '<i class="fas fa-eye"></i>',
+ info: 'Statistics about running Go applications exposed by the <a href="https://golang.org/pkg/expvar/" target="_blank">expvar package</a>.'
+ },
+
+ 'chrony': {
+ icon: '<i class="fas fa-clock"></i>',
+ info: 'chronyd parameters about the system’s clock performance.'
+ },
+
+ 'couchdb': {
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b><a href="https://couchdb.apache.org/">CouchDB</a></b>, the open-source, JSON document-based database with an HTTP API and multi-master replication.'
+ },
+
+ 'beanstalk': {
+ title: 'Beanstalkd',
+ icon: '<i class="fas fa-tasks"></i>',
+ info: 'Provides statistics on the <b><a href="http://kr.github.io/beanstalkd/">beanstalkd</a></b> server and any tubes available on that server using data pulled from beanstalkc'
+ },
+
+ 'rabbitmq': {
+ title: 'RabbitMQ',
+ icon: '<i class="fas fa-comments"></i>',
+ info: 'Performance data for the <b><a href="https://www.rabbitmq.com/">RabbitMQ</a></b> open-source message broker.'
+ },
+
+ 'ceph': {
+ title: 'Ceph',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Provides statistics on the <b><a href="http://ceph.com/">ceph</a></b> cluster server, the open-source distributed storage system.'
+ },
+
+ 'ntpd': {
+ title: 'ntpd',
+ icon: '<i class="fas fa-clock"></i>',
+ info: 'Provides statistics for the internal variables of the Network Time Protocol daemon <b><a href="http://www.ntp.org/">ntpd</a></b> and optional including the configured peers (if enabled in the module configuration). The module presents the performance metrics as shown by <b><a href="http://doc.ntp.org/current-stable/ntpq.html">ntpq</a></b> (the standard NTP query program) using NTP mode 6 UDP packets to communicate with the NTP server.'
+ },
+
+ 'spigotmc': {
+ title: 'Spigot MC',
+ icon: '<i class="fas fa-eye"></i>',
+ info: 'Provides basic performance statistics for the <b><a href="https://www.spigotmc.org/">Spigot Minecraft</a></b> server.'
+ },
+
+ 'unbound': {
+ title: 'Unbound',
+ icon: '<i class="fas fa-tag"></i>',
+ info: undefined
+ },
+
+ 'boinc': {
+ title: 'BOINC',
+ icon: '<i class="fas fa-microchip"></i>',
+ info: 'Provides task counts for <b><a href="http://boinc.berkeley.edu/">BOINC</a></b> distributed computing clients.'
+ },
+
+ 'w1sensor': {
+ title: '1-Wire Sensors',
+ icon: '<i class="fas fa-thermometer-half"></i>',
+ info: 'Data derived from <a href="https://en.wikipedia.org/wiki/1-Wire">1-Wire</a> sensors. Currently temperature sensors are automatically detected.'
+ },
+
+ 'logind': {
+ title: 'Logind',
+ icon: '<i class="fas fa-user"></i>',
+ info: undefined
+ },
+
+ 'powersupply': {
+ title: 'Power Supply',
+ icon: '<i class="fas fa-battery-half"></i>',
+ info: 'Statistics for the various system power supplies. Data collected from <a href="https://www.kernel.org/doc/Documentation/power/power_supply_class.txt">Linux power supply class</a>.'
+ },
+
+ 'xenstat': {
+ title: 'Xen Node',
+ icon: '<i class="fas fa-server"></i>',
+ info: 'General statistics for the Xen node. Data collected using <b>xenstat</b> library</a>.'
+ },
+
+ 'xendomain': {
+ title: '',
+ icon: '<i class="fas fa-th-large"></i>',
+ info: 'Xen domain resource utilization metrics. Netdata reads this information using <b>xenstat</b> library which gives access to the resource usage information (CPU, memory, disk I/O, network) for a virtual machine.'
+ },
+
+ 'wmi': {
+ title: 'wmi',
+ icon: '<i class="fas fa-server"></i>',
+ info: undefined
+ },
+
+ 'perf': {
+ title: 'Perf Counters',
+ icon: '<i class="fas fa-tachometer-alt"></i>',
+ info: 'Performance Monitoring Counters (PMC). Data collected using <b>perf_event_open()</b> system call which utilises Hardware Performance Monitoring Units (PMU).'
+ },
+
+ 'vsphere': {
+ title: 'vSphere',
+ icon: '<i class="fas fa-server"></i>',
+ info: 'Performance statistics for ESXI hosts and virtual machines. Data collected from <a href="https://www.vmware.com/products/vcenter-server.html">VMware vCenter Server</a> using <code><a href="https://github.com/vmware/govmomi"> govmomi</a></code> library.'
+ },
+
+ 'vcsa': {
+ title: 'VCSA',
+ icon: '<i class="fas fa-server"></i>',
+ info: 'vCenter Server Appliance health statistics. Data collected from <a href="https://vmware.github.io/vsphere-automation-sdk-rest/vsphere/index.html#SVC_com.vmware.appliance.health">Health API</a>.'
+ },
+
+ 'zookeeper': {
+ title: 'Zookeeper',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Provides health statistics for <b><a href="https://zookeeper.apache.org/">Zookeeper</a></b> server. Data collected through the command port using <code><a href="https://zookeeper.apache.org/doc/r3.5.5/zookeeperAdmin.html#sc_zkCommands">mntr</a></code> command.'
+ },
+
+ 'hdfs': {
+ title: 'HDFS',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'Provides <b><a href="https://hadoop.apache.org/docs/r3.2.0/hadoop-project-dist/hadoop-hdfs/HdfsDesign.html">Hadoop Distributed File System</a></b> performance statistics. Module collects metrics over <code>Java Management Extensions</code> through the web interface of an <code>HDFS</code> daemon.'
+ },
+
+ 'am2320': {
+ title: 'AM2320 Sensor',
+ icon: '<i class="fas fa-thermometer-half"></i>',
+ info: 'Readings from the external AM2320 Sensor.'
+ },
+
+ 'scaleio': {
+ title: 'ScaleIO',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance and health statistics for various ScaleIO components. Data collected via VxFlex OS Gateway REST API.'
+ },
+
+ 'squidlog': {
+ title: 'Squid log',
+ icon: '<i class="fas fa-file-alt"></i>',
+ info: undefined
+ },
+
+ 'cockroachdb': {
+ title: 'CockroachDB',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance and health statistics for various <code>CockroachDB</code> components.'
+ },
+
+ 'ebpf': {
+ title: 'eBPF',
+ icon: '<i class="fas fa-heartbeat"></i>',
+ info: 'Monitor system calls, internal functions, bytes read, bytes written and errors using <code>eBPF</code>.'
+ },
+
+ 'vernemq': {
+ title: 'VerneMQ',
+ icon: '<i class="fas fa-comments"></i>',
+ info: 'Performance data for the <b><a href="https://vernemq.com/">VerneMQ</a></b> open-source MQTT broker.'
+ },
+
+ 'pulsar': {
+ title: 'Pulsar',
+ icon: '<i class="fas fa-comments"></i>',
+ info: 'Summary, namespaces and topics performance data for the <b><a href="http://pulsar.apache.org/">Apache Pulsar</a></b> pub-sub messaging system.'
+ },
+
+ 'anomalies': {
+ title: 'Anomalies',
+ icon: '<i class="fas fa-flask"></i>',
+ info: 'Anomaly scores relating to key system metrics. A high anomaly probability indicates strange behaviour and may trigger an anomaly prediction from the trained models. Read the <a href="https://github.com/netdata/netdata/tree/master/collectors/python.d.plugin/anomalies" target="_blank">anomalies collector docs</a> for more details.'
+ },
+
+ 'alarms': {
+ title: 'Alarms',
+ icon: '<i class="fas fa-bell"></i>',
+ info: 'Charts showing alarm status over time. More details <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/alarms/README.md" target="_blank">here</a>.'
+ },
+
+ 'statsd': {
+ title: 'StatsD',
+ icon: '<i class="fas fa-chart-line"></i>',
+ info:'StatsD is an industry-standard technology stack for monitoring applications and instrumenting any piece of software to deliver custom metrics. Netdata allows the user to organize the metrics in different charts and visualize any application metric easily. Read more on <a href="https://learn.netdata.cloud/docs/agent/collectors/statsd.plugin">Netdata Learn</a>.'
+ },
+
+ 'supervisord': {
+ title: 'Supervisord',
+ icon: '<i class="fas fa-tasks"></i>',
+ info: 'Detailed statistics for each group of processes controlled by <b><a href="http://supervisord.org/">Supervisor</a></b>. ' +
+ 'Netdata collects these metrics using <a href="http://supervisord.org/api.html#supervisor.rpcinterface.SupervisorNamespaceRPCInterface.getAllProcessInfo" target="_blank"><code>getAllProcessInfo</code></a> method.'
+ },
+};
+
+
+// ----------------------------------------------------------------------------
+// submenus
+
+// information to be shown, just below each submenu
+
+// information about the submenus
+netdataDashboard.submenu = {
+ 'web_log.squid_bandwidth': {
+ title: '频宽',
+ info: 'Bandwidth of responses (<code>sent</code>) by squid. This chart may present unusual spikes, since the bandwidth is accounted at the time the log line is saved by the server, even if the time needed to serve it spans across a longer duration. We suggest to use QoS (e.g. <a href="http://firehol.org/#fireqos" target="_blank">FireQOS</a>) for accurate accounting of the server bandwidth.'
+ },
+
+ 'web_log.squid_responses': {
+ title: '回应',
+ info: 'Information related to the responses sent by squid.'
+ },
+
+ 'web_log.squid_requests': {
+ title: '请求',
+ info: 'Information related to the requests squid has received.'
+ },
+
+ 'web_log.squid_hierarchy': {
+ title: '等级制度',
+ info: 'Performance metrics for the squid hierarchy used to serve the requests.'
+ },
+
+ 'web_log.squid_squid_transport': {
+ title: '运输'
+ },
+
+ 'web_log.squid_squid_cache': {
+ title: '缓存',
+ info: 'squid缓存性能的性能指标.'
+ },
+
+ 'web_log.squid_timings': {
+ title: 'timings',
+ info: 'Duration of squid requests. Unrealistic spikes may be reported, since squid logs the total time of the requests, when they complete. Especially for HTTPS, the clients get a tunnel from the proxy and exchange requests directly with the upstream servers, so squid cannot evaluate the individual requests and reports the total time the tunnel was open.'
+ },
+
+ 'web_log.squid_clients': {
+ title: 'clients'
+ },
+
+ 'web_log.bandwidth': {
+ info: 'Bandwidth of requests (<code>received</code>) and responses (<code>sent</code>). <code>received</code> requires an extended log format (without it, the web server log does not have this information). This chart may present unusual spikes, since the bandwidth is accounted at the time the log line is saved by the web server, even if the time needed to serve it spans across a longer duration. We suggest to use QoS (e.g. <a href="http://firehol.org/#fireqos" target="_blank">FireQOS</a>) for accurate accounting of the web server bandwidth.'
+ },
+
+ 'web_log.urls': {
+ info: 'Number of requests for each <code>URL pattern</code> defined in <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/web_log/web_log.conf" target="_blank"><code>/etc/netdata/python.d/web_log.conf</code></a>. This chart counts all requests matching the URL patterns defined, independently of the web server response codes (i.e. both successful and unsuccessful).'
+ },
+
+ 'web_log.clients': {
+ info: 'Charts showing the number of unique client IPs, accessing the web server.'
+ },
+
+ 'web_log.timings': {
+ info: 'Web server response timings - the time the web server needed to prepare and respond to requests. This requires an extended log format and its meaning is web server specific. For most web servers this accounts the time from the reception of a complete request, to the dispatch of the last byte of the response. So, it includes the network delays of responses, but it does not include the network delays of requests.'
+ },
+
+ 'mem.ksm': {
+ title: 'deduper (ksm)',
+ info: 'Kernel Same-page Merging (KSM) 效能监视，经由读取 <code>/sys/kernel/mm/ksm/</code> 下的档案而来。KSM 是在 Linux 核心 (自 2.6.32 版起) 内含的一种节省记忆体使用率重复资料删除功能。)。 KSM 服务程序 ksmd 会定期扫描记忆体区域，寻找正有资料要更新进来且相同资料存在的分页。KSM 最初是从 KVM 专案开发中而来，利用这种共用相同资料的机制，即可以让更多的虚拟机器放到记忆体中。另外，对许多会产生同样内容的应用程序来说，这个功能是相当有效益的。'
+ },
+
+ 'mem.hugepages': {
+ info: 'Hugepages is a feature that allows the kernel to utilize the multiple page size capabilities of modern hardware architectures. The kernel creates multiple pages of virtual memory, mapped from both physical RAM and swap. There is a mechanism in the CPU architecture called "Translation Lookaside Buffers" (TLB) to manage the mapping of virtual memory pages to actual physical memory addresses. The TLB is a limited hardware resource, so utilizing a large amount of physical memory with the default page size consumes the TLB and adds processing overhead. By utilizing Huge Pages, the kernel is able to create pages of much larger sizes, each page consuming a single resource in the TLB. Huge Pages are pinned to physical RAM and cannot be swapped/paged out.'
+ },
+
+ 'mem.numa': {
+ info: 'Non-Uniform Memory Access (NUMA) 是一种记忆体存取分隔设计，在 NUMA 之下，一个处理器存取自己管理的的记忆体，将比非自己管理的记忆体 (另一个处理器所管理的记忆体或是共用记忆体) 具有更快速的效能。在 <a href="https://www.kernel.org/doc/Documentation/numastat.txt" target="_blank">Linux 核心文件</a> 中有详细说明这些指标。'
+ },
+
+ 'ip.ecn': {
+ info: '<a href="https://en.wikipedia.org/wiki/Explicit_Congestion_Notification" target="_blank">Explicit Congestion Notification (ECN)</a> is a TCP extension that allows end-to-end notification of network congestion without dropping packets. ECN is an optional feature that may be used between two ECN-enabled endpoints when the underlying network infrastructure also supports it.'
+ },
+
+ 'netfilter.conntrack': {
+ title: 'connection tracker',
+ info: 'Netfilter connection tracker 效能指标。Connection tracker 会追踪这台主机上所有的连接，包括流入与流出。工作原理是将所有开启的连接都储存到资料库，以追踪网路、位址转换与连接目标。'
+ },
+
+ 'netfilter.nfacct': {
+ title: 'bandwidth accounting',
+ info: 'The following information is read using the <code>nfacct.plugin</code>.'
+ },
+
+ 'netfilter.synproxy': {
+ title: 'DDoS protection',
+ info: 'DDoS protection performance metrics. <a href="https://github.com/firehol/firehol/wiki/Working-with-SYNPROXY" target="_blank">SYNPROXY</a> is a TCP SYN packets proxy. It is used to protect any TCP server (like a web server) from SYN floods and similar DDoS attacks. It is a netfilter module, in the Linux kernel (since version 3.12). It is optimized to handle millions of packets per second utilizing all CPUs available without any concurrency locking between the connections. It can be used for any kind of TCP traffic (even encrypted), since it does not interfere with the content itself.'
+ },
+
+ 'ipfw.dynamic_rules': {
+ title: 'dynamic rules',
+ info: 'Number of dynamic rules, created by correspondent stateful firewall rules.'
+ },
+
+ 'system.softnet_stat': {
+ title: 'softnet',
+ info: function (os) {
+ if (os === 'linux')
+ return 'Statistics for CPUs SoftIRQs related to network receive work. Break down per CPU core can be found at <a href="#menu_cpu_submenu_softnet_stat">CPU / softnet statistics</a>. <b>processed</b> states the number of packets processed, <b>dropped</b> is the number packets dropped because the network device backlog was full (to fix them on Linux use <code>sysctl</code> to increase <code>net.core.netdev_max_backlog</code>), <b>squeezed</b> is the number of packets dropped because the network device budget ran out (to fix them on Linux use <code>sysctl</code> to increase <code>net.core.netdev_budget</code> and/or <code>net.core.netdev_budget_usecs</code>). More information about identifying and troubleshooting network driver related issues can be found at <a href="https://access.redhat.com/sites/default/files/attachments/20150325_network_performance_tuning.pdf" target="_blank">Red Hat Enterprise Linux Network Performance Tuning Guide</a>.';
+ else
+ return 'Statistics for CPUs SoftIRQs related to network receive work.';
+ }
+ },
+
+ 'cpu.softnet_stat': {
+ title: 'softnet',
+ info: function (os) {
+ if (os === 'linux')
+ return 'Statistics for per CPUs core SoftIRQs related to network receive work. Total for all CPU cores can be found at <a href="#menu_system_submenu_softnet_stat">System / softnet statistics</a>. <b>processed</b> states the number of packets processed, <b>dropped</b> is the number packets dropped because the network device backlog was full (to fix them on Linux use <code>sysctl</code> to increase <code>net.core.netdev_max_backlog</code>), <b>squeezed</b> is the number of packets dropped because the network device budget ran out (to fix them on Linux use <code>sysctl</code> to increase <code>net.core.netdev_budget</code> and/or <code>net.core.netdev_budget_usecs</code>). More information about identifying and troubleshooting network driver related issues can be found at <a href="https://access.redhat.com/sites/default/files/attachments/20150325_network_performance_tuning.pdf" target="_blank">Red Hat Enterprise Linux Network Performance Tuning Guide</a>.';
+ else
+ return 'Statistics for per CPUs core SoftIRQs related to network receive work. Total for all CPU cores can be found at <a href="#menu_system_submenu_softnet_stat">System / softnet statistics</a>.';
+ }
+ },
+
+ 'go_expvar.memstats': {
+ title: 'memory statistics',
+ info: 'Go runtime memory statistics. See <a href="https://golang.org/pkg/runtime/#MemStats" target="_blank">runtime.MemStats</a> documentation for more info about each chart and the values.'
+ },
+
+ 'couchdb.dbactivity': {
+ title: 'db activity',
+ info: 'Overall database reads and writes for the entire server. This includes any external HTTP traffic, as well as internal replication traffic performed in a cluster to ensure node consistency.'
+ },
+
+ 'couchdb.httptraffic': {
+ title: 'http traffic breakdown',
+ info: 'All HTTP traffic, broken down by type of request (<tt>GET</tt>, <tt>PUT</tt>, <tt>POST</tt>, etc.) and response status code (<tt>200</tt>, <tt>201</tt>, <tt>4xx</tt>, etc.)<br/><br/>Any <tt>5xx</tt> errors here indicate a likely CouchDB bug; check the logfile for further information.'
+ },
+
+ 'couchdb.ops': {
+ title: 'server operations'
+ },
+
+ 'couchdb.perdbstats': {
+ title: 'per db statistics',
+ info: 'Statistics per database. This includes <a href="http://docs.couchdb.org/en/latest/api/database/common.html#get--db">3 size graphs per database</a>: active (the size of live data in the database), external (the uncompressed size of the database contents), and file (the size of the file on disk, exclusive of any views and indexes). It also includes the number of documents and number of deleted documents per database.'
+ },
+
+ 'couchdb.erlang': {
+ title: 'erlang statistics',
+ info: 'Detailed information about the status of the Erlang VM that hosts CouchDB. These are intended for advanced users only. High values of the peak message queue (>10e6) generally indicate an overload condition.'
+ },
+
+ 'ntpd.system': {
+ title: 'system',
+ info: 'Statistics of the system variables as shown by the readlist billboard <code>ntpq -c rl</code>. System variables are assigned an association ID of zero and can also be shown in the readvar billboard <code>ntpq -c "rv 0"</code>. These variables are used in the <a href="http://doc.ntp.org/current-stable/discipline.html">Clock Discipline Algorithm</a>, to calculate the lowest and most stable offset.'
+ },
+
+ 'ntpd.peers': {
+ title: 'peers',
+ info: 'Statistics of the peer variables for each peer configured in <code>/etc/ntp.conf</code> as shown by the readvar billboard <code>ntpq -c "rv <association>"</code>, while each peer is assigned a nonzero association ID as shown by <code>ntpq -c "apeers"</code>. The module periodically scans for new/changed peers (default: every 60s). <b>ntpd</b> selects the best possible peer from the available peers to synchronize the clock. A minimum of at least 3 peers is required to properly identify the best possible peer.'
+ }
+};
+
+
+// ----------------------------------------------------------------------------
+// chart
+
+// information works on the context of a chart
+// Its purpose is to set:
+//
+// info: the text above the charts
+// heads: the representation of the chart at the top the subsection (second level menu)
+// mainheads: the representation of the chart at the top of the section (first level menu)
+// colors: the dimension colors of the chart (the default colors are appended)
+// height: the ratio of the chart height relative to the default
+//
+
+var cgroupCPULimitIsSet = 0;
+var cgroupMemLimitIsSet = 0;
+
+netdataDashboard.context = {
+ 'system.cpu': {
+ info: function (os) {
+ void(os);
+ return 'CPU 使用率总表 (全部核心)。 当数值为 100% 时，表示您的 CPU 非常忙碌没有闲置空间。您可以在 <a href="#menu_cpu">CPU</a> 区段及以及 <a href="#menu_apps">应用程序</a> 区段深入了解每个核心与应用程序的使用情况。'
+ + netdataDashboard.sparkline('<br/>请特别关注 <b>iowait</b> ', 'system.cpu', 'iowait', '%', '，如果它一直处于较高的情况，这表示您的磁碟是效能瓶颈，您的系统效能会明显降低。')
+ + netdataDashboard.sparkline('<br/>另一个重要的指标是 <b>softirq</b> ', 'system.cpu', 'softirq', '%', '，若这个数值持续在较高的情况，很有可能是您的网路驱动部份有问题。');
+ },
+ valueRange: "[0, 100]"
+ },
+
+ 'system.load': {
+ info: '目前系统负载，也就是指 CPU 使用情况或正在等待系统资源 (通常是 CPU 与磁碟)。这三个指标分别是 1、5、15 分钟。系统每 5 秒会计算一次。更多的资讯可以参阅 <a href="https://en.wikipedia.org/wiki/Load_(computing)" target="_blank">维基百科</a> 说明。',
+ height: 0.7
+ },
+
+ 'system.cpu_pressure': {
+ info: '<a href="https://www.kernel.org/doc/html/latest/accounting/psi.html">Pressure Stall Information</a> ' +
+ 'identifies and quantifies the disruptions caused by resource contentions. ' +
+ 'The "some" line indicates the share of time in which at least <b>some</b> tasks are stalled on CPU. ' +
+ 'The ratios (in %) are tracked as recent trends over 10-, 60-, and 300-second windows.'
+ },
+
+ 'system.memory_some_pressure': {
+ info: '<a href="https://www.kernel.org/doc/html/latest/accounting/psi.html">Pressure Stall Information</a> ' +
+ 'identifies and quantifies the disruptions caused by resource contentions. ' +
+ 'The "some" line indicates the share of time in which at least <b>some</b> tasks are stalled on memory. ' +
+ 'The "full" line indicates the share of time in which <b>all non-idle</b> tasks are stalled on memory simultaneously. ' +
+ 'In this state actual CPU cycles are going to waste, and a workload that spends extended time in this state is considered to be thrashing. ' +
+ 'The ratios (in %) are tracked as recent trends over 10-, 60-, and 300-second windows.'
+ },
+
+ 'system.io_some_pressure': {
+ info: '<a href="https://www.kernel.org/doc/html/latest/accounting/psi.html">Pressure Stall Information</a> ' +
+ 'identifies and quantifies the disruptions caused by resource contentions. ' +
+ 'The "some" line indicates the share of time in which at least <b>some</b> tasks are stalled on I/O. ' +
+ 'The "full" line indicates the share of time in which <b>all non-idle</b> tasks are stalled on I/O simultaneously. ' +
+ 'In this state actual CPU cycles are going to waste, and a workload that spends extended time in this state is considered to be thrashing. ' +
+ 'The ratios (in %) are tracked as recent trends over 10-, 60-, and 300-second windows.'
+ },
+
+ 'system.io': {
+ info: function (os) {
+ var s = '磁碟 I/O 总计, 包含所有的实体磁碟。您可以在 <a href="#menu_disk">磁碟</a> 区段查看每一个磁碟的详细资讯，也可以在 <a href="#menu_apps">应用程序</a> 区段了解每一支应用程序对于磁碟的使用情况。';
+
+ if (os === 'linux')
+ return s + ' 实体磁碟指的是 <code>/sys/block</code> 中有列出，但是没有在 <code>/sys/devices/virtual/block</code> 的所有磁碟。';
+ else
+ return s;
+ }
+ },
+
+ 'system.pgpgio': {
+ info: '从记忆体分页到磁碟的 I/O。通常是这个系统所有磁碟的总 I/O。'
+ },
+
+ 'system.swapio': {
+ info: '所有的 Swap I/O. (netdata 会合并显示 <code>输入</code> 与 <code>输出</code>。如果图表中没有任何数值，则表示为 0。 - 您可以修改这一页的设定，让图表显示固定的维度。'
+ },
+
+ 'system.pgfaults': {
+ info: '所有的 Page 错误. <b>Major page faults</b> indicates that the system is using its swap. You can find which applications use the swap at the <a href="#menu_apps">Applications Monitoring</a> section.'
+ },
+
+ 'system.entropy': {
+ colors: '#CC22AA',
+ info: '<a href="https://en.wikipedia.org/wiki/Entropy_(computing)" target="_blank">熵 (Entropy)</a>，主要是用在密码学的乱数集区 (<a href="https://en.wikipedia.org/wiki//dev/random" target="_blank">/dev/random</a>)。如果熵的集区为空，需要乱数的程序可能会导致执行变慢 (这取决于每个程序使用的介面)，等待集区补充。在理想情况下，有高度熵需求的系统应该要具备专用的硬体装置 (例如 TPM 装置)。您也可以安装纯软体的方案，例如 <code>haveged</code>，通常这些方案只会使用在伺服器上。'
+ },
+
+ 'system.forks': {
+ colors: '#5555DD',
+ info: '建立新程序的数量。'
+ },
+
+ 'system.intr': {
+ colors: '#DD5555',
+ info: 'CPU 中断的总数。透过检查 <code>system.interrupts</code>，得知每一个中断的细节资讯。在 <a href="#menu_cpu">CPU</a> 区段提供每一个 CPU 核心的中断情形。'
+ },
+
+ 'system.interrupts': {
+ info: 'CPU 中断的细节。在 <a href="#menu_cpu">CPU</a> 区段中，依据每个 CPU 核心分析中断。'
+ },
+
+ 'system.softirqs': {
+ info: 'CPU softirqs 的细节。在 <a href="#menu_cpu">CPU</a> 区段中，依据每个 CPU 核心分析 softirqs。'
+ },
+
+ 'system.processes': {
+ info: '系统程序。<b>running</b> 显示正在 CPU 中的程序。<b>Blocked</b> 显示目前被挡下无法进入 CPU 执行的程序，例如：正在等待磁碟完成动作，才能继续。'
+ },
+
+ 'system.active_processes': {
+ info: '所有的系统程序。'
+ },
+
+ 'system.ctxt': {
+ info: '<a href="https://en.wikipedia.org/wiki/Context_switch" target="_blank">Context Switches</a>，指 CPU 从一个程序、工作或是执行绪切换到另一个程序、工作或是执行绪。如果有许多程序或执行绪需要执行，但可以使用的 CPU 核心很少，即表示系统将会进行更多的 context switching 用来平衡它们所使用的 CPU 资源。这个过程需要大量的运算，因此 context switches 越多，整个系统就会越慢。'
+ },
+
+ 'system.idlejitter': {
+ info: 'Idle jitter 是由 netdata 计算而得。当一个执行绪要求睡眠 (Sleep) 时，需要几个微秒的时间。当系统要唤醒它时，会量测它用了多少个微秒的时间。要求睡眠与实际睡眠时间的差异就是 <b>idle jitter</b>。这个数字在即时的环境中非常有用，因为 CPU jitter 将会影响服务的品质 (例如 VoIP media gateways)。'
+ },
+
+ 'system.net': {
+ info: function (os) {
+ var s = '所有实体网路介面的总频宽。不包含 <code>lo</code>、VPN、网路桥接、IFB 装置、介面聚合 (Bond).. 等。将合并显示实体网路介面的频宽使用情况。';
+
+ if (os === 'linux')
+ return s + ' 实体网路介面是指在 <code>/proc/net/dev</code> 有列出，但不在 <code>/sys/devices/virtual/net</code> 里。';
+ else
+ return s;
+ }
+ },
+
+ 'system.ip': {
+ info: 'IP 总流量。'
+ },
+
+ 'system.ipv4': {
+ info: 'IPv4 总流量。'
+ },
+
+ 'system.ipv6': {
+ info: 'IPv6 总流量。'
+ },
+
+ 'system.ram': {
+ info: '系统随机存取记忆体 (也就是实体记忆体) 使用情况。'
+ },
+
+ 'system.swap': {
+ info: '系统交换空间 (Swap) 记忆体使用情况。Swap 空间会在实体记忆体 (RAM) 已满的情况下使用。当系统记忆体已满但还需要使用更多记忆体情况下，系统记忆体中的比较没有异动的 Page 将会被移动到 Swap 空间 (通常是磁碟、磁碟分割区或是档案)。'
+ },
+
+ // ------------------------------------------------------------------------
+ // CPU charts
+
+ 'cpu.cpu': {
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, 100]"
+ },
+
+ 'cpu.interrupts': {
+ commonMin: true,
+ commonMax: true
+ },
+
+ 'cpu.softirqs': {
+ commonMin: true,
+ commonMax: true
+ },
+
+ 'cpu.softnet_stat': {
+ commonMin: true,
+ commonMax: true
+ },
+
+ // ------------------------------------------------------------------------
+ // MEMORY
+
+ 'mem.ksm_savings': {
+ heads: [
+ netdataDashboard.gaugeChart('Saved', '12%', 'savings', '#0099CC')
+ ]
+ },
+
+ 'mem.ksm_ratios': {
+ heads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Savings"'
+ + ' data-units="percentage %"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'mem.zram_usage': {
+ info: 'ZRAM total RAM usage metrics. ZRAM uses some memory to store metadata about stored memory pages, thus introducing an overhead which is proportional to disk size. It excludes same-element-filled-pages since no memory is allocated for them.'
+ },
+
+ 'mem.zram_savings': {
+ info: 'Displays original and compressed memory data sizes.'
+ },
+
+ 'mem.zram_ratio': {
+ heads: [
+ netdataDashboard.gaugeChart('Compression Ratio', '12%', 'ratio', '#0099CC')
+ ],
+ info: 'Compression ratio, calculated as <code>100 * original_size / compressed_size</code>. More means better compression and more RAM savings.'
+ },
+
+ 'mem.zram_efficiency': {
+ heads: [
+ netdataDashboard.gaugeChart('Efficiency', '12%', 'percent', NETDATA.colors[0])
+ ],
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, 100]",
+ info: 'Memory usage efficiency, calculated as <code>100 * compressed_size / total_mem_used</code>.'
+ },
+
+
+ 'mem.pgfaults': {
+ info: 'A <a href="https://en.wikipedia.org/wiki/Page_fault" target="_blank">page fault</a> is a type of interrupt, called trap, raised by computer hardware when a running program accesses a memory page that is mapped into the virtual address space, but not actually loaded into main memory. If the page is loaded in memory at the time the fault is generated, but is not marked in the memory management unit as being loaded in memory, then it is called a <b>minor</b> or soft page fault. A <b>major</b> page fault is generated when the system needs to load the memory page from disk or swap memory.'
+ },
+
+ 'mem.committed': {
+ colors: NETDATA.colors[3],
+ info: 'Committed 记忆体，是指程序分配到的所有记忆体总计。'
+ },
+
+ 'mem.available': {
+ info: '可用记忆体是由核心估算而来，也就是使用者空间程序可以使用的 RAM 总量，而不会造成交换 (Swap) 发生。'
+ },
+
+ 'mem.writeback': {
+ info: '<b>Dirty</b> 是等待写入磁碟的记忆体量。<b>Writeback</b> 是指有多少记忆体内容被主动写入磁碟。'
+ },
+
+ 'mem.kernel': {
+ info: 'The total amount of memory being used by the kernel. <b>Slab</b> is the amount of memory used by the kernel to cache data structures for its own use. <b>KernelStack</b> is the amount of memory allocated for each task done by the kernel. <b>PageTables</b> is the amount of memory decicated to the lowest level of page tables (A page table is used to turn a virtual address into a physical memory address). <b>VmallocUsed</b> is the amount of memory being used as virtual address space.'
+ },
+
+ 'mem.slab': {
+ info: '<b>Reclaimable</b> is the amount of memory which the kernel can reuse. <b>Unreclaimable</b> can not be reused even when the kernel is lacking memory.'
+ },
+
+ 'mem.hugepages': {
+ info: 'Dedicated (or Direct) HugePages is memory reserved for applications configured to utilize huge pages. Hugepages are <b>used</b> memory, even if there are free hugepages available.'
+ },
+
+ 'mem.transparent_hugepages': {
+ info: 'Transparent HugePages (THP) is backing virtual memory with huge pages, supporting automatic promotion and demotion of page sizes. It works for all applications for anonymous memory mappings and tmpfs/shmem.'
+ },
+
+ 'mem.cachestat_ratio': {
+ info: 'When the processor needs to read or write a location in main memory, it checks for a corresponding entry in the page cache. If the entry is there, a page cache hit has occurred and the read is from the cache. If the entry is not there, a page cache miss has occurred and the kernel allocates a new entry and copies in data from the disk. Netdata calculates the percentage of accessed files that are cached on memory. <a href="https://github.com/iovisor/bcc/blob/master/tools/cachestat.py#L126-L138" target="_blank">The ratio</a> is calculated counting the accessed cached pages (without counting dirty pages and pages added because of read misses) divided by total access without dirty pages. The algorithm will not plot data when ratio is zero and our dashboard will interpolate the plot. '
+ },
+
+ 'mem.cachestat_dirties': {
+ info: 'Number of <a href="https://en.wikipedia.org/wiki/Page_cache#Memory_conservation" target="_blank">dirty(modified) pages</a> cache. Pages in the page cache modified after being brought in are called dirty pages. Since non-dirty pages in the page cache have identical copies in <a href="https://en.wikipedia.org/wiki/Secondary_storage" target="_blank">secondary storage</a> (e.g. hard disk drive or solid-state drive), discarding and reusing their space is much quicker than paging out application memory, and is often preferred over flushing the dirty pages into secondary storage and reusing their space.'
+ },
+
+ 'mem.cachestat_hits': {
+ info: 'When the processor needs to read or write a location in main memory, it checks for a corresponding entry in the page cache. If the entry is there, a page cache hit has occurred and the read is from the cache. Hits show pages accessed that were not modified (we are excluding dirty pages), this counting also excludes the recent pages inserted for read.'
+ },
+
+ 'mem.cachestat_misses': {
+ info: 'When the processor needs to read or write a location in main memory, it checks for a corresponding entry in the page cache. If the entry is not there, a page cache miss has occurred and the cache allocates a new entry and copies in data for the main memory. Misses count page insertions to the memory not related to writing.'
+ },
+
+ 'mem.sync': {
+ info: 'System calls for <a href="https://man7.org/linux/man-pages/man2/sync.2.html" target="_blank">sync() and syncfs()</a> which flush the file system buffers to storage devices. Performance perturbations might be caused by these calls. The <code>sync()</code> calls are based on the eBPF <a href="https://github.com/iovisor/bcc/blob/master/tools/syncsnoop.py" target="_blank">syncsnoop</a> from BCC tools.'
+ },
+
+ 'mem.file_sync': {
+ info: 'System calls for <a href="https://man7.org/linux/man-pages/man2/fsync.2.html" target="_blank">fsync() and fdatasync()</a> transfer all modified page caches for the files on disk devices. These calls block until the device reports that the transfer has been completed.'
+ },
+
+ 'mem.memory_map': {
+ info: 'System calls for <a href="https://man7.org/linux/man-pages/man2/msync.2.html" target="_blank">msync()</a> which flushes changes made to the in-core copy of a file that was mapped.'
+ },
+
+ 'mem.file_segment': {
+ info: 'System calls for <a href="https://man7.org/linux/man-pages/man2/sync_file_range.2.html" target="_blank">sync_file_range()</a> permits fine control when synchronizing the open file referred to by the file descriptor fd with disk. This system call is extremely dangerous and should not be used in portable programs.'
+ },
+
+ // ------------------------------------------------------------------------
+ // network interfaces
+
+ 'net.drops': {
+ info: 'Packets that have been dropped at the network interface level. These are the same counters reported by <code>ifconfig</code> as <code>RX dropped</code> (inbound) and <code>TX dropped</code> (outbound). <b>inbound</b> packets can be dropped at the network interface level due to <a href="#menu_system_submenu_softnet_stat">softnet backlog</a> overflow, bad / unintented VLAN tags, unknown or unregistered protocols, IPv6 frames when the server is not configured for IPv6. Check <a href="https://www.novell.com/support/kb/doc.php?id=7007165" target="_blank">this document</a> for more information.'
+ },
+
+ 'net.duplex': {
+ info: 'State map: 0 - unknown, 1 - half duplex, 2 - full duplex'
+ },
+
+ 'net.operstate': {
+ info: 'State map: 0 - unknown, 1 - notpresent, 2 - down, 3 - lowerlayerdown, 4 - testing, 5 - dormant, 6 - up'
+ },
+
+ 'net.carrier': {
+ info: 'State map: 0 - down, 1 - up'
+ },
+
+ // ------------------------------------------------------------------------
+ // IP
+
+ 'ip.inerrors': {
+ info: 'Errors encountered during the reception of IP packets. ' +
+ '<code>noroutes</code> (<code>InNoRoutes</code>) counts packets that were dropped because there was no route to send them. ' +
+ '<code>truncated</code> (<code>InTruncatedPkts</code>) counts packets which is being discarded because the datagram frame didn\'t carry enough data. ' +
+ '<code>checksum</code> (<code>InCsumErrors</code>) counts packets that were dropped because they had wrong checksum. '
+ },
+
+ 'ip.tcpmemorypressures': {
+ info: 'Number of times a socket was put in <b>memory pressure</b> due to a non fatal memory allocation failure (the kernel attempts to work around this situation by reducing the send buffers, etc).'
+ },
+
+ 'ip.tcpconnaborts': {
+ info: 'TCP connection aborts. <b>baddata</b> (<code>TCPAbortOnData</code>) happens while the connection is on <code>FIN_WAIT1</code> and the kernel receives a packet with a sequence number beyond the last one for this connection - the kernel responds with <code>RST</code> (closes the connection). <b>userclosed</b> (<code>TCPAbortOnClose</code>) happens when the kernel receives data on an already closed connection and responds with <code>RST</code>. <b>nomemory</b> (<code>TCPAbortOnMemory</code> happens when there are too many orphaned sockets (not attached to an fd) and the kernel has to drop a connection - sometimes it will send an <code>RST</code>, sometimes it won\'t. <b>timeout</b> (<code>TCPAbortOnTimeout</code>) happens when a connection times out. <b>linger</b> (<code>TCPAbortOnLinger</code>) happens when the kernel killed a socket that was already closed by the application and lingered around for long enough. <b>failed</b> (<code>TCPAbortFailed</code>) happens when the kernel attempted to send an <code>RST</code> but failed because there was no memory available.'
+ },
+
+ 'ip.tcp_syn_queue': {
+ info: 'The <b>SYN queue</b> of the kernel tracks TCP handshakes until connections get fully established. ' +
+ 'It overflows when too many incoming TCP connection requests hang in the half-open state and the server ' +
+ 'is not configured to fall back to SYN cookies*. Overflows are usually caused by SYN flood DoS attacks ' +
+ '(i.e. someone sends lots of SYN packets and never completes the handshakes). ' +
+ '<b>drops</b> (or <code>TcpExtTCPReqQFullDrop</code>) is the number of connections dropped because the ' +
+ 'SYN queue was full and SYN cookies were disabled. ' +
+ '<b>cookies</b> (or <code>TcpExtTCPReqQFullDoCookies</code>) is the number of SYN cookies sent because the ' +
+ 'SYN queue was full.'
+ },
+
+ 'ip.tcp_accept_queue': {
+ info: 'The <b>accept queue</b> of the kernel holds the fully established TCP connections, waiting to be handled ' +
+ 'by the listening application. <b>overflows</b> (or <code>ListenOverflows</code>) is the number of ' +
+ 'established connections that could not be handled because the receive queue of the listening application ' +
+ 'was full. <b>drops</b> (or <code>ListenDrops</code>) is the number of incoming ' +
+ 'connections that could not be handled, including SYN floods, overflows, out of memory, security issues, ' +
+ 'no route to destination, reception of related ICMP messages, socket is broadcast or multicast.'
+ },
+
+
+ // ------------------------------------------------------------------------
+ // IPv4
+
+ 'ipv4.tcpsock': {
+ info: 'The number of established TCP connections (known as <code>CurrEstab</code>). This is a snapshot of the established connections at the time of measurement (i.e. a connection established and a connection disconnected within the same iteration will not affect this metric).'
+ },
+
+ 'ipv4.tcpopens': {
+ info: '<b>active</b> or <code>ActiveOpens</code> is the number of outgoing TCP <b>connections attempted</b> by this host.'
+ + ' <b>passive</b> or <code>PassiveOpens</code> is the number of incoming TCP <b>connections accepted</b> by this host.'
+ },
+
+ 'ipv4.tcperrors': {
+ info: '<code>InErrs</code> is the number of TCP segments received in error (including header too small, checksum errors, sequence errors, bad packets - for both IPv4 and IPv6).'
+ + ' <code>InCsumErrors</code> is the number of TCP segments received with checksum errors (for both IPv4 and IPv6).'
+ + ' <code>RetransSegs</code> is the number of TCP segments retransmitted.'
+ },
+
+ 'ipv4.tcphandshake': {
+ info: '<code>EstabResets</code> is the number of established connections resets (i.e. connections that made a direct transition from <code>ESTABLISHED</code> or <code>CLOSE_WAIT</code> to <code>CLOSED</code>).'
+ + ' <code>OutRsts</code> is the number of TCP segments sent, with the <code>RST</code> flag set (for both IPv4 and IPv6).'
+ + ' <code>AttemptFails</code> is the number of times TCP connections made a direct transition from either <code>SYN_SENT</code> or <code>SYN_RECV</code> to <code>CLOSED</code>, plus the number of times TCP connections made a direct transition from the <code>SYN_RECV</code> to <code>LISTEN</code>.'
+ + ' <code>TCPSynRetrans</code> shows retries for new outbound TCP connections, which can indicate general connectivity issues or backlog on the remote host.'
+ },
+
+ // ------------------------------------------------------------------------
+ // APPS
+
+ 'apps.cpu': {
+ height: 2.0
+ },
+
+ 'apps.mem': {
+ info: 'Real memory (RAM) used by applications. This does not include shared memory.'
+ },
+
+ 'apps.vmem': {
+ info: 'Virtual memory allocated by applications. Please check <a href="https://github.com/netdata/netdata/tree/master/daemon#virtual-memory" target="_blank">this article</a> for more information.'
+ },
+
+ 'apps.preads': {
+ height: 2.0
+ },
+
+ 'apps.pwrites': {
+ height: 2.0
+ },
+
+ 'apps.uptime': {
+ info: 'Carried over process group uptime since the Netdata restart. The period of time within which at least one process in the group was running.'
+ },
+
+ 'apps.file_open': {
+ info: 'Calls to the internal function <code>do_sys_open</code> ( For kernels newer than <code>5.5.19</code> we add a kprobe to <code>do_sys_openat2</code>. ), which is the common function called from' +
+ ' <a href="https://www.man7.org/linux/man-pages/man2/open.2.html" target="_blank">open(2)</a> ' +
+ ' and <a href="https://www.man7.org/linux/man-pages/man2/openat.2.html" target="_blank">openat(2)</a>. '
+ },
+
+ 'apps.file_open_error': {
+ info: 'Failed calls to the internal function <code>do_sys_open</code> ( For kernels newer than <code>5.5.19</code> we add a kprobe to <code>do_sys_openat2</code>. ).'
+ },
+
+ 'apps.file_closed': {
+ info: 'Calls to the internal function <a href="https://elixir.bootlin.com/linux/v5.10/source/fs/file.c#L665" target="_blank">__close_fd</a> or <a href="https://elixir.bootlin.com/linux/v5.11/source/fs/file.c#L617" target="_blank">close_fd</a> according to your kernel version, which is called from' +
+ ' <a href="https://www.man7.org/linux/man-pages/man2/close.2.html" target="_blank">close(2)</a>. '
+ },
+
+ 'apps.file_close_error': {
+ info: 'Failed calls to the internal function <a href="https://elixir.bootlin.com/linux/v5.10/source/fs/file.c#L665" target="_blank">__close_fd</a> or <a href="https://elixir.bootlin.com/linux/v5.11/source/fs/file.c#L617" target="_blank">close_fd</a> according to your kernel version.'
+ },
+
+ 'apps.file_deleted': {
+ info: 'Calls to the function <a href="https://www.kernel.org/doc/htmldocs/filesystems/API-vfs-unlink.html" target="_blank">vfs_unlink</a>. This chart does not show all events that remove files from the filesystem, because filesystems can create their own functions to remove files.'
+ },
+
+ 'apps.vfs_write_call': {
+ info: 'Successful calls to the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>. This chart may not show all filesystem events if it uses other functions to store data on disk.'
+ },
+
+ 'apps.vfs_write_error': {
+ info: 'Failed calls to the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>. This chart may not show all filesystem events if it uses other functions to store data on disk.'
+ },
+
+ 'apps.vfs_read_call': {
+ info: 'Successful calls to the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a>. This chart may not show all filesystem events if it uses other functions to store data on disk.'
+ },
+
+ 'apps.vfs_read_error': {
+ info: 'Failed calls to the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a>. This chart may not show all filesystem events if it uses other functions to store data on disk.'
+ },
+
+ 'apps.vfs_write_bytes': {
+ info: 'Total of bytes successfully written using the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>.'
+ },
+
+ 'apps.vfs_read_bytes': {
+ info: 'Total of bytes successfully read using the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a>.'
+ },
+
+ 'apps.process_create': {
+ info: 'Calls to either <a href="https://www.ece.uic.edu/~yshi1/linux/lkse/node4.html#SECTION00421000000000000000" target="_blank">do_fork</a>, or <code>kernel_clone</code> if you are running kernel newer than 5.9.16, to create a new task, which is the common name used to define process and tasks inside the kernel. Netdata identifies the process by counting the number of calls to <a href="https://linux.die.net/man/2/clone" target="_blank">sys_clone</a> that do not have the flag <code>CLONE_THREAD</code> set.'
+ },
+
+ 'apps.thread_create': {
+ info: 'Calls to either <a href="https://www.ece.uic.edu/~yshi1/linux/lkse/node4.html#SECTION00421000000000000000" target="_blank">do_fork</a>, or <code>kernel_clone</code> if you are running kernel newer than 5.9.16, to create a new task, which is the common name used to define process and tasks inside the kernel. Netdata identifies the threads by counting the number of calls to <a href="https://linux.die.net/man/2/clone" target="_blank">sys_clone</a> that have the flag <code>CLONE_THREAD</code> set.'
+ },
+
+ 'apps.task_close': {
+ info: 'Calls to the functions responsible for closing (<a href="https://www.informit.com/articles/article.aspx?p=370047&seqNum=4" target="_blank">do_exit</a>) and releasing (<a href="https://www.informit.com/articles/article.aspx?p=370047&seqNum=4" target="_blank">release_task</a>) tasks.'
+ },
+
+ 'apps.bandwidth_sent': {
+ info: 'Bytes sent by functions <code>tcp_sendmsg</code> and <code>udp_sendmsg</code>.'
+ },
+
+ 'apps.bandwidth_recv': {
+ info: 'Bytes received by functions <code>tcp_cleanup_rbuf</code> and <code>udp_recvmsg</code>. We use <code>tcp_cleanup_rbuf</code> instead <code>tcp_recvmsg</code>, because this last misses <code>tcp_read_sock()</code> traffic and we would also need to have more probes to get the socket and package size.'
+ },
+
+ 'apps.bandwidth_tcp_send': {
+ info: 'Calls for function <code>tcp_sendmsg</code>.'
+ },
+
+ 'apps.bandwidth_tcp_recv': {
+ info: 'Calls for functions <code>tcp_cleanup_rbuf</code>. We use <code>tcp_cleanup_rbuf</code> instead <code>tcp_recvmsg</code>, because this last misses <code>tcp_read_sock()</code> traffic and we would also need to have more probes to get the socket and package size.'
+ },
+
+ 'apps.bandwidth_tcp_retransmit': {
+ info: 'Calls for functions <code>tcp_retranstmit_skb</code>.'
+ },
+
+ 'apps.bandwidth_udp_send': {
+ info: 'Calls for function <code>udp_sendmsg</code>.'
+ },
+
+ 'apps.bandwidth_udp_recv': {
+ info: 'Calls for function <code>udp_recvmsg</code>.'
+ },
+
+ // ------------------------------------------------------------------------
+ // USERS
+
+ 'users.cpu': {
+ height: 2.0
+ },
+
+ 'users.mem': {
+ info: 'Real memory (RAM) used per user. This does not include shared memory.'
+ },
+
+ 'users.vmem': {
+ info: 'Virtual memory allocated per user. Please check <a href="https://github.com/netdata/netdata/tree/master/daemon#virtual-memory" target="_blank">this article</a> for more information.'
+ },
+
+ 'users.preads': {
+ height: 2.0
+ },
+
+ 'users.pwrites': {
+ height: 2.0
+ },
+
+ 'users.uptime': {
+ info: 'Carried over process group uptime since the Netdata restart. The period of time within which at least one process in the group was running.'
+ },
+
+ // ------------------------------------------------------------------------
+ // GROUPS
+
+ 'groups.cpu': {
+ height: 2.0
+ },
+
+ 'groups.mem': {
+ info: 'Real memory (RAM) used per user group. This does not include shared memory.'
+ },
+
+ 'groups.vmem': {
+ info: 'Virtual memory allocated per user group since the Netdata restart. Please check <a href="https://github.com/netdata/netdata/tree/master/daemon#virtual-memory" target="_blank">this article</a> for more information.'
+ },
+
+ 'groups.preads': {
+ height: 2.0
+ },
+
+ 'groups.pwrites': {
+ height: 2.0
+ },
+
+ 'groups.uptime': {
+ info: 'Carried over process group uptime. The period of time within which at least one process in the group was running.'
+ },
+
+ // ------------------------------------------------------------------------
+ // NETWORK QoS
+
+ 'tc.qos': {
+ heads: [
+ function (os, id) {
+ void(os);
+
+ if (id.match(/.*-ifb$/))
+ return netdataDashboard.gaugeChart('Inbound', '12%', '', '#5555AA');
+ else
+ return netdataDashboard.gaugeChart('Outbound', '12%', '', '#AA9900');
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // NETWORK INTERFACES
+
+ 'net.net': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ if (id.match(/^cgroup_.*/)) {
+ var iface;
+ try {
+ iface = ' ' + id.substring(id.lastIndexOf('.net_') + 5, id.length);
+ } catch (e) {
+ iface = '';
+ }
+ return netdataDashboard.gaugeChart('Received' + iface, '12%', 'received');
+ } else
+ return '';
+ },
+ function (os, id) {
+ void(os);
+ if (id.match(/^cgroup_.*/)) {
+ var iface;
+ try {
+ iface = ' ' + id.substring(id.lastIndexOf('.net_') + 5, id.length);
+ } catch (e) {
+ iface = '';
+ }
+ return netdataDashboard.gaugeChart('Sent' + iface, '12%', 'sent');
+ } else
+ return '';
+ }
+ ],
+ heads: [
+ function (os, id) {
+ void(os);
+ if (!id.match(/^cgroup_.*/))
+ return netdataDashboard.gaugeChart('Received', '12%', 'received');
+ else
+ return '';
+ },
+ function (os, id) {
+ void(os);
+ if (!id.match(/^cgroup_.*/))
+ return netdataDashboard.gaugeChart('Sent', '12%', 'sent');
+ else
+ return '';
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // NETFILTER
+
+ 'netfilter.sockets': {
+ colors: '#88AA00',
+ heads: [
+ netdataDashboard.gaugeChart('Active Connections', '12%', '', '#88AA00')
+ ]
+ },
+
+ 'netfilter.new': {
+ heads: [
+ netdataDashboard.gaugeChart('New Connections', '12%', 'new', '#5555AA')
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // DISKS
+
+ 'disk.util': {
+ colors: '#FF5588',
+ heads: [
+ netdataDashboard.gaugeChart('使用率', '12%', '', '#FF5588')
+ ],
+ info: 'Disk Utilization measures the amount of time the disk was busy with something. This is not related to its performance. 100% means that the system always had an outstanding operation on the disk. Keep in mind that depending on the underlying technology of the disk, 100% here may or may not be an indication of congestion.'
+ },
+
+ 'disk.busy': {
+ colors: '#FF5588',
+ info: 'Disk Busy Time measures the amount of time the disk was busy with something.'
+ },
+
+ 'disk.backlog': {
+ colors: '#0099CC',
+ info: 'Backlog is an indication of the duration of pending disk operations. On every I/O event the system is multiplying the time spent doing I/O since the last update of this field with the number of pending operations. While not accurate, this metric can provide an indication of the expected completion time of the operations in progress.'
+ },
+
+ 'disk.io': {
+ heads: [
+ netdataDashboard.gaugeChart('读取', '12%', 'reads'),
+ netdataDashboard.gaugeChart('写入', '12%', 'writes')
+ ],
+ info: '磁碟传输资料的总计。'
+ },
+
+ 'disk.ops': {
+ info: '已完成的磁碟 I/O operations。提醒：实际上的 operations 数量可能更高，因为系统能够将它们互相合并 (详见 operations 图表)。'
+ },
+
+ 'disk.qops': {
+ info: 'I/O operations currently in progress. This metric is a snapshot - it is not an average over the last interval.'
+ },
+
+ 'disk.iotime': {
+ height: 0.5,
+ info: 'The sum of the duration of all completed I/O operations. This number can exceed the interval if the disk is able to execute I/O operations in parallel.'
+ },
+ 'disk.mops': {
+ height: 0.5,
+ info: 'The number of merged disk operations. The system is able to merge adjacent I/O operations, for example two 4KB reads can become one 8KB read before given to disk.'
+ },
+ 'disk.svctm': {
+ height: 0.5,
+ info: 'The average service time for completed I/O operations. This metric is calculated using the total busy time of the disk and the number of completed operations. If the disk is able to execute multiple parallel operations the reporting average service time will be misleading.'
+ },
+ 'disk.avgsz': {
+ height: 0.5,
+ info: 'I/O operation 平均大小。'
+ },
+ 'disk.await': {
+ height: 0.5,
+ info: '对要提供服务的设备发出 I/O 请求平均时间。这包含了请求在伫列中所花费的时间以及实际提供服务的时间。'
+ },
+
+ 'disk.space': {
+ info: '磁碟空间使用率。系统会自动为 root 使用者做保留，以防止 root 使用者使用过多。'
+ },
+ 'disk.inodes': {
+ info: 'inodes (or index nodes) are filesystem objects (e.g. files and directories). On many types of file system implementations, the maximum number of inodes is fixed at filesystem creation, limiting the maximum number of files the filesystem can hold. It is possible for a device to run out of inodes. When this happens, new files cannot be created on the device, even though there may be free space available.'
+ },
+
+ 'mysql.net': {
+ info: 'The amount of data sent to mysql clients (<strong>out</strong>) and received from mysql clients (<strong>in</strong>).'
+ },
+
+ // ------------------------------------------------------------------------
+ // MYSQL
+
+ 'mysql.queries': {
+ info: 'The number of statements executed by the server.<ul>' +
+ '<li><strong>queries</strong> counts the statements executed within stored SQL programs.</li>' +
+ '<li><strong>questions</strong> counts the statements sent to the mysql server by mysql clients.</li>' +
+ '<li><strong>slow queries</strong> counts the number of statements that took more than <a href="http://dev.mysql.com/doc/refman/5.7/en/server-system-variables.html#sysvar_long_query_time" target="_blank">long_query_time</a> seconds to be executed.' +
+ ' For more information about slow queries check the mysql <a href="http://dev.mysql.com/doc/refman/5.7/en/slow-query-log.html" target="_blank">slow query log</a>.</li>' +
+ '</ul>'
+ },
+
+ 'mysql.handlers': {
+ info: 'Usage of the internal handlers of mysql. This chart provides very good insights of what the mysql server is actually doing.' +
+ ' (if the chart is not showing all these dimensions it is because they are zero - set <strong>Which dimensions to show?</strong> to <strong>All</strong> from the dashboard settings, to render even the zero values)<ul>' +
+ '<li><strong>commit</strong>, the number of internal <a href="http://dev.mysql.com/doc/refman/5.7/en/commit.html" target="_blank">COMMIT</a> statements.</li>' +
+ '<li><strong>delete</strong>, the number of times that rows have been deleted from tables.</li>' +
+ '<li><strong>prepare</strong>, a counter for the prepare phase of two-phase commit operations.</li>' +
+ '<li><strong>read first</strong>, the number of times the first entry in an index was read. A high value suggests that the server is doing a lot of full index scans; e.g. <strong>SELECT col1 FROM foo</strong>, with col1 indexed.</li>' +
+ '<li><strong>read key</strong>, the number of requests to read a row based on a key. If this value is high, it is a good indication that your tables are properly indexed for your queries.</li>' +
+ '<li><strong>read next</strong>, the number of requests to read the next row in key order. This value is incremented if you are querying an index column with a range constraint or if you are doing an index scan.</li>' +
+ '<li><strong>read prev</strong>, the number of requests to read the previous row in key order. This read method is mainly used to optimize <strong>ORDER BY ... DESC</strong>.</li>' +
+ '<li><strong>read rnd</strong>, the number of requests to read a row based on a fixed position. A high value indicates you are doing a lot of queries that require sorting of the result. You probably have a lot of queries that require MySQL to scan entire tables or you have joins that do not use keys properly.</li>' +
+ '<li><strong>read rnd next</strong>, the number of requests to read the next row in the data file. This value is high if you are doing a lot of table scans. Generally this suggests that your tables are not properly indexed or that your queries are not written to take advantage of the indexes you have.</li>' +
+ '<li><strong>rollback</strong>, the number of requests for a storage engine to perform a rollback operation.</li>' +
+ '<li><strong>savepoint</strong>, the number of requests for a storage engine to place a savepoint.</li>' +
+ '<li><strong>savepoint rollback</strong>, the number of requests for a storage engine to roll back to a savepoint.</li>' +
+ '<li><strong>update</strong>, the number of requests to update a row in a table.</li>' +
+ '<li><strong>write</strong>, the number of requests to insert a row in a table.</li>' +
+ '</ul>'
+ },
+
+ 'mysql.table_locks': {
+ info: 'MySQL table locks counters: <ul>' +
+ '<li><strong>immediate</strong>, the number of times that a request for a table lock could be granted immediately.</li>' +
+ '<li><strong>waited</strong>, the number of times that a request for a table lock could not be granted immediately and a wait was needed. If this is high and you have performance problems, you should first optimize your queries, and then either split your table or tables or use replication.</li>' +
+ '</ul>'
+ },
+
+ 'mysql.innodb_deadlocks': {
+ info: 'A deadlock happens when two or more transactions mutually hold and request for locks, creating a cycle of dependencies. For more information about <a href="https://dev.mysql.com/doc/refman/5.7/en/innodb-deadlocks-handling.html" target="_blank">how to minimize and handle deadlocks</a>.'
+ },
+
+ 'mysql.galera_cluster_status': {
+ info:
+ '<code>-1</code>: unknown, ' +
+ '<code>0</code>: primary (primary group configuration, quorum present), ' +
+ '<code>1</code>: non-primary (non-primary group configuration, quorum lost), ' +
+ '<code>2</code>: disconnected(not connected to group, retrying).'
+ },
+
+ 'mysql.galera_cluster_state': {
+ info:
+ '<code>0</code>: undefined, ' +
+ '<code>1</code>: joining, ' +
+ '<code>2</code>: donor/desynced, ' +
+ '<code>3</code>: joined, ' +
+ '<code>4</code>: synced.'
+ },
+
+ 'mysql.galera_cluster_weight': {
+ info: 'The value is counted as a sum of <code>pc.weight</code> of the nodes in the current Primary Component.'
+ },
+
+ 'mysql.galera_connected': {
+ info: '<code>0</code> means that the node has not yet connected to any of the cluster components. ' +
+ 'This may be due to misconfiguration.'
+ },
+
+ 'mysql.open_transactions': {
+ info: 'The number of locally running transactions which have been registered inside the wsrep provider. ' +
+ 'This means transactions which have made operations which have caused write set population to happen. ' +
+ 'Transactions which are read only are not counted.'
+ },
+
+
+ // ------------------------------------------------------------------------
+ // POSTGRESQL
+
+
+ 'postgres.db_stat_blks': {
+ info: 'Blocks reads from disk or cache.<ul>' +
+ '<li><strong>blks_read:</strong> number of disk blocks read in this database.</li>' +
+ '<li><strong>blks_hit:</strong> number of times disk blocks were found already in the buffer cache, so that a read was not necessary (this only includes hits in the PostgreSQL buffer cache, not the operating system's file system cache)</li>' +
+ '</ul>'
+ },
+ 'postgres.db_stat_tuple_write': {
+ info: '<ul><li>Number of rows inserted/updated/deleted.</li>' +
+ '<li><strong>conflicts:</strong> number of queries canceled due to conflicts with recovery in this database. (Conflicts occur only on standby servers; see <a href="https://www.postgresql.org/docs/10/static/monitoring-stats.html#PG-STAT-DATABASE-CONFLICTS-VIEW" target="_blank">pg_stat_database_conflicts</a> for details.)</li>' +
+ '</ul>'
+ },
+ 'postgres.db_stat_temp_bytes': {
+ info: 'Temporary files can be created on disk for sorts, hashes, and temporary query results.'
+ },
+ 'postgres.db_stat_temp_files': {
+ info: '<ul>' +
+ '<li><strong>files:</strong> number of temporary files created by queries. All temporary files are counted, regardless of why the temporary file was created (e.g., sorting or hashing).</li>' +
+ '</ul>'
+ },
+ 'postgres.archive_wal': {
+ info: 'WAL archiving.<ul>' +
+ '<li><strong>total:</strong> total files.</li>' +
+ '<li><strong>ready:</strong> WAL waiting to be archived.</li>' +
+ '<li><strong>done:</strong> WAL successfully archived. ' +
+ 'Ready WAL can indicate archive_command is in error, see <a href="https://www.postgresql.org/docs/current/static/continuous-archiving.html" target="_blank">Continuous Archiving and Point-in-Time Recovery</a>.</li>' +
+ '</ul>'
+ },
+ 'postgres.checkpointer': {
+ info: 'Number of checkpoints.<ul>' +
+ '<li><strong>scheduled:</strong> when checkpoint_timeout is reached.</li>' +
+ '<li><strong>requested:</strong> when max_wal_size is reached.</li>' +
+ '</ul>' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/static/wal-configuration.html" target="_blank">WAL Configuration</a>.'
+ },
+ 'postgres.autovacuum': {
+ info: 'PostgreSQL databases require periodic maintenance known as vacuuming. For many installations, it is sufficient to let vacuuming be performed by the autovacuum daemon. ' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/static/routine-vacuuming.html#AUTOVACUUM" target="_blank">The Autovacuum Daemon</a>.'
+ },
+ 'postgres.standby_delta': {
+ info: 'Streaming replication delta.<ul>' +
+ '<li><strong>sent_delta:</strong> replication delta sent to standby.</li>' +
+ '<li><strong>write_delta:</strong> replication delta written to disk by this standby.</li>' +
+ '<li><strong>flush_delta:</strong> replication delta flushed to disk by this standby server.</li>' +
+ '<li><strong>replay_delta:</strong> replication delta replayed into the database on this standby server.</li>' +
+ '</ul>' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/static/warm-standby.html#SYNCHRONOUS-REPLICATION" target="_blank">Synchronous Replication</a>.'
+ },
+ 'postgres.replication_slot': {
+ info: 'Replication slot files.<ul>' +
+ '<li><strong>wal_keeped:</strong> WAL files retained by each replication slots.</li>' +
+ '<li><strong>pg_replslot_files:</strong> files present in pg_replslot.</li>' +
+ '</ul>' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/static/warm-standby.html#STREAMING-REPLICATION-SLOTS" target="_blank">Replication Slots</a>.'
+ },
+ 'postgres.backend_usage': {
+ info: 'Connections usage against maximum connections allowed, as defined in the <i>max_connections</i> setting.<ul>' +
+ '<li><strong>available:</strong> maximum new connections allowed.</li>' +
+ '<li><strong>used:</strong> connections currently in use.</li>' +
+ '</ul>' +
+ 'Assuming non-superuser accounts are being used to connect to Postgres (so <i>superuser_reserved_connections</i> are subtracted from <i>max_connections</i>).<br/>' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/runtime-config-connection.html" target="_blank">Connections and Authentication</a>.'
+ },
+
+
+ // ------------------------------------------------------------------------
+ // APACHE
+
+ 'apache.connections': {
+ colors: NETDATA.colors[4],
+ mainheads: [
+ netdataDashboard.gaugeChart('Connections', '12%', '', NETDATA.colors[4])
+ ]
+ },
+
+ 'apache.requests': {
+ colors: NETDATA.colors[0],
+ mainheads: [
+ netdataDashboard.gaugeChart('Requests', '12%', '', NETDATA.colors[0])
+ ]
+ },
+
+ 'apache.net': {
+ colors: NETDATA.colors[3],
+ mainheads: [
+ netdataDashboard.gaugeChart('Bandwidth', '12%', '', NETDATA.colors[3])
+ ]
+ },
+
+ 'apache.workers': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="busy"'
+ + ' data-append-options="percentage"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Workers Utilization"'
+ + ' data-units="percentage %"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'apache.bytesperreq': {
+ colors: NETDATA.colors[3],
+ height: 0.5
+ },
+
+ 'apache.reqpersec': {
+ colors: NETDATA.colors[4],
+ height: 0.5
+ },
+
+ 'apache.bytespersec': {
+ colors: NETDATA.colors[6],
+ height: 0.5
+ },
+
+
+ // ------------------------------------------------------------------------
+ // LIGHTTPD
+
+ 'lighttpd.connections': {
+ colors: NETDATA.colors[4],
+ mainheads: [
+ netdataDashboard.gaugeChart('Connections', '12%', '', NETDATA.colors[4])
+ ]
+ },
+
+ 'lighttpd.requests': {
+ colors: NETDATA.colors[0],
+ mainheads: [
+ netdataDashboard.gaugeChart('Requests', '12%', '', NETDATA.colors[0])
+ ]
+ },
+
+ 'lighttpd.net': {
+ colors: NETDATA.colors[3],
+ mainheads: [
+ netdataDashboard.gaugeChart('Bandwidth', '12%', '', NETDATA.colors[3])
+ ]
+ },
+
+ 'lighttpd.workers': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="busy"'
+ + ' data-append-options="percentage"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Servers Utilization"'
+ + ' data-units="percentage %"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'lighttpd.bytesperreq': {
+ colors: NETDATA.colors[3],
+ height: 0.5
+ },
+
+ 'lighttpd.reqpersec': {
+ colors: NETDATA.colors[4],
+ height: 0.5
+ },
+
+ 'lighttpd.bytespersec': {
+ colors: NETDATA.colors[6],
+ height: 0.5
+ },
+
+ // ------------------------------------------------------------------------
+ // NGINX
+
+ 'nginx.connections': {
+ colors: NETDATA.colors[4],
+ mainheads: [
+ netdataDashboard.gaugeChart('Connections', '12%', '', NETDATA.colors[4])
+ ]
+ },
+
+ 'nginx.requests': {
+ colors: NETDATA.colors[0],
+ mainheads: [
+ netdataDashboard.gaugeChart('Requests', '12%', '', NETDATA.colors[0])
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // HTTP check
+
+ 'httpcheck.responsetime': {
+ info: 'The <code>response time</code> describes the time passed between request and response. ' +
+ 'Currently, the accuracy of the response time is low and should be used as reference only.'
+ },
+
+ 'httpcheck.responselength': {
+ info: 'The <code>response length</code> counts the number of characters in the response body. For static pages, this should be mostly constant.'
+ },
+
+ 'httpcheck.status': {
+ valueRange: "[0, 1]",
+ info: 'This chart verifies the response of the webserver. Each status dimension will have a value of <code>1</code> if triggered. ' +
+ 'Dimension <code>success</code> is <code>1</code> only if all constraints are satisfied. ' +
+ 'This chart is most useful for alarms or third-party apps.'
+ },
+
+ // ------------------------------------------------------------------------
+ // NETDATA
+
+ 'netdata.response_time': {
+ info: 'The netdata API response time measures the time netdata needed to serve requests. This time includes everything, from the reception of the first byte of a request, to the dispatch of the last byte of its reply, therefore it includes all network latencies involved (i.e. a client over a slow network will influence these metrics).'
+ },
+
+ // ------------------------------------------------------------------------
+ // RETROSHARE
+
+ 'retroshare.bandwidth': {
+ info: 'RetroShare inbound and outbound traffic.',
+ mainheads: [
+ netdataDashboard.gaugeChart('Received', '12%', 'bandwidth_down_kb'),
+ netdataDashboard.gaugeChart('Sent', '12%', 'bandwidth_up_kb')
+ ]
+ },
+
+ 'retroshare.peers': {
+ info: 'Number of (connected) RetroShare friends.',
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="peers_connected"'
+ + ' data-append-options="friends"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="connected friends"'
+ + ' data-units=""'
+ + ' data-width="8%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'retroshare.dht': {
+ info: 'Statistics about RetroShare\'s DHT. These values are estimated!'
+ },
+
+ // ------------------------------------------------------------------------
+ // fping
+
+ 'fping.quality': {
+ colors: NETDATA.colors[10],
+ height: 0.5
+ },
+
+ 'fping.packets': {
+ height: 0.5
+ },
+
+
+ // ------------------------------------------------------------------------
+ // containers
+
+ 'cgroup.cpu_limit': {
+ valueRange: "[0, null]",
+ mainheads: [
+ function (os, id) {
+ void(os);
+ cgroupCPULimitIsSet = 1;
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="used"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="CPU"'
+ + ' data-units="%"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'cgroup.cpu': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ if (cgroupCPULimitIsSet === 0) {
+ return '<div data-netdata="' + id + '"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="CPU"'
+ + ' data-units="%"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' role="application"></div>';
+ } else
+ return '';
+ }
+ ]
+ },
+
+ 'cgroup.mem_usage_limit': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ cgroupMemLimitIsSet = 1;
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="used"'
+ + ' data-append-options="percentage"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Memory"'
+ + ' data-units="%"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'cgroup.mem_usage': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ if (cgroupMemLimitIsSet === 0) {
+ return '<div data-netdata="' + id + '"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Memory"'
+ + ' data-units="MB"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' role="application"></div>';
+ }
+ else
+ return '';
+ }
+ ]
+ },
+
+ 'cgroup.throttle_io': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="read"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Read Disk I/O"'
+ + ' data-units="KB/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' role="application"></div>';
+ },
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="write"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Write Disk I/O"'
+ + ' data-units="KB/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // beanstalkd
+ // system charts
+ 'beanstalk.cpu_usage': {
+ info: 'Amount of CPU Time for user and system used by beanstalkd.'
+ },
+
+ // This is also a per-tube stat
+ 'beanstalk.jobs_rate': {
+ info: 'The rate of jobs processed by the beanstalkd served.'
+ },
+
+ 'beanstalk.connections_rate': {
+ info: 'Tthe rate of connections opened to beanstalkd.'
+ },
+
+ 'beanstalk.commands_rate': {
+ info: 'The rate of commands received by beanstalkd.'
+ },
+
+ 'beanstalk.current_tubes': {
+ info: 'Total number of current tubes on the server including the default tube (which always exists).'
+ },
+
+ 'beanstalk.current_jobs': {
+ info: 'Current number of jobs in all tubes grouped by status: urgent, ready, reserved, delayed and buried.'
+ },
+
+ 'beanstalk.current_connections': {
+ info: 'Current number of connections group by connection type: written, producers, workers, waiting.'
+ },
+
+ 'beanstalk.binlog': {
+ info: 'The rate of records <code>written</code> to binlog and <code>migrated</code> as part of compaction.'
+ },
+
+ 'beanstalk.uptime': {
+ info: 'Total time beanstalkd server has been up for.'
+ },
+
+ // tube charts
+ 'beanstalk.jobs': {
+ info: 'Number of jobs currently in the tube grouped by status: urgent, ready, reserved, delayed and buried.'
+ },
+
+ 'beanstalk.connections': {
+ info: 'The current number of connections to this tube grouped by connection type; using, waiting and watching.'
+ },
+
+ 'beanstalk.commands': {
+ info: 'The rate of <code>delete</code> and <code>pause</code> commands executed by beanstalkd.'
+ },
+
+ 'beanstalk.pause': {
+ info: 'Shows info on how long the tube has been paused for, and how long is left remaining on the pause.'
+ },
+
+ // ------------------------------------------------------------------------
+ // ceph
+
+ 'ceph.general_usage': {
+ info: 'The usage and available space in all ceph cluster.'
+ },
+
+ 'ceph.general_objects': {
+ info: 'Total number of objects storage on ceph cluster.'
+ },
+
+ 'ceph.general_bytes': {
+ info: 'Cluster read and write data per second.'
+ },
+
+ 'ceph.general_operations': {
+ info: 'Number of read and write operations per second.'
+ },
+
+ 'ceph.general_latency': {
+ info: 'Total of apply and commit latency in all OSDs. The apply latency is the total time taken to flush an update to disk. The commit latency is the total time taken to commit an operation to the journal.'
+ },
+
+ 'ceph.pool_usage': {
+ info: 'The usage space in each pool.'
+ },
+
+ 'ceph.pool_objects': {
+ info: 'Number of objects presents in each pool.'
+ },
+
+ 'ceph.pool_read_bytes': {
+ info: 'The rate of read data per second in each pool.'
+ },
+
+ 'ceph.pool_write_bytes': {
+ info: 'The rate of write data per second in each pool.'
+ },
+
+ 'ceph.pool_read_objects': {
+ info: 'Number of read objects per second in each pool.'
+ },
+
+ 'ceph.pool_write_objects': {
+ info: 'Number of write objects per second in each pool.'
+ },
+
+ 'ceph.osd_usage': {
+ info: 'The usage space in each OSD.'
+ },
+
+ 'ceph.apply_latency': {
+ info: 'Time taken to flush an update in each OSD.'
+ },
+
+ 'ceph.commit_latency': {
+ info: 'Time taken to commit an operation to the journal in each OSD.'
+ },
+
+ // ------------------------------------------------------------------------
+ // web_log
+
+ 'web_log.response_statuses': {
+ info: 'Web server responses by type. <code>success</code> includes <b>1xx</b>, <b>2xx</b>, <b>304</b> and <b>401</b>, <code>error</code> includes <b>5xx</b>, <code>redirect</code> includes <b>3xx</b> except <b>304</b>, <code>bad</code> includes <b>4xx</b> except <b>401</b>, <code>other</code> are all the other responses.',
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="success"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Successful"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="redirect"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Redirects"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="bad"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Bad Requests"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="error"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Server Errors"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.response_codes': {
+ info: 'Web server responses by code family. ' +
+ 'According to the standards <code>1xx</code> are informational responses, ' +
+ '<code>2xx</code> are successful responses, ' +
+ '<code>3xx</code> are redirects (although they include <b>304</b> which is used as "<b>not modified</b>"), ' +
+ '<code>4xx</code> are bad requests, ' +
+ '<code>5xx</code> are internal server errors, ' +
+ '<code>other</code> are non-standard responses, ' +
+ '<code>unmatched</code> counts the lines in the log file that are not matched by the plugin (<a href="https://github.com/netdata/netdata/issues/new?title=web_log%20reports%20unmatched%20lines&body=web_log%20plugin%20reports%20unmatched%20lines.%0A%0AThis%20is%20my%20log:%0A%0A%60%60%60txt%0A%0Aplease%20paste%20your%20web%20server%20log%20here%0A%0A%60%60%60" target="_blank">let us know</a> if you have any unmatched).'
+ },
+
+ 'web_log.response_time': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="avg"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Average Response Time"'
+ + ' data-units="milliseconds"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.detailed_response_codes': {
+ info: 'Number of responses for each response code individually.'
+ },
+
+ 'web_log.requests_per_ipproto': {
+ info: 'Web server requests received per IP protocol version.'
+ },
+
+ 'web_log.clients': {
+ info: 'Unique client IPs accessing the web server, within each data collection iteration. If data collection is <b>per second</b>, this chart shows <b>unique client IPs per second</b>.'
+ },
+
+ 'web_log.clients_all': {
+ info: 'Unique client IPs accessing the web server since the last restart of netdata. This plugin keeps in memory all the unique IPs that have accessed the web server. On very busy web servers (several millions of unique IPs) you may want to disable this chart (check <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/web_log/web_log.conf" target="_blank"><code>/etc/netdata/python.d/web_log.conf</code></a>).'
+ },
+
+ // ------------------------------------------------------------------------
+ // web_log for squid
+
+ 'web_log.squid_response_statuses': {
+ info: 'Squid responses by type. ' +
+ '<code>success</code> includes <b>1xx</b>, <b>2xx</b>, <b>000</b>, <b>304</b>, ' +
+ '<code>error</code> includes <b>5xx</b> and <b>6xx</b>, ' +
+ '<code>redirect</code> includes <b>3xx</b> except <b>304</b>, ' +
+ '<code>bad</code> includes <b>4xx</b>, ' +
+ '<code>other</code> are all the other responses.',
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="success"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Successful"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="redirect"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Redirects"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="bad"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Bad Requests"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="error"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Server Errors"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.squid_response_codes': {
+ info: 'Web server responses by code family. ' +
+ 'According to HTTP standards <code>1xx</code> are informational responses, ' +
+ '<code>2xx</code> are successful responses, ' +
+ '<code>3xx</code> are redirects (although they include <b>304</b> which is used as "<b>not modified</b>"), ' +
+ '<code>4xx</code> are bad requests, ' +
+ '<code>5xx</code> are internal server errors. ' +
+ 'Squid also defines <code>000</code> mostly for UDP requests, and ' +
+ '<code>6xx</code> for broken upstream servers sending wrong headers. ' +
+ 'Finally, <code>other</code> are non-standard responses, and ' +
+ '<code>unmatched</code> counts the lines in the log file that are not matched by the plugin (<a href="https://github.com/netdata/netdata/issues/new?title=web_log%20reports%20unmatched%20lines&body=web_log%20plugin%20reports%20unmatched%20lines.%0A%0AThis%20is%20my%20log:%0A%0A%60%60%60txt%0A%0Aplease%20paste%20your%20web%20server%20log%20here%0A%0A%60%60%60" target="_blank">let us know</a> if you have any unmatched).'
+ },
+
+ 'web_log.squid_duration': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="avg"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Average Response Time"'
+ + ' data-units="milliseconds"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.squid_detailed_response_codes': {
+ info: 'Number of responses for each response code individually.'
+ },
+
+ 'web_log.squid_clients': {
+ info: 'Unique client IPs accessing squid, within each data collection iteration. If data collection is <b>per second</b>, this chart shows <b>unique client IPs per second</b>.'
+ },
+
+ 'web_log.squid_clients_all': {
+ info: 'Unique client IPs accessing squid since the last restart of netdata. This plugin keeps in memory all the unique IPs that have accessed the server. On very busy squid servers (several millions of unique IPs) you may want to disable this chart (check <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/web_log/web_log.conf" target="_blank"><code>/etc/netdata/python.d/web_log.conf</code></a>).'
+ },
+
+ 'web_log.squid_transport_methods': {
+ info: 'Break down per delivery method: <code>TCP</code> are requests on the HTTP port (usually 3128), ' +
+ '<code>UDP</code> are requests on the ICP port (usually 3130), or HTCP port (usually 4128). ' +
+ 'If ICP logging was disabled using the log_icp_queries option, no ICP replies will be logged. ' +
+ '<code>NONE</code> are used to state that squid delivered an unusual response or no response at all. ' +
+ 'Seen with cachemgr requests and errors, usually when the transaction fails before being classified into one of the above outcomes. ' +
+ 'Also seen with responses to <code>CONNECT</code> requests.'
+ },
+
+ 'web_log.squid_code': {
+ info: 'These are combined squid result status codes. A break down per component is given in the following charts. ' +
+ 'Check the <a href="http://wiki.squid-cache.org/SquidFaq/SquidLogs">squid documentation about them</a>.'
+ },
+
+ 'web_log.squid_handling_opts': {
+ info: 'These tags are optional and describe why the particular handling was performed or where the request came from. ' +
+ '<code>CLIENT</code> means that the client request placed limits affecting the response. Usually seen with client issued a <b>no-cache</b>, or analogous cache control command along with the request. Thus, the cache has to validate the object.' +
+ '<code>IMS</code> states that the client sent a revalidation (conditional) request. ' +
+ '<code>ASYNC</code>, is used when the request was generated internally by Squid. Usually this is background fetches for cache information exchanges, background revalidation from stale-while-revalidate cache controls, or ESI sub-objects being loaded. ' +
+ '<code>SWAPFAIL</code> is assigned when the object was believed to be in the cache, but could not be accessed. A new copy was requested from the server. ' +
+ '<code>REFRESH</code> when a revalidation (conditional) request was sent to the server. ' +
+ '<code>SHARED</code> when this request was combined with an existing transaction by collapsed forwarding. NOTE: the existing request is not marked as SHARED. ' +
+ '<code>REPLY</code> when particular handling was requested in the HTTP reply from server or peer. Usually seen on DENIED due to http_reply_access ACLs preventing delivery of servers response object to the client.'
+ },
+
+ 'web_log.squid_object_types': {
+ info: 'These tags are optional and describe what type of object was produced. ' +
+ '<code>NEGATIVE</code> is only seen on HIT responses, indicating the response was a cached error response. e.g. <b>404 not found</b>. ' +
+ '<code>STALE</code> means the object was cached and served stale. This is usually caused by stale-while-revalidate or stale-if-error cache controls. ' +
+ '<code>OFFLINE</code> when the requested object was retrieved from the cache during offline_mode. The offline mode never validates any object. ' +
+ '<code>INVALID</code> when an invalid request was received. An error response was delivered indicating what the problem was. ' +
+ '<code>FAIL</code> is only seen on <code>REFRESH</code> to indicate the revalidation request failed. The response object may be the server provided network error or the stale object which was being revalidated depending on stale-if-error cache control. ' +
+ '<code>MODIFIED</code> is only seen on <code>REFRESH</code> responses to indicate revalidation produced a new modified object. ' +
+ '<code>UNMODIFIED</code> is only seen on <code>REFRESH</code> responses to indicate revalidation produced a <b>304</b> (Not Modified) status, which was relayed to the client. ' +
+ '<code>REDIRECT</code> when squid generated an HTTP redirect response to this request.'
+ },
+
+ 'web_log.squid_cache_events': {
+ info: 'These tags are optional and describe whether the response was loaded from cache, network, or otherwise. ' +
+ '<code>HIT</code> when the response object delivered was the local cache object. ' +
+ '<code>MEM</code> when the response object came from memory cache, avoiding disk accesses. Only seen on HIT responses. ' +
+ '<code>MISS</code> when the response object delivered was the network response object. ' +
+ '<code>DENIED</code> when the request was denied by access controls. ' +
+ '<code>NOFETCH</code> an ICP specific type, indicating service is alive, but not to be used for this request (sent during "-Y" startup, or during frequent failures, a cache in hit only mode will return either UDP_HIT or UDP_MISS_NOFETCH. Neighbours will thus only fetch hits). ' +
+ '<code>TUNNEL</code> when a binary tunnel was established for this transaction.'
+ },
+
+ 'web_log.squid_transport_errors': {
+ info: 'These tags are optional and describe some error conditions which occurred during response delivery (if any). ' +
+ '<code>ABORTED</code> when the response was not completed due to the connection being aborted (usually by the client). ' +
+ '<code>TIMEOUT</code>, when the response was not completed due to a connection timeout.'
+ },
+
+ // ------------------------------------------------------------------------
+ // go web_log
+
+ 'web_log.type_requests': {
+ info: 'Web server responses by type. <code>success</code> includes <b>1xx</b>, <b>2xx</b>, <b>304</b> and <b>401</b>, <code>error</code> includes <b>5xx</b>, <code>redirect</code> includes <b>3xx</b> except <b>304</b>, <code>bad</code> includes <b>4xx</b> except <b>401</b>, <code>other</code> are all the other responses.',
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="success"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Successful"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="redirect"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Redirects"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="bad"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Bad Requests"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="error"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Server Errors"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.request_processing_time': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="avg"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Average Response Time"'
+ + ' data-units="milliseconds"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ // ------------------------------------------------------------------------
+ // Fronius Solar Power
+
+ 'fronius.power': {
+ info: 'Positive <code>Grid</code> values mean that power is coming from the grid. Negative values are excess power that is going back into the grid, possibly selling it. ' +
+ '<code>Photovoltaics</code> is the power generated from the solar panels. ' +
+ '<code>Accumulator</code> is the stored power in the accumulator, if one is present.'
+ },
+
+ 'fronius.autonomy': {
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, 100]",
+ info: 'The <code>Autonomy</code> is the percentage of how autonomous the installation is. An autonomy of 100 % means that the installation is producing more energy than it is needed. ' +
+ 'The <code>Self consumption</code> indicates the ratio between the current power generated and the current load. When it reaches 100 %, the <code>Autonomy</code> declines, since the solar panels can not produce enough energy and need support from the grid.'
+ },
+
+ 'fronius.energy.today': {
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, null]"
+ },
+
+ // ------------------------------------------------------------------------
+ // Stiebel Eltron Heat pump installation
+
+ 'stiebeleltron.system.roomtemp': {
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, null]"
+ },
+
+ // ------------------------------------------------------------------------
+ // Port check
+
+ 'portcheck.latency': {
+ info: 'The <code>latency</code> describes the time spent connecting to a TCP port. No data is sent or received. ' +
+ 'Currently, the accuracy of the latency is low and should be used as reference only.'
+ },
+
+ 'portcheck.status': {
+ valueRange: "[0, 1]",
+ info: 'The <code>status</code> chart verifies the availability of the service. ' +
+ 'Each status dimension will have a value of <code>1</code> if triggered. Dimension <code>success</code> is <code>1</code> only if connection could be established. ' +
+ 'This chart is most useful for alarms and third-party apps.'
+ },
+
+ // ------------------------------------------------------------------------
+
+ 'chrony.system': {
+ info: 'In normal operation, chronyd never steps the system clock, because any jump in the timescale can have adverse consequences for certain application programs. Instead, any error in the system clock is corrected by slightly speeding up or slowing down the system clock until the error has been removed, and then returning to the system clock’s normal speed. A consequence of this is that there will be a period when the system clock (as read by other programs using the <code>gettimeofday()</code> system call, or by the <code>date</code> command in the shell) will be different from chronyd\'s estimate of the current true time (which it reports to NTP clients when it is operating in server mode). The value reported on this line is the difference due to this effect.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'chrony.offsets': {
+ info: '<code>last offset</code> is the estimated local offset on the last clock update. <code>RMS offset</code> is a long-term average of the offset value.',
+ height: 0.5
+ },
+
+ 'chrony.stratum': {
+ info: 'The <code>stratum</code> indicates how many hops away from a computer with an attached reference clock we are. Such a computer is a stratum-1 computer.',
+ decimalDigits: 0,
+ height: 0.5
+ },
+
+ 'chrony.root': {
+ info: 'Estimated delays against the root time server this system is synchronized with. <code>delay</code> is the total of the network path delays to the stratum-1 computer from which the computer is ultimately synchronised. <code>dispersion</code> is the total dispersion accumulated through all the computers back to the stratum-1 computer from which the computer is ultimately synchronised. Dispersion is due to system clock resolution, statistical measurement variations etc.'
+ },
+
+ 'chrony.frequency': {
+ info: 'The <code>frequency</code> is the rate by which the system\'s clock would be would be wrong if chronyd was not correcting it. It is expressed in ppm (parts per million). For example, a value of 1ppm would mean that when the system\'s clock thinks it has advanced 1 second, it has actually advanced by 1.000001 seconds relative to true time.',
+ colors: NETDATA.colors[0]
+ },
+
+ 'chrony.residualfreq': {
+ info: 'This shows the <code>residual frequency</code> for the currently selected reference source. ' +
+ 'It reflects any difference between what the measurements from the reference source indicate the ' +
+ 'frequency should be and the frequency currently being used. The reason this is not always zero is ' +
+ 'that a smoothing procedure is applied to the frequency. Each time a measurement from the reference ' +
+ 'source is obtained and a new residual frequency computed, the estimated accuracy of this residual ' +
+ 'is compared with the estimated accuracy (see <code>skew</code>) of the existing frequency value. ' +
+ 'A weighted average is computed for the new frequency, with weights depending on these accuracies. ' +
+ 'If the measurements from the reference source follow a consistent trend, the residual will be ' +
+ 'driven to zero over time.',
+ height: 0.5,
+ colors: NETDATA.colors[3]
+ },
+
+ 'chrony.skew': {
+ info: 'The estimated error bound on the frequency.',
+ height: 0.5,
+ colors: NETDATA.colors[5]
+ },
+
+ 'couchdb.active_tasks': {
+ info: 'Active tasks running on this CouchDB <b>cluster</b>. Four types of tasks currently exist: indexer (view building), replication, database compaction and view compaction.'
+ },
+
+ 'couchdb.replicator_jobs': {
+ info: 'Detailed breakdown of any replication jobs in progress on this node. For more information, see the <a href="http://docs.couchdb.org/en/latest/replication/replicator.html">replicator documentation</a>.'
+ },
+
+ 'couchdb.open_files': {
+ info: 'Count of all files held open by CouchDB. If this value seems pegged at 1024 or 4096, your server process is probably hitting the open file handle limit and <a href="http://docs.couchdb.org/en/latest/maintenance/performance.html#pam-and-ulimit">needs to be increased.</a>'
+ },
+
+ 'btrfs.disk': {
+ info: 'Physical disk usage of BTRFS. The disk space reported here is the raw physical disk space assigned to the BTRFS volume (i.e. <b>before any RAID levels</b>). BTRFS uses a two-stage allocator, first allocating large regions of disk space for one type of block (data, metadata, or system), and then using a regular block allocator inside those regions. <code>unallocated</code> is the physical disk space that is not allocated yet and is available to become data, metdata or system on demand. When <code>unallocated</code> is zero, all available disk space has been allocated to a specific function. Healthy volumes should ideally have at least five percent of their total space <code>unallocated</code>. You can keep your volume healthy by running the <code>btrfs balance</code> command on it regularly (check <code>man btrfs-balance</code> for more info). Note that some of the space listed as <code>unallocated</code> may not actually be usable if the volume uses devices of different sizes.',
+ colors: [NETDATA.colors[12]]
+ },
+
+ 'btrfs.data': {
+ info: 'Logical disk usage for BTRFS data. Data chunks are used to store the actual file data (file contents). The disk space reported here is the usable allocation (i.e. after any striping or replication). Healthy volumes should ideally have no more than a few GB of free space reported here persistently. Running <code>btrfs balance</code> can help here.'
+ },
+
+ 'btrfs.metadata': {
+ info: 'Logical disk usage for BTRFS metadata. Metadata chunks store most of the filesystem interal structures, as well as information like directory structure and file names. The disk space reported here is the usable allocation (i.e. after any striping or replication). Healthy volumes should ideally have no more than a few GB of free space reported here persistently. Running <code>btrfs balance</code> can help here.'
+ },
+
+ 'btrfs.system': {
+ info: 'Logical disk usage for BTRFS system. System chunks store information about the allocation of other chunks. The disk space reported here is the usable allocation (i.e. after any striping or replication). The values reported here should be relatively small compared to Data and Metadata, and will scale with the volume size and overall space usage.'
+ },
+
+ // ------------------------------------------------------------------------
+ // RabbitMQ
+
+ // info: the text above the charts
+ // heads: the representation of the chart at the top the subsection (second level menu)
+ // mainheads: the representation of the chart at the top of the section (first level menu)
+ // colors: the dimension colors of the chart (the default colors are appended)
+ // height: the ratio of the chart height relative to the default
+
+ 'rabbitmq.queued_messages': {
+ info: 'Overall total of ready and unacknowledged queued messages. Messages that are delivered immediately are not counted here.'
+ },
+
+ 'rabbitmq.message_rates': {
+ info: 'Overall messaging rates including acknowledgements, delieveries, redeliveries, and publishes.'
+ },
+
+ 'rabbitmq.global_counts': {
+ info: 'Overall totals for channels, consumers, connections, queues and exchanges.'
+ },
+
+ 'rabbitmq.file_descriptors': {
+ info: 'Total number of used filed descriptors. See <code><a href="https://www.rabbitmq.com/production-checklist.html#resource-limits-file-handle-limit" target="_blank">Open File Limits</a></code> for further details.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.sockets': {
+ info: 'Total number of used socket descriptors. Each used socket also counts as a used file descriptor. See <code><a href="https://www.rabbitmq.com/production-checklist.html#resource-limits-file-handle-limit" target="_blank">Open File Limits</a></code> for further details.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.processes': {
+ info: 'Total number of processes running within the Erlang VM. This is not the same as the number of processes running on the host.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.erlang_run_queue': {
+ info: 'Number of Erlang processes the Erlang schedulers have queued to run.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.memory': {
+ info: 'Total amount of memory used by the RabbitMQ. This is a complex statistic that can be further analyzed in the management UI. See <code><a href="https://www.rabbitmq.com/production-checklist.html#resource-limits-ram" target="_blank">Memory</a></code> for further details.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.disk_space': {
+ info: 'Total amount of disk space consumed by the message store(s). See <code><a href="https://www.rabbitmq.com/production-checklist.html#resource-limits-disk-space" target=_"blank">Disk Space Limits</a></code> for further details.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.queue_messages': {
+ info: 'Total amount of messages and their states in this queue.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.queue_messages_stats': {
+ info: 'Overall messaging rates including acknowledgements, delieveries, redeliveries, and publishes.',
+ colors: NETDATA.colors[3]
+ },
+
+ // ------------------------------------------------------------------------
+ // ntpd
+
+ 'ntpd.sys_offset': {
+ info: 'For hosts without any time critical services an offset of < 100 ms should be acceptable even with high network latencies. For hosts with time critical services an offset of about 0.01 ms or less can be achieved by using peers with low delays and configuring optimal <b>poll exponent</b> values.',
+ colors: NETDATA.colors[4]
+ },
+
+ 'ntpd.sys_jitter': {
+ info: 'The jitter statistics are exponentially-weighted RMS averages. The system jitter is defined in the NTPv4 specification; the clock jitter statistic is computed by the clock discipline module.'
+ },
+
+ 'ntpd.sys_frequency': {
+ info: 'The frequency offset is shown in ppm (parts per million) relative to the frequency of the system. The frequency correction needed for the clock can vary significantly between boots and also due to external influences like temperature or radiation.',
+ colors: NETDATA.colors[2],
+ height: 0.6
+ },
+
+ 'ntpd.sys_wander': {
+ info: 'The wander statistics are exponentially-weighted RMS averages.',
+ colors: NETDATA.colors[3],
+ height: 0.6
+ },
+
+ 'ntpd.sys_rootdelay': {
+ info: 'The rootdelay is the round-trip delay to the primary reference clock, similar to the delay shown by the <code>ping</code> command. A lower delay should result in a lower clock offset.',
+ colors: NETDATA.colors[1]
+ },
+
+ 'ntpd.sys_stratum': {
+ info: 'The distance in "hops" to the primary reference clock',
+ colors: NETDATA.colors[5],
+ height: 0.3
+ },
+
+ 'ntpd.sys_tc': {
+ info: 'Time constants and poll intervals are expressed as exponents of 2. The default poll exponent of 6 corresponds to a poll interval of 64 s. For typical Internet paths, the optimum poll interval is about 64 s. For fast LANs with modern computers, a poll exponent of 4 (16 s) is appropriate. The <a href="http://doc.ntp.org/current-stable/poll.html">poll process</a> sends NTP packets at intervals determined by the clock discipline algorithm.',
+ height: 0.5
+ },
+
+ 'ntpd.sys_precision': {
+ colors: NETDATA.colors[6],
+ height: 0.2
+ },
+
+ 'ntpd.peer_offset': {
+ info: 'The offset of the peer clock relative to the system clock in milliseconds. Smaller values here weight peers more heavily for selection after the initial synchronization of the local clock. For a system providing time service to other systems, these should be as low as possible.'
+ },
+
+ 'ntpd.peer_delay': {
+ info: 'The round-trip time (RTT) for communication with the peer, similar to the delay shown by the <code>ping</code> command. Not as critical as either the offset or jitter, but still factored into the selection algorithm (because as a general rule, lower delay means more accurate time). In most cases, it should be below 100ms.'
+ },
+
+ 'ntpd.peer_dispersion': {
+ info: 'This is a measure of the estimated error between the peer and the local system. Lower values here are better.'
+ },
+
+ 'ntpd.peer_jitter': {
+ info: 'This is essentially a remote estimate of the peer\'s <code>system_jitter</code> value. Lower values here weight highly in favor of peer selection, and this is a good indicator of overall quality of a given time server (good servers will have values not exceeding single digit milliseconds here, with high quality stratum one servers regularly having sub-millisecond jitter).'
+ },
+
+ 'ntpd.peer_xleave': {
+ info: 'This variable is used in interleaved mode (used only in NTP symmetric and broadcast modes). See <a href="http://doc.ntp.org/current-stable/xleave.html">NTP Interleaved Modes</a>.'
+ },
+
+ 'ntpd.peer_rootdelay': {
+ info: 'For a stratum 1 server, this is the access latency for the reference clock. For lower stratum servers, it is the sum of the <code>peer_delay</code> and <code>peer_rootdelay</code> for the system they are syncing off of. Similarly to <code>peer_delay</code>, lower values here are technically better, but have limited influence in peer selection.'
+ },
+
+ 'ntpd.peer_rootdisp': {
+ info: 'Is the same as <code>peer_rootdelay</code>, but measures accumulated <code>peer_dispersion</code> instead of accumulated <code>peer_delay</code>.'
+ },
+
+ 'ntpd.peer_hmode': {
+ info: 'The <code>peer_hmode</code> and <code>peer_pmode</code> variables give info about what mode the packets being sent to and received from a given peer are. Mode 1 is symmetric active (both the local system and the remote peer have each other declared as peers in <code>/etc/ntp.conf</code>), Mode 2 is symmetric passive (only one side has the other declared as a peer), Mode 3 is client, Mode 4 is server, and Mode 5 is broadcast (also used for multicast and manycast operation).',
+ height: 0.2
+ },
+
+ 'ntpd.peer_pmode': {
+ height: 0.2
+ },
+
+ 'ntpd.peer_hpoll': {
+ info: 'The <code>peer_hpoll</code> and <code>peer_ppoll</code> variables are log2 representations of the polling interval in seconds.',
+ height: 0.5
+ },
+
+ 'ntpd.peer_ppoll': {
+ height: 0.5
+ },
+
+ 'ntpd.peer_precision': {
+ height: 0.2
+ },
+
+ 'spigotmc.tps': {
+ info: 'The running 1, 5, and 15 minute average number of server ticks per second. An idealized server will show 20.0 for all values, but in practice this almost never happens. Typical servers should show approximately 19.98-20.0 here. Lower values indicate progressively more server-side lag (and thus that you need better hardware for your server or a lower user limit). For every 0.05 ticks below 20, redstone clocks will lag behind by approximately 0.25%. Values below approximately 19.50 may interfere with complex free-running redstone circuits and will noticeably slow down growth.'
+ },
+
+ 'spigotmc.users': {
+ info: 'The number of currently connect users on the monitored Spigot server.'
+ },
+
+ 'boinc.tasks': {
+ info: 'The total number of tasks and the number of active tasks. Active tasks are those which are either currently being processed, or are partialy processed but suspended.'
+ },
+
+ 'boinc.states': {
+ info: 'Counts of tasks in each task state. The normal sequence of states is <code>New</code>, <code>Downloading</code>, <code>Ready to Run</code>, <code>Uploading</code>, <code>Uploaded</code>. Tasks which are marked <code>Ready to Run</code> may be actively running, or may be waiting to be scheduled. <code>Compute Errors</code> are tasks which failed for some reason during execution. <code>Aborted</code> tasks were manually cancelled, and will not be processed. <code>Failed Uploads</code> are otherwise finished tasks which failed to upload to the server, and usually indicate networking issues.'
+ },
+
+ 'boinc.sched': {
+ info: 'Counts of active tasks in each scheduling state. <code>Scheduled</code> tasks are the ones which will run if the system is permitted to process tasks. <code>Preempted</code> tasks are on standby, and will run if a <code>Scheduled</code> task stops running for some reason. <code>Uninitialized</code> tasks should never be present, and indicate tha the scheduler has not tried to schedule them yet.'
+ },
+
+ 'boinc.process': {
+ info: 'Counts of active tasks in each process state. <code>Executing</code> tasks are running right now. <code>Suspended</code> tasks have an associated process, but are not currently running (either because the system isn\'t processing any tasks right now, or because they have been preempted by higher priority tasks). <code>Quit</code> tasks are exiting gracefully. <code>Aborted</code> tasks exceeded some resource limit, and are being shut down. <code>Copy Pending</code> tasks are waiting on a background file transfer to finish. <code>Uninitialized</code> tasks do not have an associated process yet.'
+ },
+
+ 'w1sensor.temp': {
+ info: 'Temperature derived from 1-Wire temperature sensors.'
+ },
+
+ 'logind.sessions': {
+ info: 'Shows the number of active sessions of each type tracked by logind.'
+ },
+
+ 'logind.users': {
+ info: 'Shows the number of active users of each type tracked by logind.'
+ },
+
+ 'logind.seats': {
+ info: 'Shows the number of active seats tracked by logind. Each seat corresponds to a combination of a display device and input device providing a physical presence for the system.'
+ },
+
+ // ------------------------------------------------------------------------
+ // ProxySQL
+
+ 'proxysql.pool_status': {
+ info: 'The status of the backend servers. ' +
+ '<code>1=ONLINE</code> backend server is fully operational, ' +
+ '<code>2=SHUNNED</code> backend sever is temporarily taken out of use because of either too many connection errors in a time that was too short, or replication lag exceeded the allowed threshold, ' +
+ '<code>3=OFFLINE_SOFT</code> when a server is put into OFFLINE_SOFT mode, new incoming connections aren\'t accepted anymore, while the existing connections are kept until they became inactive. In other words, connections are kept in use until the current transaction is completed. This allows to gracefully detach a backend, ' +
+ '<code>4=OFFLINE_HARD</code> when a server is put into OFFLINE_HARD mode, the existing connections are dropped, while new incoming connections aren\'t accepted either. This is equivalent to deleting the server from a hostgroup, or temporarily taking it out of the hostgroup for maintenance work, ' +
+ '<code>-1</code> Unknown status.'
+ },
+
+ 'proxysql.pool_net': {
+ info: 'The amount of data sent to/received from the backend ' +
+ '(This does not include metadata (packets\' headers, OK/ERR packets, fields\' description, etc).'
+ },
+
+ 'proxysql.pool_overall_net': {
+ info: 'The amount of data sent to/received from the all backends ' +
+ '(This does not include metadata (packets\' headers, OK/ERR packets, fields\' description, etc).'
+ },
+
+ 'proxysql.questions': {
+ info: '<code>questions</code> total number of queries sent from frontends, ' +
+ '<code>slow_queries</code> number of queries that ran for longer than the threshold in milliseconds defined in global variable <code>mysql-long_query_time</code>. '
+ },
+
+ 'proxysql.connections': {
+ info: '<code>aborted</code> number of frontend connections aborted due to invalid credential or max_connections reached, ' +
+ '<code>connected</code> number of frontend connections currently connected, ' +
+ '<code>created</code> number of frontend connections created, ' +
+ '<code>non_idle</code> number of frontend connections that are not currently idle. '
+ },
+
+ 'proxysql.pool_latency': {
+ info: 'The currently ping time in microseconds, as reported from Monitor.'
+ },
+
+ 'proxysql.queries': {
+ info: 'The number of queries routed towards this particular backend server.'
+ },
+
+ 'proxysql.pool_used_connections': {
+ info: 'The number of connections are currently used by ProxySQL for sending queries to the backend server.'
+ },
+
+ 'proxysql.pool_free_connections': {
+ info: 'The number of connections are currently free. They are kept open in order to minimize the time cost of sending a query to the backend server.'
+ },
+
+ 'proxysql.pool_ok_connections': {
+ info: 'The number of connections were established successfully.'
+ },
+
+ 'proxysql.pool_error_connections': {
+ info: 'The number of connections weren\'t established successfully.'
+ },
+
+ 'proxysql.commands_count': {
+ info: 'The total number of commands of that type executed'
+ },
+
+ 'proxysql.commands_duration': {
+ info: 'The total time spent executing commands of that type, in ms'
+ },
+
+ // ------------------------------------------------------------------------
+ // Power Supplies
+
+ 'powersupply.capacity': {
+ info: undefined
+ },
+
+ 'powersupply.charge': {
+ info: undefined
+ },
+
+ 'powersupply.energy': {
+ info: undefined
+ },
+
+ 'powersupply.voltage': {
+ info: undefined
+ },
+
+ // ------------------------------------------------------------------------
+ // VMware vSphere
+
+ // Host specific
+ 'vsphere.host_mem_usage_percentage': {
+ info: 'Percentage of used machine memory: <code>consumed</code> / <code>machine-memory-size</code>.'
+ },
+
+ 'vsphere.host_mem_usage': {
+ info:
+ '<code>granted</code> is amount of machine memory that is mapped for a host, ' +
+ 'it equals sum of all granted metrics for all powered-on virtual machines, plus machine memory for vSphere services on the host. ' +
+ '<code>consumed</code> is amount of machine memory used on the host, it includes memory used by the Service Console, the VMkernel, vSphere services, plus the total consumed metrics for all running virtual machines. ' +
+ '<code>consumed</code> = <code>total host memory</code> - <code>free host memory</code>.' +
+ '<code>active</code> is sum of all active metrics for all powered-on virtual machines plus vSphere services (such as COS, vpxa) on the host.' +
+ '<code>shared</code> is sum of all shared metrics for all powered-on virtual machines, plus amount for vSphere services on the host. ' +
+ '<code>sharedcommon</code> is amount of machine memory that is shared by all powered-on virtual machines and vSphere services on the host. ' +
+ '<code>shared</code> - <code>sharedcommon</code> = machine memory (host memory) savings (KB). ' +
+ 'For details see <a href="https://docs.vmware.com/en/VMware-vSphere/6.5/com.vmware.vsphere.resmgmt.doc/GUID-BFDC988B-F53D-4E97-9793-A002445AFAE1.html">Measuring and Differentiating Types of Memory Usage</a> and ' +
+ '<a href="https://www.vmware.com/support/developer/converter-sdk/conv51_apireference/memory_counters.html">Memory Counters</a> articles.'
+ },
+
+ 'vsphere.host_mem_swap_rate': {
+ info:
+ 'This statistic refers to VMkernel swapping and not to guest OS swapping. ' +
+ '<code>in</code> is sum of <code>swapinRate</code> values for all powered-on virtual machines on the host.' +
+ '<code>swapinRate</code> is rate at which VMKernel reads data into machine memory from the swap file. ' +
+ '<code>out</code> is sum of <code>swapoutRate</code> values for all powered-on virtual machines on the host.' +
+ '<code>swapoutRate</code> is rate at which VMkernel writes to the virtual machine’s swap file from machine memory.'
+ },
+
+ // VM specific
+ 'vsphere.vm_mem_usage_percentage': {
+ info: 'Percentage of used virtual machine “physical” memory: <code>actvive</code> / <code>virtual machine configured size</code>.'
+ },
+
+ 'vsphere.vm_mem_usage': {
+ info:
+ '<code>granted</code> is amount of guest “physical” memory that is mapped to machine memory, it includes <code>shared</code> memory amount. ' +
+ '<code>consumed</code> is amount of guest “physical” memory consumed by the virtual machine for guest memory, ' +
+ '<code>consumed</code> = <code>granted</code> - <code>memory saved due to memory sharing</code>. ' +
+ '<code>active</code> is amount of memory that is actively used, as estimated by VMkernel based on recently touched memory pages. ' +
+ '<code>shared</code> is amount of guest “physical” memory shared with other virtual machines (through the VMkernel’s transparent page-sharing mechanism, a RAM de-duplication technique). ' +
+ 'For details see <a href="https://docs.vmware.com/en/VMware-vSphere/6.5/com.vmware.vsphere.resmgmt.doc/GUID-BFDC988B-F53D-4E97-9793-A002445AFAE1.html">Measuring and Differentiating Types of Memory Usage</a> and ' +
+ '<a href="https://www.vmware.com/support/developer/converter-sdk/conv51_apireference/memory_counters.html">Memory Counters</a> articles.'
+
+ },
+
+ 'vsphere.vm_mem_swap_rate': {
+ info:
+ 'This statistic refers to VMkernel swapping and not to guest OS swapping. ' +
+ '<code>in</code> is rate at which VMKernel reads data into machine memory from the swap file. ' +
+ '<code>out</code> is rate at which VMkernel writes to the virtual machine’s swap file from machine memory.'
+ },
+
+ 'vsphere.vm_mem_swap': {
+ info:
+ 'This statistic refers to VMkernel swapping and not to guest OS swapping. ' +
+ '<code>swapped</code> is amount of guest physical memory swapped out to the virtual machine\'s swap file by the VMkernel. ' +
+ 'Swapped memory stays on disk until the virtual machine needs it.'
+ },
+
+ // Common
+ 'vsphere.cpu_usage_total': {
+ info: 'Summary CPU usage statistics across all CPUs/cores.'
+ },
+
+ 'vsphere.net_bandwidth_total': {
+ info: 'Summary receive/transmit statistics across all network interfaces.'
+ },
+
+ 'vsphere.net_packets_total': {
+ info: 'Summary receive/transmit statistics across all network interfaces.'
+ },
+
+ 'vsphere.net_errors_total': {
+ info: 'Summary receive/transmit statistics across all network interfaces.'
+ },
+
+ 'vsphere.net_drops_total': {
+ info: 'Summary receive/transmit statistics across all network interfaces.'
+ },
+
+ 'vsphere.disk_usage_total': {
+ info: 'Summary read/write statistics across all disks.'
+ },
+
+ 'vsphere.disk_max_latency': {
+ info: '<code>latency</code> is highest latency value across all disks.'
+ },
+
+ 'vsphere.overall_status': {
+ info: '<code>0</code> is unknown, <code>1</code> is OK, <code>2</code> is might have a problem, <code>3</code> is definitely has a problem.'
+ },
+
+ // ------------------------------------------------------------------------
+ // VCSA
+ 'vcsa.system_health': {
+ info:
+ '<code>-1</code>: unknown; ' +
+ '<code>0</code>: all components are healthy; ' +
+ '<code>1</code>: one or more components might become overloaded soon; ' +
+ '<code>2</code>: one or more components in the appliance might be degraded; ' +
+ '<code>3</code>: one or more components might be in an unusable status and the appliance might become unresponsive soon; ' +
+ '<code>4</code>: no health data is available.'
+ },
+
+ 'vcsa.components_health': {
+ info:
+ '<code>-1</code>: unknown; ' +
+ '<code>0</code>: healthy; ' +
+ '<code>1</code>: healthy, but may have some problems; ' +
+ '<code>2</code>: degraded, and may have serious problems; ' +
+ '<code>3</code>: unavailable, or will stop functioning soon; ' +
+ '<code>4</code>: no health data is available.'
+ },
+
+ 'vcsa.software_updates_health': {
+ info:
+ '<code>softwarepackages</code> represents information on available software updates available in the remote vSphere Update Manager repository.<br>' +
+ '<code>-1</code>: unknown; ' +
+ '<code>0</code>: no updates available; ' +
+ '<code>2</code>: non-security updates are available; ' +
+ '<code>3</code>: security updates are available; ' +
+ '<code>4</code>: an error retrieving information on software updates.'
+ },
+
+ // ------------------------------------------------------------------------
+ // Zookeeper
+
+ 'zookeeper.server_state': {
+ info:
+ '<code>0</code>: unknown, ' +
+ '<code>1</code>: leader, ' +
+ '<code>2</code>: follower, ' +
+ '<code>3</code>: observer, ' +
+ '<code>4</code>: standalone.'
+ },
+
+ // ------------------------------------------------------------------------
+ // Squidlog
+
+ 'squidlog.requests': {
+ info: 'Total number of requests (log lines read). It includes <code>unmatched</code>.'
+ },
+
+ 'squidlog.excluded_requests': {
+ info: '<code>unmatched</code> counts the lines in the log file that are not matched by the plugin parser (<a href="https://github.com/netdata/netdata/issues/new?title=squidlog%20reports%20unmatched%20lines&body=squidlog%20plugin%20reports%20unmatched%20lines.%0A%0AThis%20is%20my%20log:%0A%0A%60%60%60txt%0A%0Aplease%20paste%20your%20squid%20server%20log%20here%0A%0A%60%60%60" target="_blank">let us know</a> if you have any unmatched).'
+ },
+
+ 'squidlog.type_requests': {
+ info: 'Requests by response type:<br>' +
+ '<ul>' +
+ ' <li><code>success</code> includes 1xx, 2xx, 0, 304, 401.</li>' +
+ ' <li><code>error</code> includes 5xx and 6xx.</li>' +
+ ' <li><code>redirect</code> includes 3xx except 304.</li>' +
+ ' <li><code>bad</code> includes 4xx except 401.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.http_status_code_class_responses': {
+ info: 'The HTTP response status code classes. According to <a href="https://tools.ietf.org/html/rfc7231" target="_blank">rfc7231</a>:<br>' +
+ ' <li><code>1xx</code> is informational responses.</li>' +
+ ' <li><code>2xx</code> is successful responses.</li>' +
+ ' <li><code>3xx</code> is redirects.</li>' +
+ ' <li><code>4xx</code> is bad requests.</li>' +
+ ' <li><code>5xx</code> is internal server errors.</li>' +
+ ' </ul>' +
+ 'Squid also uses <code>0</code> for a result code being unavailable, and <code>6xx</code> to signal an invalid header, a proxy error.'
+ },
+
+ 'squidlog.http_status_code_responses': {
+ info: 'Number of responses for each http response status code individually.'
+ },
+
+ 'squidlog.uniq_clients': {
+ info: 'Unique clients (requesting instances), within each data collection iteration. If data collection is <b>per second</b>, this chart shows <b>unique clients per second</b>.'
+ },
+
+ 'squidlog.bandwidth': {
+ info: 'The size is the amount of data delivered to the clients. Mind that this does not constitute the net object size, as headers are also counted. ' +
+ 'Also, failed requests may deliver an error page, the size of which is also logged here.'
+ },
+
+ 'squidlog.response_time': {
+ info: 'The elapsed time considers how many milliseconds the transaction busied the cache. It differs in interpretation between TCP and UDP:' +
+ '<ul>' +
+ ' <li><code>TCP</code> this is basically the time from having received the request to when Squid finishes sending the last byte of the response.</li>' +
+ ' <li><code>UDP</code> this is the time between scheduling a reply and actually sending it.</li>' +
+ ' </ul>' +
+ 'Please note that <b>the entries are logged after the reply finished being sent</b>, not during the lifetime of the transaction.'
+ },
+
+ 'squidlog.cache_result_code_requests': {
+ info: 'The Squid result code is composed of several tags (separated by underscore characters) which describe the response sent to the client. ' +
+ 'Check the <a href="https://wiki.squid-cache.org/SquidFaq/SquidLogs#Squid_result_codes">squid documentation</a> about them.'
+ },
+
+ 'squidlog.cache_result_code_transport_tag_requests': {
+ info: 'These tags are always present and describe delivery method.<br>' +
+ '<ul>' +
+ ' <li><code>TCP</code> requests on the HTTP port (usually 3128).</li>' +
+ ' <li><code>UDP</code> requests on the ICP port (usually 3130) or HTCP port (usually 4128).</li>' +
+ ' <li><code>NONE</code> Squid delivered an unusual response or no response at all. Seen with cachemgr requests and errors, usually when the transaction fails before being classified into one of the above outcomes. Also seen with responses to CONNECT requests.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.cache_result_code_handling_tag_requests': {
+ info: 'These tags are optional and describe why the particular handling was performed or where the request came from.<br>' +
+ '<ul>' +
+ ' <li><code>CF</code> at least one request in this transaction was collapsed. See <a href="http://www.squid-cache.org/Doc/config/collapsed_forwarding/" target="_blank">collapsed_forwarding</a> for more details about request collapsing.</li>' +
+ ' <li><code>CLIENT</code> usually seen with client issued a "no-cache", or analogous cache control command along with the request. Thus, the cache has to validate the object.</li>' +
+ ' <li><code>IMS</code> the client sent a revalidation (conditional) request.</li>' +
+ ' <li><code>ASYNC</code> the request was generated internally by Squid. Usually this is background fetches for cache information exchanges, background revalidation from <i>stale-while-revalidate</i> cache controls, or ESI sub-objects being loaded.</li>' +
+ ' <li><code>SWAPFAIL</code> the object was believed to be in the cache, but could not be accessed. A new copy was requested from the server.</li>' +
+ ' <li><code>REFRESH</code> a revalidation (conditional) request was sent to the server.</li>' +
+ ' <li><code>SHARED</code> this request was combined with an existing transaction by collapsed forwarding.</li>' +
+ ' <li><code>REPLY</code> the HTTP reply from server or peer. Usually seen on <code>DENIED</code> due to <a href="http://www.squid-cache.org/Doc/config/http_reply_access/" target="_blank">http_reply_access</a> ACLs preventing delivery of servers response object to the client.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.cache_code_object_tag_requests': {
+ info: 'These tags are optional and describe what type of object was produced.<br>' +
+ '<ul>' +
+ ' <li><code>NEGATIVE</code> only seen on HIT responses, indicating the response was a cached error response. e.g. <b>404 not found</b>.</li>' +
+ ' <li><code>STALE</code> the object was cached and served stale. This is usually caused by <i>stale-while-revalidate</i> or <i>stale-if-error</i> cache controls.</li>' +
+ ' <li><code>OFFLINE</code> the requested object was retrieved from the cache during <a href="http://www.squid-cache.org/Doc/config/offline_mode/" target="_blank">offline_mode</a>. The offline mode never validates any object.</li>' +
+ ' <li><code>INVALID</code> an invalid request was received. An error response was delivered indicating what the problem was.</li>' +
+ ' <li><code>FAILED</code> only seen on <code>REFRESH</code> to indicate the revalidation request failed. The response object may be the server provided network error or the stale object which was being revalidated depending on stale-if-error cache control.</li>' +
+ ' <li><code>MODIFIED</code> only seen on <code>REFRESH</code> responses to indicate revalidation produced a new modified object.</li>' +
+ ' <li><code>UNMODIFIED</code> only seen on <code>REFRESH</code> responses to indicate revalidation produced a 304 (Not Modified) status. The client gets either a full 200 (OK), a 304 (Not Modified), or (in theory) another response, depending on the client request and other details.</li>' +
+ ' <li><code>REDIRECT</code> Squid generated an HTTP redirect response to this request.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.cache_code_load_source_tag_requests': {
+ info: 'These tags are optional and describe whether the response was loaded from cache, network, or otherwise.<br>' +
+ '<ul>' +
+ ' <li><code>HIT</code> the response object delivered was the local cache object.</li>' +
+ ' <li><code>MEM</code> the response object came from memory cache, avoiding disk accesses. Only seen on HIT responses.</li>' +
+ ' <li><code>MISS</code> the response object delivered was the network response object.</li>' +
+ ' <li><code>DENIED</code> the request was denied by access controls.</li>' +
+ ' <li><code>NOFETCH</code> an ICP specific type, indicating service is alive, but not to be used for this request.</li>' +
+ ' <li><code>TUNNEL</code> a binary tunnel was established for this transaction.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.cache_code_error_tag_requests': {
+ info: 'These tags are optional and describe some error conditions which occurred during response delivery.<br>' +
+ '<ul>' +
+ ' <li><code>ABORTED</code> the response was not completed due to the connection being aborted (usually by the client).</li>' +
+ ' <li><code>TIMEOUT</code> the response was not completed due to a connection timeout.</li>' +
+ ' <li><code>IGNORED</code> while refreshing a previously cached response A, Squid got a response B that was older than A (as determined by the Date header field). Squid ignored response B (and attempted to use A instead).</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.http_method_requests': {
+ info: 'The request method to obtain an object. Please refer to section <a href="https://wiki.squid-cache.org/SquidFaq/SquidLogs#Request_methods">request-methods</a> for available methods and their description.'
+ },
+
+ 'squidlog.hier_code_requests': {
+ info: 'A code that explains how the request was handled, e.g. by forwarding it to a peer, or going straight to the source. ' +
+ 'Any hierarchy tag may be prefixed with <code>TIMEOUT_</code>, if the timeout occurs waiting for all ICP replies to return from the neighbours. The timeout is either dynamic, if the <a href="http://www.squid-cache.org/Doc/config/icp_query_timeout/" target="_blank">icp_query_timeout</a> was not set, or the time configured there has run up. ' +
+ 'Refer to <a href="https://wiki.squid-cache.org/SquidFaq/SquidLogs#Hierarchy_Codes" target="_blank">Hierarchy Codes</a> for details on hierarchy codes.'
+ },
+
+ 'squidlog.server_address_forwarded_requests': {
+ info: 'The IP address or hostname where the request (if a miss) was forwarded. For requests sent to origin servers, this is the origin server\'s IP address. ' +
+ 'For requests sent to a neighbor cache, this is the neighbor\'s hostname. NOTE: older versions of Squid would put the origin server hostname here.'
+ },
+
+ 'squidlog.mime_type_requests': {
+ info: 'The content type of the object as seen in the HTTP reply header. Please note that ICP exchanges usually don\'t have any content type.'
+ },
+
+ // ------------------------------------------------------------------------
+ // CockroachDB
+
+ 'cockroachdb.process_cpu_time_combined_percentage': {
+ info: 'Current combined cpu utilization, calculated as <code>(user+system)/num of logical cpus</code>.'
+ },
+
+ 'cockroachdb.host_disk_bandwidth': {
+ info: 'Summary disk bandwidth statistics across all system host disks.'
+ },
+
+ 'cockroachdb.host_disk_operations': {
+ info: 'Summary disk operations statistics across all system host disks.'
+ },
+
+ 'cockroachdb.host_disk_iops_in_progress': {
+ info: 'Summary disk iops in progress statistics across all system host disks.'
+ },
+
+ 'cockroachdb.host_network_bandwidth': {
+ info: 'Summary network bandwidth statistics across all system host network interfaces.'
+ },
+
+ 'cockroachdb.host_network_packets': {
+ info: 'Summary network packets statistics across all system host network interfaces.'
+ },
+
+ 'cockroachdb.live_nodes': {
+ info: 'Will be <code>0</code> if this node is not itself live.'
+ },
+
+ 'cockroachdb.total_storage_capacity': {
+ info: 'Entire disk capacity. It includes non-CR data, CR data, and empty space.'
+ },
+
+ 'cockroachdb.storage_capacity_usability': {
+ info: '<code>usable</code> is sum of empty space and CR data, <code>unusable</code> is space used by non-CR data.'
+ },
+
+ 'cockroachdb.storage_usable_capacity': {
+ info: 'Breakdown of <code>usable</code> space.'
+ },
+
+ 'cockroachdb.storage_used_capacity_percentage': {
+ info: '<code>total</code> is % of <b>total</b> space used, <code>usable</code> is % of <b>usable</b> space used.'
+ },
+
+ 'cockroachdb.sql_bandwidth': {
+ info: 'The total amount of SQL client network traffic.'
+ },
+
+ 'cockroachdb.sql_errors': {
+ info: '<code>statement</code> is statements resulting in a planning or runtime error, ' +
+ '<code>transaction</code> is SQL transactions abort errors.'
+ },
+
+ 'cockroachdb.sql_started_ddl_statements': {
+ info: 'The amount of <b>started</b> DDL (Data Definition Language) statements. ' +
+ 'This type means database schema changes. ' +
+ 'It includes <code>CREATE</code>, <code>ALTER</code>, <code>DROP</code>, <code>RENAME</code>, <code>TRUNCATE</code> and <code>COMMENT</code> statements.'
+ },
+
+ 'cockroachdb.sql_executed_ddl_statements': {
+ info: 'The amount of <b>executed</b> DDL (Data Definition Language) statements. ' +
+ 'This type means database schema changes. ' +
+ 'It includes <code>CREATE</code>, <code>ALTER</code>, <code>DROP</code>, <code>RENAME</code>, <code>TRUNCATE</code> and <code>COMMENT</code> statements.'
+ },
+
+ 'cockroachdb.sql_started_dml_statements': {
+ info: 'The amount of <b>started</b> DML (Data Manipulation Language) statements.'
+ },
+
+ 'cockroachdb.sql_executed_dml_statements': {
+ info: 'The amount of <b>executed</b> DML (Data Manipulation Language) statements.'
+ },
+
+ 'cockroachdb.sql_started_tcl_statements': {
+ info: 'The amount of <b>started</b> TCL (Transaction Control Language) statements.'
+ },
+
+ 'cockroachdb.sql_executed_tcl_statements': {
+ info: 'The amount of <b>executed</b> TCL (Transaction Control Language) statements.'
+ },
+
+ 'cockroachdb.live_bytes': {
+ info: 'The amount of live data used by both applications and the CockroachDB system.'
+ },
+
+ 'cockroachdb.kv_transactions': {
+ info: 'KV transactions breakdown:<br>' +
+ '<ul>' +
+ ' <li><code>committed</code> committed KV transactions (including 1PC).</li>' +
+ ' <li><code>fast-path_committed</code> KV transaction on-phase commit attempts.</li>' +
+ ' <li><code>aborted</code> aborted KV transactions.</li>' +
+ ' </ul>'
+ },
+
+ 'cockroachdb.kv_transaction_restarts': {
+ info: 'KV transactions restarts breakdown:<br>' +
+ '<ul>' +
+ ' <li><code>write too old</code> restarts due to a concurrent writer committing first.</li>' +
+ ' <li><code>write too old (multiple)</code> restarts due to multiple concurrent writers committing first.</li>' +
+ ' <li><code>forwarded timestamp (iso=serializable)</code> restarts due to a forwarded commit timestamp and isolation=SERIALIZABLE".</li>' +
+ ' <li><code>possible replay</code> restarts due to possible replays of command batches at the storage layer.</li>' +
+ ' <li><code>async consensus failure</code> restarts due to async consensus writes that failed to leave intents.</li>' +
+ ' <li><code>read within uncertainty interval</code> restarts due to reading a new value within the uncertainty interval.</li>' +
+ ' <li><code>aborted</code> restarts due to an abort by a concurrent transaction (usually due to deadlock).</li>' +
+ ' <li><code>push failure</code> restarts due to a transaction push failure.</li>' +
+ ' <li><code>unknown</code> restarts due to a unknown reasons.</li>' +
+ ' </ul>'
+ },
+
+ 'cockroachdb.ranges': {
+ info: 'CockroachDB stores all user data (tables, indexes, etc.) and almost all system data in a giant sorted map of key-value pairs. ' +
+ 'This keyspace is divided into "ranges", contiguous chunks of the keyspace, so that every key can always be found in a single range.'
+ },
+
+ 'cockroachdb.ranges_replication_problem': {
+ info: 'Ranges with not optimal number of replicas:<br>' +
+ '<ul>' +
+ ' <li><code>unavailable</code> ranges with fewer live replicas than needed for quorum.</li>' +
+ ' <li><code>under replicated</code> ranges with fewer live replicas than the replication target.</li>' +
+ ' <li><code>over replicated</code> ranges with more live replicas than the replication target.</li>' +
+ ' </ul>'
+ },
+
+ 'cockroachdb.replicas': {
+ info: 'CockroachDB replicates each range (3 times by default) and stores each replica on a different node.'
+ },
+
+ 'cockroachdb.replicas_leaders': {
+ info: 'For each range, one of the replicas is the <code>leader</code> for write requests, <code>not leaseholders</code> is the number of Raft leaders whose range lease is held by another store.'
+ },
+
+ 'cockroachdb.replicas_leaseholders': {
+ info: 'For each range, one of the replicas holds the "range lease". This replica, referred to as the <code>leaseholder</code>, is the one that receives and coordinates all read and write requests for the range.'
+ },
+
+ 'cockroachdb.queue_processing_failures': {
+ info: 'Failed replicas breakdown by queue:<br>' +
+ '<ul>' +
+ ' <li><code>gc</code> replicas which failed processing in the GC queue.</li>' +
+ ' <li><code>replica gc</code> replicas which failed processing in the replica GC queue.</li>' +
+ ' <li><code>replication</code> replicas which failed processing in the replicate queue.</li>' +
+ ' <li><code>split</code> replicas which failed processing in the split queue.</li>' +
+ ' <li><code>consistency</code> replicas which failed processing in the consistency checker queue.</li>' +
+ ' <li><code>raft log</code> replicas which failed processing in the Raft log queue.</li>' +
+ ' <li><code>raft snapshot</code> replicas which failed processing in the Raft repair queue.</li>' +
+ ' <li><code>time series maintenance</code> replicas which failed processing in the time series maintenance queue.</li>' +
+ ' </ul>'
+ },
+
+ 'cockroachdb.rebalancing_queries': {
+ info: 'Number of kv-level requests received per second by the store, averaged over a large time period as used in rebalancing decisions.'
+ },
+
+ 'cockroachdb.rebalancing_writes': {
+ info: 'Number of keys written (i.e. applied by raft) per second to the store, averaged over a large time period as used in rebalancing decisions.'
+ },
+
+ 'cockroachdb.slow_requests': {
+ info: 'Requests that have been stuck for a long time.'
+ },
+
+ 'cockroachdb.timeseries_samples': {
+ info: 'The amount of metric samples written to disk.'
+ },
+
+ 'cockroachdb.timeseries_write_errors': {
+ info: 'The amount of errors encountered while attempting to write metrics to disk.'
+ },
+
+ 'cockroachdb.timeseries_write_bytes': {
+ info: 'Size of metric samples written to disk.'
+ },
+
+ // ------------------------------------------------------------------------
+ // eBPF
+
+ 'ebpf.tcp_functions': {
+ title : 'TCP calls',
+ info: 'Successful or failed calls to functions <code>tcp_sendmsg</code>, <code>tcp_cleanup_rbuf</code> and <code>tcp_close</code>.'
+ },
+
+ 'ebpf.tcp_bandwidth': {
+ title : 'TCP bandwidth',
+ info: 'Bytes sent and received for functions <code>tcp_sendmsg</code> and <code>tcp_cleanup_rbuf</code>. We use <code>tcp_cleanup_rbuf</code> instead <code>tcp_recvmsg</code>, because this last misses <code>tcp_read_sock()</code> traffic and we would also need to have more probes to get the socket and package size.'
+ },
+
+ 'ebpf.tcp_retransmit': {
+ title : 'TCP retransmit',
+ info: 'Number of packets retransmitted for function <code>tcp_retranstmit_skb</code>.'
+ },
+
+ 'ebpf.tcp_error': {
+ title : 'TCP errors',
+ info: 'Failed calls that to functions <code>tcp_sendmsg</code>, <code>tcp_cleanup_rbuf</code> and <code>tcp_close</code>.'
+ },
+
+ 'ebpf.udp_functions': {
+ title : 'UDP calls',
+ info: 'Successful or failed calls to functions <code>udp_sendmsg</code> and <code>udp_recvmsg</code>.'
+ },
+
+ 'ebpf.udp_bandwidth': {
+ title : 'UDP bandwidth',
+ info: 'Bytes sent and received for functions <code>udp_sendmsg</code> and <code>udp_recvmsg</code>.'
+ },
+
+ 'ebpf.file_descriptor': {
+ title : 'File access',
+ info: 'Calls for internal functions on Linux kernel. The open dimension is attached to the kernel internal function <code>do_sys_open</code> ( For kernels newer than <code>5.5.19</code> we add a kprobe to <code>do_sys_openat2</code>. ), which is the common function called from'+
+ ' <a href="https://www.man7.org/linux/man-pages/man2/open.2.html" target="_blank">open(2)</a> ' +
+ ' and <a href="https://www.man7.org/linux/man-pages/man2/openat.2.html" target="_blank">openat(2)</a>. ' +
+ ' The close dimension is attached to the function <code>__close_fd</code> or <code>close_fd</code> according to your kernel version, which is called from system call' +
+ ' <a href="https://www.man7.org/linux/man-pages/man2/close.2.html" target="_blank">close(2)</a>. '
+ },
+
+ 'ebpf.file_error': {
+ title : 'File access error',
+ info: 'Failed calls to the kernel internal function <code>do_sys_open</code> ( For kernels newer than <code>5.5.19</code> we add a kprobe to <code>do_sys_openat2</code>. ), which is the common function called from'+
+ ' <a href="https://www.man7.org/linux/man-pages/man2/open.2.html" target="_blank">open(2)</a> ' +
+ ' and <a href="https://www.man7.org/linux/man-pages/man2/openat.2.html" target="_blank">openat(2)</a>. ' +
+ ' The close dimension is attached to the function <code>__close_fd</code> or <code>close_fd</code> according to your kernel version, which is called from system call' +
+ ' <a href="https://www.man7.org/linux/man-pages/man2/close.2.html" target="_blank">close(2)</a>. '
+ },
+
+ 'ebpf.deleted_objects': {
+ title : 'VFS remove',
+ info: 'This chart does not show all events that remove files from the file system, because file systems can create their own functions to remove files, it shows calls for the function <a href="https://www.kernel.org/doc/htmldocs/filesystems/API-vfs-unlink.html" target="_blank">vfs_unlink</a>. '
+ },
+
+ 'ebpf.io': {
+ title : 'VFS IO',
+ info: 'Successful or failed calls to functions <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a> and <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>. This chart may not show all file system events if it uses other functions to store data on disk.'
+ },
+
+ 'ebpf.io_bytes': {
+ title : 'VFS bytes written',
+ info: 'Total of bytes read or written with success using the functions <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a> and <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>.'
+ },
+
+ 'ebpf.io_error': {
+ title : 'VFS IO error',
+ info: 'Failed calls to functions <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a> and <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>.'
+ },
+
+ 'ebpf.process_thread': {
+ title : 'Task creation',
+ info: 'Number of times that either <a href="https://www.ece.uic.edu/~yshi1/linux/lkse/node4.html#SECTION00421000000000000000" target="_blank">do_fork</a>, or <code>kernel_clone</code> if you are running kernel newer than 5.9.16, is called to create a new task, which is the common name used to define process and tasks inside the kernel. Netdata identifies the threads by couting the number of calls for <a href="https://linux.die.net/man/2/clone" target="_blank">sys_clone</a> that has the flag <code>CLONE_THREAD</code> set.'
+ },
+
+ 'ebpf.exit': {
+ title : 'Exit monitoring',
+ info: 'Calls for the functions responsible for closing (<a href="https://www.informit.com/articles/article.aspx?p=370047&seqNum=4" target="_blank">do_exit</a>) and releasing (<a href="https://www.informit.com/articles/article.aspx?p=370047&seqNum=4" target="_blank">release_task</a>) tasks.'
+ },
+
+ 'ebpf.task_error': {
+ title : 'Task error',
+ info: 'Number of errors to create a new process or thread.'
+ },
+
+ 'ebpf.process_status': {
+ title : 'Task status',
+ info: 'Difference between the number of process created and the number of threads created per period(<code>process</code> dimension), it also shows the number of possible zombie process running on system.'
+ },
+
+ // ------------------------------------------------------------------------
+ // ACLK Internal Stats
+ 'netdata.aclk_status': {
+ valueRange: "[0, 1]",
+ info: 'This chart shows if ACLK was online during entirety of the sample duration.'
+ },
+
+ 'netdata.aclk_query_per_second': {
+ info: 'This chart shows how many queries were added for ACLK_query thread to process and how many it was actually able to process.'
+ },
+
+ 'netdata.aclk_latency_mqtt': {
+ info: 'Measures latency between MQTT publish of the message and it\'s PUB_ACK being received'
+ },
+
+ // ------------------------------------------------------------------------
+ // VerneMQ
+
+ 'vernemq.sockets': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="open_sockets"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Connected Clients"'
+ + ' data-units="clients"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="16%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'vernemq.queue_processes': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="queue_processes"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Queues Processes"'
+ + ' data-units="processes"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="16%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'vernemq.queue_messages_in_queues': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="queue_messages_current"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Messages in the Queues"'
+ + ' data-units="messages"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="16%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'vernemq.queue_messages': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="queue_message_in"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="MQTT Receive Rate"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="queue_message_out"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="MQTT Send Rate"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ ]
+ },
+ 'vernemq.average_scheduler_utilization': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="system_utilization"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Average Scheduler Utilization"'
+ + ' data-units="percentage"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="16%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // Apache Pulsar
+ 'pulsar.messages_rate': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_rate_in"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Publish"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_rate_out"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Dispatch"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ ]
+ },
+ 'pulsar.subscription_msg_rate_redeliver': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_subscription_msg_rate_redeliver"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Redelivered"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'pulsar.subscription_blocked_on_unacked_messages': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_subscription_blocked_on_unacked_messages"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Blocked On Unacked"'
+ + ' data-units="subscriptions"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'pulsar.msg_backlog': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_msg_backlog"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Messages Backlog"'
+ + ' data-units="messages"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'pulsar.namespace_messages_rate': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="publish"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Publish"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="dispatch"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Dispatch"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ ]
+ },
+ 'pulsar.namespace_subscription_msg_rate_redeliver': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="redelivered"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Redelivered"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'pulsar.namespace_subscription_blocked_on_unacked_messages': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="blocked"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Blocked On Unacked"'
+ + ' data-units="subscriptions"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'pulsar.namespace_msg_backlog': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="backlog"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Messages Backlog"'
+ + ' data-units="messages"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ ],
+ },
+
+ // ------------------------------------------------------------------------
+ // Nvidia-smi
+
+ 'nvidia_smi.fan_speed': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="speed"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Fan Speed"'
+ + ' data-units="percentage"'
+ + ' data-easypiechart-max-value="100"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'nvidia_smi.temperature': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="temp"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Temperature"'
+ + ' data-units="celsius"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'nvidia_smi.memory_allocated': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="used"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Used Memory"'
+ + ' data-units="MiB"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'nvidia_smi.power': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="power"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Power Utilization"'
+ + ' data-units="watts"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // Supervisor
+
+ 'supervisord.process_state_code': {
+ info: '<a href="http://supervisord.org/subprocess.html#process-states" target="_blank">Process states map</a>: ' +
+ '<code>0</code> - stopped, <code>10</code> - starting, <code>20</code> - running, <code>30</code> - backoff,' +
+ '<code>40</code> - stopping, <code>100</code> - exited, <code>200</code> - fatal, <code>1000</code> - unknown.'
+ },
+};
diff --git a/applications/luci-app-netdata/root/usr/share/netdata/webcn/index.html b/applications/luci-app-netdata/root/usr/share/netdata/webcn/index.html
new file mode 100755
index 0000000..9de4afb
--- /dev/null
+++ b/applications/luci-app-netdata/root/usr/share/netdata/webcn/index.html
@@ -0,0 +1,1339 @@
+<!DOCTYPE html>
+<!-- SPDX-License-Identifier: GPL-3.0-or-later -->
+<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">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="apple-mobile-web-app-capable" content="yes">
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+ <meta name="author" content="costa@tsaousis.gr">
+
+ <link rel="stylesheet" type="text/css" href="main.css?v=5">
+
+ <link rel="icon" href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAP9JREFUeNpiYBgFo+A/w34gpiZ8DzWzAYgNiHGAA5UdgA73g+2gcyhgg/0DGQoweB6IBQYyFCCOGOBQwBMd/xnW09ERDtgcoEBHB+zHFQrz6egIBUasocDAcJ9OxWAhE4YQI8MDILmATg7wZ8QRDfQKhQf4Cie6pAVGPA4AhQKo0BCgZRAw4ZSBpIWJNI6CD4wEKikBaFqgVSgcYMIrzcjwgcahcIGRiPYCLUPBkNhWUwP9akVcoQBpatG4MsLviAIqWj6f3Absfdq2igg7IIEKDVQKEzN5ofAenJCp1I8gJRTug5tfkGIdR1FDniMI+QZUjF8Amn5htOdHCAAEGACE6B0cS6mrEwAAAABJRU5ErkJggg==" />
+
+ <meta property="og:locale" content="en_US" />
+ <meta property="og:url" content="https://my-netdata.io" />
+ <meta property="og:type" content="website" />
+ <meta property="og:site_name" content="netdata"/>
+ <meta property="og:title" content="Get control of your Linux Servers. Simple. Effective. Awesome." />
+ <meta property="og:description" content="Unparalleled insights, in real-time, of everything happening on your Linux systems and applications, with stunning, interactive web dashboards and powerful performance and health alarms." />
+ <meta property="og:image" content="https://cloud.githubusercontent.com/assets/2662304/22945737/e98cd0c6-f2fd-11e6-96f1-5501934b0955.png" />
+ <meta property="og:image:type" content="image/png" />
+ <meta property="fb:app_id" content="1200089276712916" />
+
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:site" content="@linuxnetdata" />
+ <meta name="twitter:title" content="Get control of your Linux Servers. Simple. Effective. Awesome." />
+ <meta name="twitter:description" content="Unparalleled insights, in real-time, of everything happening on your Linux systems and applications, with stunning, interactive web dashboards and powerful performance and health alarms." />
+ <meta name="twitter:image" content="https://cloud.githubusercontent.com/assets/2662304/14092712/93b039ea-f551-11e5-822c-beadbf2b2a2e.gif" />
+
+ <script src="main.js?v20190905-0"></script>
+</head>
+
+<body data-spy="scroll" data-target="#sidebar" data-offset="100">
+ <div id="loadOverlay" class="loadOverlay" style="background-color: #fff; color: #888;">
+ <div style="font-size: 3vh;">
+ You must enable JavaScript in order to use Netdata!<br />
+ You can do this in <a href="https://enable-javascript.com/" target="_blank">your browser settings</a>.
+ </div>
+ </div>
+ <script type="text/javascript">
+ // Cleanup JS warning.
+ document.documentElement.style.overflowY = "scroll";
+
+ // Change the loadOverlay colors ASAP to match the theme.
+ let theme;
+ const hash = document.location.hash;
+ if (hash.includes('theme=slate')) {
+ theme = 'slate';
+ } else if (hash.includes('theme=white')) {
+ theme = 'white';
+ } else {
+ theme = localStorage.getItem('netdataTheme') || 'slate';
+ }
+ const overlayEl = document.getElementById('loadOverlay');
+ overlayEl.innerHTML = 'netdata<br/><div style="font-size: 3vh;">即时效能监控，做正确的事！</div>';
+ overlayEl.style = theme == 'slate' ? "background-color: #272b30; color: #373b40;" : "background-color: #fff; color: #ddd;";
+ </script>
+ <nav class="navbar navbar-default navbar-fixed-top" role="banner">
+ <div class="container">
+ <!-- <nav id="mynetdata_nav" class="collapse navbar-collapse navbar-left" role="navigation" style="padding-right: 20px;">
+ <ul class="nav navbar-nav">
+ <li data-placement="right" style="line-height: 50px; margin-right: 15px" title="Netdata Agent">
+ <img src="images/netdata-logomark.svg" height="32"/>
+ </li>
+ <li class="dropdown" id="myNetdataDropdownParent" title="your other netdata servers" data-toggle="tooltip" data-placement="right">
+ <a href="#" id="hostname" class="dropdown-toggle" data-toggle="dropdown">my-netdata <strong class="caret"></strong></a>
+ <div id="my-netdata-dropdown-content" class="dropdown-menu scrollable-menu inpagemenu">
+ <div class="agent-item" style="white-space: nowrap">
+ <i class="fas fa-hourglass-half"></i>
+ Loading, please wait...
+ <div></div>
+ </div>
+ </div>
+ </li>
+ </ul>
+ </nav> -->
+ <div class="navbar-header">
+ <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <!-- <a href="/" class="navbar-brand" id="1hostname" title="server hostname<br/>click it to reload the dashboard" data-toggle="tooltip" data-placement="bottom">netdata</a> -->
+ <ul class="nav navbar-nav" style="display: inline-block">
+ <li data-placement="right" class="hidden-xs hidden-sm" style="line-height: 50px; margin-right: 15px" title="Netdata Agent">
+ <img src="images/netdata-logomark.svg" height="32"/>
+ </li>
+ <li class="dropdown" id="myNetdataDropdownParent" title="your other netdata servers" data-toggle="tooltip" data-placement="right">
+ <a href="#" id="hostname" class="dropdown-toggle" data-toggle="dropdown">我的 netdata <strong class="caret"></strong></a>
+ <div id="my-netdata-dropdown-content" class="dropdown-menu scrollable-menu inpagemenu">
+ <div class="agent-item" style="white-space: nowrap">
+ <i class="fas fa-hourglass-half"></i>
+ 载入中，请稍候...
+ <div></div>
+ </div>
+ </div>
+ </li>
+ </ul>
+ </div>
+ <nav class="collapse navbar-collapse navbar-right" role="navigation">
+ <ul class="nav navbar-nav">
+ <li id="alarmsButton" title="检查健康状况监控警报与记录" data-toggle="tooltip" data-placement="bottom"><a href="#" class="btn" data-toggle="modal" data-target="#alarmsModal"><i class="fas fa-bell"></i> <span class="hidden-sm hidden-md">警报 </span><span id="alarms_count_badge" class="badge"></span></a></li>
+ <li title="变更仪表板设定" data-toggle="tooltip" data-placement="bottom"><a href="#" class="btn" data-toggle="modal" data-target="#optionsModal"><i class="fas fa-cog"></i> <span class="hidden-sm hidden-md">设定</span></a></li>
+ <li title="检查 netdata 更新<br/>您应随时保持 netdata 为最新版本" data-toggle="tooltip" data-placement="bottom" class="hidden-sm" id="updateButton"><a href="#" class="btn" data-toggle="modal" data-target="#updateModal"><i class="fas fa-cloud-download-alt"></i> <span class="hidden-sm hidden-md">更新 </span><span id="update_badge" class="badge"></span></a></li>
+ <li title="到 netdata 在 github 上的 wiki<br/>记得 <b>给 netdata 一个 <i class="fas fa-star"></i></b> !" data-toggle="tooltip" data-placement="bottom" class="hidden-xs hidden-sm hidden-md"><a href="https://github.com/netdata/netdata" class="btn" target="_blank"><i class="fab fa-github"></i></a></li>
+ <li title="在 twitter 上跟随 netdata" data-toggle="tooltip" data-placement="bottom" class="hidden-xs hidden-sm hidden-md"><a href="https://twitter.com/linuxnetdata" class="btn" target="_blank"><i class="fab fa-twitter"></i></a></li>
+ <li title="到 facebook 上给 netdata 按赞" data-toggle="tooltip" data-placement="bottom" class="hidden-xs hidden-sm hidden-md"><a href="https://www.facebook.com/linuxnetdata/" class="btn" target="_blank"><i class="fab fa-facebook"></i></a></li>
+ <li title="汇入 / 载入 netdata 快照" data-toggle="tooltip" data-placement="bottom" id="loadButton"><a href="#" class="btn" data-toggle="modal" data-target="#loadSnapshotModal"><i class="fas fa-download"></i> <span class="hidden-sm hidden-md hidden-lg">汇入</span></a></li>
+ <li title="汇出 / 储存 netdata 快照" data-toggle="tooltip" data-placement="bottom" id="saveButton"><a href="#" class="btn" data-toggle="modal" data-target="#saveSnapshotModal"><i class="fas fa-upload"></i> <span class="hidden-sm hidden-md hidden-lg">汇出</span></a></li>
+ <li title="将仪表板列印为 PDF" data-toggle="tooltip" data-placement="bottom" id="printButton"><a href="#" class="btn" data-toggle="modal" data-target="#printPreflightModal"><i class="fas fa-print"></i> <span class="hidden-sm hidden-md hidden-lg">列印</span></a></li>
+ <li title="取得图表使用上的说明资讯" data-toggle="tooltip" data-placement="bottom" class="hidden-sm"><a href="#" class="btn" data-toggle="modal" data-target="#helpModal"><i class="fas fa-question-circle"></i> <span class="hidden-sm hidden-md">说明</span></a></li>
+ <li id="account-menu-container" class="dropdown" data-toggle="tooltip"></li>
+ </ul>
+ </nav>
+ </div>
+ </nav>
+ <div class="navbar-highlight">
+ <div id="navbar-highlight-content" class="navbar-highlight-content"></div>
+ </div>
+
+<!--
+ <div id="sign-in-banner" style="display: none">
+ <div class="container">
+ Like what you see?
+ <strong><a href="#" class="__link" onclick="signInDidClick(event); return false">Sign in</a>
+ to experience the full-range of netdata capabilities!</strong>
+ <div class="__close" onclick="closeSignInBannerDidClick(event)">
+ Close <i class="fas fa-times"></i>
+ </div>
+ </div>
+ </div>
+-->
+
+ <div id="masthead" style="display: none;">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-7">
+ <h1>Netdata
+ <p class="lead">即时效能监控，全力给您最详细的数据</p>
+ </h1>
+ </div>
+ <div class="col-md-5">
+ <div class="well well-lg">
+ <div class="row">
+ <div class="col-md-6">
+ <b>Drag</b> charts to pan.
+ <b>Shift + wheel</b> on them, to zoom in and out.
+ <b>Double-click</b> on them, to reset.
+ <b>Hover</b> on them too!
+ </div>
+ <div class="col-md-6">
+ <div class="netdata-container" data-netdata="system.intr" data-chart-library="dygraph" data-dygraph-theme="sparkline" data-dygraph-type="line" data-dygraph-strokewidth="3" data-dygraph-smooth="true" data-dygraph-highlightcirclesize="6" data-after="-90" data-height="60px" data-colors="#C66"></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="container">
+ <div class="row">
+ <div class="charts-body" role="main">
+ <div id="charts_div"></div>
+ </div>
+ <div class="sidebar-body hidden-xs hidden-sm hidden-print" id="sidebar-body" role="complementary">
+ <nav class="dashboard-sidebar hidden-print hidden-xs hidden-sm" id="sidebar" role="menu"></nav>
+ </div>
+ </div>
+ </div>
+
+ <div id="footer" class="container" style="display: none;">
+ <div class="row">
+ <div class="col-md-10" role="main">
+ <div class="p">
+ <big><a href="https://github.com/netdata/netdata/wiki" target="_blank">Netdata</a></big>
+ <br /><br />
+ <i class="fas fa-copyright"></i> Copyright 2018, <a href="mailto:info@netdata.cloud">Netdata, Inc</a>.<br/>
+ <i class="fas fa-copyright"></i> Copyright 2016-2018, <a href="mailto:costa@tsaousis.gr">Costa Tsaousis</a>.<br/>
+ </div>
+ <div class="p">
+ 以 <a href="http://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank">GPL v3 或之后</a> 条款释出。
+ Netdata 使用之 <a href="https://github.com/netdata/netdata/blob/master/REDISTRIBUTED.md" target="_blank">第三方工具</a>.
+ <br /><br />
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="xssModal" tabindex="-1" role="dialog" aria-labelledby="xssModalLabel" data-keyboard="false" data-backdrop="static" style="z-index: 3000">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h4 class="modal-title" id="xssModalLabel">XSS Protection</h4>
+ </div>
+ <div class="modal-body">
+ <p>
+ This dashboard is about to render data from server:
+ </p>
+ <p style="font-size: 1.25em;">
+ <code id="netdataXssModalServer"></code>
+ </p>
+ <p>
+ To protect your privacy, the dashboard will <b>check all data transferred</b> for cross site scripting (XSS).
+ <br/>This is CPU intensive, so your browser might be a bit slower.
+ </p>
+ <p>
+ If you <b>trust</b> the remote server, you can disable XSS protection.<br/>
+ In this case, any remote dashboard decoration code (javascript) will also run.
+ </p>
+ <p>
+ If you <b>don't trust</b> the remote server, you should keep the protection on.<br/>
+ The dashboard will run slower and remote dashboard decoration code will not run, but better be safe than sorry...
+ </p>
+ </div>
+ <div class="modal-footer">
+ <a href="#" onclick="return xssModalKeepXss();" type="button" class="btn btn-success" data-dismiss="modal">Keep protecting me</a>
+ <a href="#" onclick="return xssModalDisableXss();" type="button" class="btn btn-danger" data-dismiss="modal">I don't need this, the server is mine</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="printPreflightModal" tabindex="-1" role="dialog" aria-labelledby="printPreflightModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="printPreflightModalLabel">打印此netdata仪表板</h4>
+ </div>
+ <div class="modal-body">
+ <p>
+ netdata dashboards cannot be captured, since we are lazy loading and hiding all but the visible charts.
+ <br/>
+ To capture the whole page with all the charts rendered, a new browser window will pop-up that will render all the charts at once.
+ The new browser window will maintain the current pan and zoom settings of the charts. So, align the charts before proceeding.
+ </p>
+ <p>
+ <small>
+ This process will put some CPU and memory pressure on your browser.<br/>
+ For the netdata server, we will sequencially download all the charts, to avoid congesting network and server resources.<br/>
+ <b>Please, do not print netdata dashboards on paper!</b>
+ </small>
+ </p>
+ </div>
+ <div class="modal-footer">
+ <a href="#" onclick="printPreflight(); return false;" type="button" class="btn btn-default">Print</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="printModal" tabindex="-1" role="dialog" aria-labelledby="printModalLabel" data-keyboard="false" data-backdrop="static">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="printModalLabel">Preparing dashboard for printing...</h4>
+ </div>
+ <div class="modal-body">
+ Please wait while we initialize and render all the charts on the dashboard.
+ <div class="progress progress-striped active" style="height: 2em !important;">
+ <div id="printModalProgressBar" class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em;">
+ <span id="printModalProgressBarText" style="padding-left: 10px; padding-top: 4px; font-size: 1.2em; text-align: left; width: 100%; position: absolute; display: block; color: black;"></span>
+ </div>
+ </div>
+ The print dialog will appear as soon as we finish rendering the page.
+ </div>
+ <div class="modal-footer">
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="loadSnapshotModal" tabindex="-1" role="dialog" aria-labelledby="loadSnapshotModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="loadSnapshotModalLabel">Import a netdata snapshot</h4>
+ </div>
+ <div id="loadSnapshotDragAndDrop" class="modal-body">
+ <p>
+ netdata can export and import dashboard snapshots.
+ Any netdata can import the snapshot of any other netdata.
+ The snapshots are not uploaded to a server. They are handled entirely by your web browser, on your computer.
+ </p>
+ <p style="text-align: center;">
+ <label class="btn btn-default">
+ Click here to select the netdata snapshot file to import
+ <input type="file" id="loadSnapshotSelectFiles" value="Import" style="display: none;"
+ onchange="loadSnapshotPreflight();">
+ </label>
+ </p>
+ <div id="loadSnapshotStatus" class="alert alert-info" role="alert">
+ Browse for a snapshot file (or drag it and drop it here), then click <b>Import</b> to render it.
+ </div>
+ <p>
+ <table class="table">
+ <tbody>
+ <tr><th>Filename</th><td id="loadSnapshotFilename"></td></tr>
+ <tr><th>Hostname</th><td id="loadSnapshotHostname"></td></tr>
+ <tr><th>Origin URL</th><td id="loadSnapshotURL"></td></tr>
+ <tr><th>Charts Info</th><td id="loadSnapshotCharts"></td></tr>
+ <tr><th>Snapshot Info</th><td id="loadSnapshotInfo"></td></tr>
+ <tr><th>Time Range</th><td id="loadSnapshotTimeRange"></td></tr>
+ <tr><th>Comments</th><td id="loadSnapshotComments"></td></tr>
+ </tbody>
+ </table>
+ </p>
+ </div>
+ <div class="modal-footer">
+ <span style="display: inline-block; padding-right: 20px;">Snapshot files contain both data and javascript code. Make sure <b>you trust the files</b> you import!</span>
+ <a id="loadSnapshotImport" href="#" onclick="loadSnapshot(); return false;" type="button" class="btn btn-success disabled">Import</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="saveSnapshotModal" tabindex="-1" role="dialog" aria-labelledby="saveSnapshotModalLabel" data-keyboard="false" data-backdrop="static">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="saveSnapshotModalLabel">Export a snapshot</h4>
+ </div>
+ <div class="modal-body">
+ <div id="saveSnapshotModalProgressSection" hidden>
+ Please wait while we collect all the dashboard data...
+ <div class="progress progress-striped active" style="height: 2em !important;">
+ <div id="saveSnapshotModalProgressBar" class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em;">
+ <span id="saveSnapshotModalProgressBarText" style="padding-left: 10px; padding-top: 4px; font-size: 1.2em; text-align: left; width: 100%; position: absolute; display: block;"></span>
+ </div>
+ </div>
+ </div>
+
+ <div id="saveSnapshotResolutionRadio" style="text-align: center;">
+ Select the desired resolution of the snapshot. This is the <b>seconds of data per point</b>.
+ <br/>
+
+ <br/>
+
+ <br/>
+ <input id="saveSnapshotResolutionSlider" data-slider-id='saveSnapshotResolutionSlider' type="text" style="width: 80%;" tabindex="0"/>
+ <br/> <br/>
+ <div class="input-group">
+ <span class="input-group-addon" id="sizing-saveSnapshotFilename" style="width: 100px;">Filename</span>
+ <input id="saveSnapshotFilename" class="form-control" placeholder="Filename of the generated snapshot" aria-describedby="sizing-saveSnapshotFilename" tabindex="2"/>
+ <div class="input-group-btn">
+ <div class="input-group-btn">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span id="saveSnapshotCompressionName">Compression</span> <span class="caret"></span></button>
+ <ul class="dropdown-menu dropdown-menu-right">
+ <li class="disabled"><a href="#" class="disabled">Select Compression</a></li>
+ <li role="separator" class="divider"></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('none'); return false;">uncompressed</a></li>
+ <li role="separator" class="divider"></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('pako.deflate'); return false;">pako.deflate (gzip, binary)</a></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('pako.deflate.base64'); return false;">pako.deflate.base64 (gzip, ascii)</a></li>
+ <li role="separator" class="divider"></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('lzstring.uri'); return false;">lzstring.uri (LZ, ascii)</a></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('lzstring.utf16'); return false;">lzstring.utf16 (LZ, utf16)</a></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('lzstring.base64'); return false;">lzstring.base64 (LZ, ascii)</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </div>
+ </div>
+ <div class="input-group" style="padding-top: 10px; width: 100%">
+ <span class="input-group-addon" id="sizing-saveSnapshotComments" style="width: 100px;">Comments</span>
+ <input id="saveSnapshotComments" class="form-control" placeholder="Any comments about this snapshot?" aria-describedby="sizing-saveSnapshotComments" tabindex="3"/>
+ </div>
+ </div>
+
+
+ <div id="saveSnapshotStatus" class="alert alert-info" role="alert">
+ Select snaphost resolution. This controls the size the snapshot file.
+ </div>
+ <p>
+ The generated snapshot will include all charts of this dashboard, <b>for the visible timeframe</b>, so align, pan and zoom the charts as needed.
+ The scroll position of the dashboard will also be saved.
+ The snapshot will be downloaded as a file, to your computer, that can be imported back into any netdata dashboard (no need to import it back on this server).
+ </p>
+ <p>
+ <small>
+ Snapshot files include all the information of the dashboard, including the URL of the origin server, its netdata unique ID, etc.
+ So, if you share the snapshot file with third parties, they will be able to access the origin server, if this server is exposed on the internet.
+ <br/>
+ Snapshots are handled entirely by the web browser. The netdata servers are not aware of them.
+ </small>
+ </p>
+ </div>
+ <div class="modal-footer">
+ <a id="saveSnapshotExport" href="#" onclick="saveSnapshot(); return false;" type="button" class="btn btn-success" tabindex="4">Export</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal" tabindex="5">Cancel</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="welcomeModal" tabindex="-1" role="dialog" aria-labelledby="welcomeModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="welcomeModalLabel">Welcome to the world of netdata</h4>
+ </div>
+ <div class="modal-body">
+ <div class="p">
+ <div style="width: 100%; text-align: center; padding-top: 10px; padding-bottom: 10px; font-size: 18px;">
+ if there is a metric for something, we want it visualised<br/>
+ and we want this visualisation to be <strong>real-time</strong>, <strong>efficient</strong> and <strong>awesome</strong>
+ </div>
+ </div>
+ <div class="p">
+ <b><a href="https://github.com/netdata/netdata/wiki" target="_blank">netdata</a></b>
+ is a new way to monitor your systems and applications, to get <strong>real-time insights</strong>
+ of what is really happening and what affects performance.
+ It is carefully optimised to be a real-time system, without interfering in any way,
+ to the core function of your systems.
+ </div>
+ <div class="p">
+ <b><a href="https://github.com/netdata/netdata/wiki" target="_blank">netdata</a></b>
+ has been designed to monitor <strong>massive amounts of metrics, per server, per second</strong>.
+ When installed, it might come up with 1k to 3k metrics, but we have been testing it with 100k
+ metrics, all collected per second, and still the cpu utilisation remained negligible.
+ <br/>
+ We have also tried to give each metric, a meaning, a context.
+ We have grouped and categorized all metrics into meaningful charts, providing a
+ better understanding of the underlying technologies and mechanisms.
+ </div>
+ <div class="p">
+ <b><a href="https://github.com/netdata/netdata/wiki" target="_blank">netdata</a></b> is free,
+ open-source software. If you decide to use it,
+ <strong><a href="https://github.com/netdata/netdata/tree/master/docs/a-github-star-is-important.md" target="_blank">it is important to give netdata a star at GitHub</a></strong>.
+ </div>
+ <div class="p">
+ Enjoy real-time performance monitoring!
+ </div>
+ <div class="p">
+ Costa Tsaousis
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="helpModal" tabindex="-1" role="dialog" aria-labelledby="helpModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="helpModalLabel">仪表板说明</h4>
+ </div>
+ <div class="modal-body">
+
+ <h4>Dygraphs (折线图、区域图与山形图)</h4>
+
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist">
+ <li role="presentation" class="active"><a href="#help_mouse" aria-controls="help_mouse" role="tab" data-toggle="tab">滑鼠介面</a></li>
+ <li role="presentation"><a href="#help_touch" aria-controls="help_touch" role="tab" data-toggle="tab">触控介面</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="help_mouse">
+ <div class="p">
+ <h4>滑鼠移至 / 暂留</h4>
+ Mouse over on a chart to show, at its legend, the values for the timestamp under the mouse (the chart will also highlight the point at the chart).
+ <br/>
+ All the other visible charts will also show and highlight their values for the same timestamp.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>拖曳图表内容</h4>
+ Drag the contents of a chart, by pressing the left mouse button and moving the mouse, to pan it horizontally.
+ <br/>
+ All the charts will follow soon after you let the chart alone (this little delay is by design: it speeds up your browser and lets you focus on what you are exploring).
+ <br/>
+ Once a chart is panned, auto refreshing stops for all charts. To enable it again, <b>double click</b> a panned chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>连点两下</h4>
+ Double Click a chart to reset all the charts to their default auto-refreshing state.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>SHIFT + 拖曳</h4>
+ While pressing the <code>SHIFT</code> key, press the left mouse button on the contents of a chart and move the mouse to select an area, to zoom in. The other charts will follow too. Zooming is performed in two phases:
+ <ul>
+ <li>The already loaded chart contents are zoomed (low resolution)</li>
+ <li>New data are transferred from the netdata server, to refresh the chart with possibly more detail.</li>
+ </ul>
+ Once a chart is zoomed, auto refreshing stops for all charts. To enable it again, <b>double click</b> a zoomed chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>反白时间轴</h4>
+ While pressing the <code>ALT</code> key, press the left mouse button on the contents of a chart and move the mouse to select an area. The selected are will be highlighted on all charts.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>SHIFT + 滑鼠滚轮</h4>
+ While pressing the <code>SHIFT</code> key and the mouse pointer is over the contents of a chart, scroll the mouse wheel to zoom in or out. This kind of zooming is aligned to center below the mouse pointer. The other charts will follow too.
+ <br/>
+ Once a chart is zoomed, auto refreshing stops for all charts. To enable it again, <b>double click</b> a zoomed chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Legend Operations</h4>
+ Click on the label or value of a dimension, will select / un-select this dimension.
+ <br/>
+ You can press any of the SHIFT or CONTROL keys and then click on legend labels or values, to select / un-select multiple dimensions.
+ </div>
+ </div>
+ <div role="tabpanel" class="tab-pane" id="help_touch">
+ <div class="p">
+ <h4>Single Tap</h4>
+ Single Tap on the contents of a chart to show, at its legend, the values for the timestamp tapped (the chart will also highlight the point at the chart).
+ <br/>
+ All the other visible charts will also show and highlight their values for the same timestamp.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Drag Chart Contents</h4>
+ Touch and Drag the contents of a chart to pan it horizontally.
+ <br/>
+ All the charts will follow soon after you let the chart alone (this little delay is by design: it speeds up your browser and lets you focus on what you are exploring).
+ <br/>
+ Once a chart is panned, auto refreshing stops for all charts. To enable it again, <b>double tap</b> a panned chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Double Tap</h4>
+ Double tap a chart to reset all the charts to their default auto-refreshing state.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Zoom <small>(does not work on firefox and IE/Edge)</small></h4>
+ With two fingers, zoom in or out.
+ <br/>
+ Once a chart is zoomed, auto refreshing stops for all charts. To enable it again, <b>double click</b> a zoomed chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Legend Operations</h4>
+ Tap on the label or value of a dimension, will select / un-select this dimension.
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="alarmsModal" tabindex="-1" role="dialog" aria-labelledby="alarmsModalLabel">
+ <div class="modal-dialog modal-lg" role="document" style="display: table;"> <!-- allow the modal to expand horizontally -->
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="alarmsModalLabel">netdata 警报</h4>
+ </div>
+ <div class="modal-body">
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist">
+ <li role="presentation" class="active"><a href="#alarms_active" aria-controls="alarms_active" role="tab" data-toggle="tab">作用中</a></li>
+ <li role="presentation"><a href="#alarms_all" aria-controls="alarms_all" role="tab" data-toggle="tab">所有</a></li>
+ <li role="presentation"><a href="#alarms_log" aria-controls="alarms_log" role="tab" data-toggle="tab">记录</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="alarms_active">
+ 载入中...
+ </div>
+ <div role="tabpanel" class="tab-pane" id="alarms_all">
+ 载入中...
+ </div>
+ <div role="tabpanel" class="tab-pane" id="alarms_log">
+ 载入中...
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <!-- <a href="#" onclick="alarmsUpdateModal(); return false;" type="button" class="btn btn-default">Update</a> -->
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="optionsModal" tabindex="-1" role="dialog" aria-labelledby="optionsModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="optionsModalLabel">netdata 仪表板选项</h4>
+ </div>
+ <div class="modal-body">
+ <center>
+ <small style="color: #BBBBBB;">这里是浏览器的设定，每个浏览者都可以拥有自己的设定。这里的设定不会影响 netdata 本身的运作。
+ <br/>
+ 设定会立即生效，并且储存在您浏览器的本地储存中 (除了重新整理的 在焦点上/总是 这两个选项以外)。
+ <br/>
+ 若要将所有选项重置回预设值 (包括图表大小)，请点选 <a href="#" onclick="resetDashboardOptions(); return false;">这里</a>。</small>
+ </center>
+ <div style="padding: 10px;"></div>
+
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist">
+ <li role="presentation" class="active"><a href="#settings_performance" aria-controls="settings_performance" role="tab" data-toggle="tab">效能</a></li>
+ <li role="presentation"><a href="#settings_sync" aria-controls="settings_sync" role="tab" data-toggle="tab">同步</a></li>
+ <li role="presentation"><a href="#settings_visual" aria-controls="settings_visual" role="tab" data-toggle="tab">视觉</a></li>
+ <li role="presentation"><a href="#settings_locale" aria-controls="settings_locale" role="tab" data-toggle="tab">地区</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="settings_performance">
+ <form id="optionsForm1" method="get" class="form-horizontal">
+ <div class="form-group">
+ <table>
+ <tr class="option-row">
+ <td class="option-control"><input id="stop_updates_when_focus_is_lost" type="checkbox" checked data-toggle="toggle" data-offstyle="danger" data-onstyle="success" data-on="在焦点上" data-off="总是" data-width="110px"></td>
+ <td class="option-info"><strong>何时要重新整理图表？</strong><br/>
+ <small>When set to <b>在焦点上</b>, the charts will stop being updated if the page / tab does not have the focus of the user. When set to <b>总是</b>, the charts will always be refreshed. Set it to <b>在焦点上</b> it to lower the CPU requirements of the browser (and extend the battery of laptops and tablets) when this page does not have your focus. Set to <b>总是</b> to work on another window (i.e. change the settings of something) and have the charts auto-refresh in this window.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control">
+ <input id="eliminate_zero_dimensions" type="checkbox" checked data-toggle="toggle" data-on="非零" data-off="所有" data-width="110px">
+ </td>
+ <td class="option-info"><strong>要显示那些图表维度？</strong><br/>
+ <small>When set to <b>非零</b>, dimensions that have all their values (within the current view) set to zero will not be transferred from the netdata server (except if all dimensions of the chart are zero, in which case this setting does nothing - all dimensions are transferred and shown). When set to <b>All</b>, all dimensions will always be shown. Set it to <b>非零</b> to lower the data transferred between netdata and your browser, lower the CPU requirements of your browser (fewer lines to draw) and increase the focus on the legends (fewer entries at the legends).</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="destroy_on_hide" type="checkbox" data-toggle="toggle" data-on="消去" data-off="隐藏" data-width="110px"></td>
+ <td class="option-info"><strong>如何处理隐藏图表？</strong><br/>
+ <small>When set to <b>消去</b>, charts that are not in the current viewport of the browser (are above, or below the visible area of the page), will be destroyed and re-created if and when they become visible again. When set to <b>Hide</b>, the not-visible charts will be just hidden, to simplify the DOM and speed up your browser. Set it to <b>消去</b>, to lower the memory requirements of your browser. Set it to <b>隐藏</b> for faster restoration of charts on page scrolling.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="async_on_scroll" type="checkbox" data-toggle="toggle" data-on="非同步" data-off="同步" data-width="110px"></td>
+ <td class="option-info"><strong>如何处理页面卷动？</strong><br/>
+ <small>When set to <b>同步</b>, charts will be examined for their visibility immediately after scrolling. On slow computers this may impact the smoothness of page scrolling. To update the page when scrolling ends, set it to <b>Async</b>. Set it to <b>Sync</b> for immediate chart updates when scrolling. Set it to <b>非同步</b> for smoother page scrolling on slower computers.</small>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </form>
+ </div>
+ <div role="tabpanel" class="tab-pane" id="settings_sync">
+ <form id="optionsForm2" method="get" class="form-horizontal">
+ <div class="form-group">
+ <table>
+ <tr class="option-row">
+ <td class="option-control"><input id="parallel_refresher" type="checkbox" checked data-toggle="toggle" data-on="并行" data-off="循序" data-width="110px"></td>
+ <td class="option-info"><strong>采用何种图表更新模式？</strong><br/>
+ <small>When set to <b>并行</b>, visible charts are refreshed in parallel (all queries are sent to netdata server in parallel) and are rendered asynchronously. When set to <b>sequential</b> charts are refreshed one after another. Set it to parallel if your browser can cope with it (most modern browsers do), set it to sequential if you work on an older/slower computer.</small>
+ </td>
+ </tr>
+ <tr class="option-row" id="concurrent_refreshes_row">
+ <td class="option-control"><input id="concurrent_refreshes" type="checkbox" checked data-toggle="toggle" data-on="重新同步" data-off="尽力而为" data-width="110px"></td>
+ <td class="option-info"><strong>重新整理时是否需要同步所有图表？</strong><br/>
+ <small>When set to <b>重新同步</b>, the dashboard will attempt to re-synchronize all the charts so that they are refreshed concurrently. When set to <b>尽力而为</b>, each chart may be refreshed with a little time difference to the others. Normally, the dashboard starts refreshing them in parallel, but depending on the speed of your computer and the network latencies, charts start having a slight time difference. Setting this to <b>重新同步</b> will attempt to re-synchronize the charts on every update. Setting it to <b>尽力而为</b> may lower the pressure on your browser and the network.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="sync_selection" type="checkbox" checked data-toggle="toggle" data-on="同步" data-off="不要同步" data-onstyle="success" data-offstyle="danger" data-width="110px"></td>
+ <td class="option-info"><strong>是否悬停在图表上时同步更新所有图表？</strong><br/>
+ <small>When enabled, a selection on one chart will automatically select the same time on all other visible charts and the legends of all visible charts will be updated to show the selected values. When disabled, only the chart getting the user's attention will be selected. Enable it to get better insights of the data. Disable it if you are on a very slow computer that cannot actually do it.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="sync_pan_and_zoom" type="checkbox" checked data-toggle="toggle" data-on="同步" data-off="不要同步" data-onstyle="success" data-offstyle="danger" data-width="110px"></td>
+ <td class="option-info"><strong>是否同步移动与缩放所有图表？</strong><br/>
+ <small>When enabled, pan and zoom operations on a chart will be replicated to all charts (even the ones that are not currently visible - of course only when they will become visible). When disabled, pan and zoom operations will not be propagated to other charts.</small>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </form>
+ </div>
+ <div role="tabpanel" class="tab-pane" id="settings_visual">
+ <form id="optionsForm3" method="get" class="form-horizontal">
+ <div class="form-group">
+ <table>
+ <tr class="option-row">
+ <td class="option-control"><input id="netdata_theme_control" type="checkbox" checked data-toggle="toggle" data-offstyle="danger" data-onstyle="success" data-on="深色" data-off="白色" data-width="110px"></td>
+ <td class="option-info"><strong>使用那一种布景主题？</strong><br/>
+ <small>Netdata comes with two themes: <b>深色</b> (the default) and <b>浅色</b>.
+ <br/>
+ <b>Switching this will reload the dashboard</b>.
+ </small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="show_help" type="checkbox" checked data-toggle="toggle" data-on="需要说明" data-off="不需说明" data-width="110px"></td>
+ <td class="option-info"><strong>您需要说明吗？</strong><br/>
+ <small>Netdata can show some help in some areas to help you use the dashboard. If all these balloons bother you, disable them using this switch.
+ <br/>
+ <b>Switching this will reload the dashboard</b>.
+ </small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="pan_and_zoom_data_padding" type="checkbox" checked data-toggle="toggle" data-on="填补" data-off="不需填补" data-width="110px"></td>
+ <td class="option-info"><strong>是否启用在移动与缩放时同时填补数据？</strong><br/>
+ <small>When set to <b>Pad</b> the charts will be padded with more data, both before and after the visible area, thus giving the impression the whole database is loaded. This padding will happen only after the first pan or zoom operation on the chart (initially all charts have only the visible data). When set to <b>不需填补</b> only the visible data will be transfered from the netdata server, even after the first pan and zoom operation.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="smooth_plot" type="checkbox" checked data-toggle="toggle" data-on="平滑" data-off="粗糙" data-width="110px"></td>
+ <td class="option-info"><strong>是否在图表上启用贝兹曲线？</strong><br/>
+ <small>When set to <b>平滑</b> the charts libraries that support it, will plot smooth curves instead of simple straight lines to connect the points.
+ <br/>
+ Keep in mind <a href="http://dygraphs.com" target="_blank">dygraphs</a>, the main charting library in netdata dashboards, can only smooth line charts. It cannot smooth area or stacked charts. When set to <b>Rough</b>, this setting can lower the CPU resources consumed by your browser.</small>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </form>
+ </div>
+ <div role="tabpanel" class="tab-pane" id="settings_locale">
+ <form id="optionsForm4" method="get" class="form-horizontal">
+ <div class="form-group">
+ <table>
+ <tr class="option-row">
+ <td colspan="2" align="center">
+ <small>
+ <b>These settings are applied gradually, as charts are updated. To force them, refresh the dashboard now</b>.
+ </small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="units_conversion" type="checkbox" checked data-toggle="toggle" data-on="缩放单位" data-off="固定单位" data-onstyle="success" data-width="110px"></td>
+ <td class="option-info"><strong>是否启用自动缩放单位选择？</strong><br/>
+ <small>When set to <b>缩放单位</b> the values shown will dynamically be scaled (e.g. 1000 kilobits will be shown as 1 megabit).
+ Netdata can auto-scale these original units: <code>kilobits/s</code>, <code>kilobytes/s</code>, <code>KB/s</code>,
+ <code>KB</code>, <code>MB</code>, and <code>GB</code>.
+ When set to <b>固定单位</b> all the values will be rendered using the original units maintained by the netdata server.
+ </small>
+ </td>
+ </tr>
+ <tr id="settingsLocaleTempRow" class="option-row">
+ <td class="option-control"><input id="units_temp" type="checkbox" checked data-toggle="toggle" data-on="摄氏" data-off="华氏" data-width="110px"></td>
+ <td class="option-info"><strong>使用何种温度单位？</strong><br/>
+ <small>Set the temperature units of the dashboard.
+ </small>
+ </td>
+ </tr>
+ <tr id="settingsLocaleTimeRow" class="option-row">
+ <td class="option-control"><input id="seconds_as_time" type="checkbox" checked data-toggle="toggle" data-on="时间" data-off="秒" data-onstyle="success" data-width="110px"></td>
+ <td class="option-info"><strong>是否将秒转换为时间？</strong><br/>
+ <small>When set to <b>时间</b>, charts that present <code>秒</code> will show <code>DDd:HH:MM:SS</code>.
+ When set to <b>秒</b>, the raw number of seconds will be presented.
+ </small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="local_timezone" type="checkbox" checked data-toggle="toggle" data-on="本地时间" data-off="伺服器时间 data-onstyle="success" data-offstyle="danger" data-width="110px"></td>
+ <td class="option-info"><strong>是否显示浏览者本地时间或是伺服器时间？</strong><br/>
+ <small>When set to <b>本地时间</b>, the charts will use your browser local time. When set to <b>Server Time</b> the charts will use the server time.
+ <br/>
+ Set it to <b>本地时间</b> to have a common time-reference, no matter where the server is and which time zone it uses (all your dashboards will report your local time).
+ Set it to <b>伺服器时间</b> when you need to compare netdata charts with server log files.
+ <br/>
+ Your browser time zone is: <b><span id="browser_timezone">-</span></b>.<br/>
+ The server reported timezone is: <b><span id="server_timezone">-</span></b> (you can set this in netdata.conf <code>[global].timezone</code>).<br/>
+ The current time zone on the dashboard is: <b><span id="current_timezone">-</span></b>.
+ <br/>
+ <div class="dropup">
+ <button class="btn btn-default dropdown-toggle" type="button" id="dropdownTimeZone" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+ 选择伺服器时区
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu scrollable-menu-50" aria-labelledby="dropdownTimeZone">
+ <li><a href=# onclick="return selected_server_timezone('UTC');">Universal Time Coordinated (UTC)</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Abidjan');">Africa/Abidjan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Accra');">Africa/Accra</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Algiers');">Africa/Algiers</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Bissau');">Africa/Bissau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Cairo');">Africa/Cairo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Casablanca');">Africa/Casablanca</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Ceuta');">Africa/Ceuta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/El_Aaiun');">Africa/El_Aaiun</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Johannesburg');">Africa/Johannesburg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Khartoum');">Africa/Khartoum</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Lagos');">Africa/Lagos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Maputo');">Africa/Maputo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Monrovia');">Africa/Monrovia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Nairobi');">Africa/Nairobi</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Ndjamena');">Africa/Ndjamena</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Tripoli');">Africa/Tripoli</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Tunis');">Africa/Tunis</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Windhoek');">Africa/Windhoek</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Adak');">America/Adak</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Anchorage');">America/Anchorage</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Araguaina');">America/Araguaina</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Buenos_Aires');">America/Argentina/Buenos_Aires</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Catamarca');">America/Argentina/Catamarca</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Cordoba');">America/Argentina/Cordoba</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Jujuy');">America/Argentina/Jujuy</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/La_Rioja');">America/Argentina/La_Rioja</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Mendoza');">America/Argentina/Mendoza</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Rio_Gallegos');">America/Argentina/Rio_Gallegos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Salta');">America/Argentina/Salta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/San_Juan');">America/Argentina/San_Juan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/San_Luis');">America/Argentina/San_Luis</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Tucuman');">America/Argentina/Tucuman</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Ushuaia');">America/Argentina/Ushuaia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Asuncion');">America/Asuncion</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Atikokan');">America/Atikokan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Bahia');">America/Bahia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Bahia_Banderas');">America/Bahia_Banderas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Barbados');">America/Barbados</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Belem');">America/Belem</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Belize');">America/Belize</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Blanc-Sablon');">America/Blanc-Sablon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Boa_Vista');">America/Boa_Vista</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Bogota');">America/Bogota</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Boise');">America/Boise</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Cambridge_Bay');">America/Cambridge_Bay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Campo_Grande');">America/Campo_Grande</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Cancun');">America/Cancun</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Caracas');">America/Caracas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Cayenne');">America/Cayenne</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Chicago');">America/Chicago</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Chihuahua');">America/Chihuahua</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Costa_Rica');">America/Costa_Rica</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Creston');">America/Creston</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Cuiaba');">America/Cuiaba</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Curacao');">America/Curacao</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Danmarkshavn');">America/Danmarkshavn</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Dawson');">America/Dawson</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Dawson_Creek');">America/Dawson_Creek</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Denver');">America/Denver</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Detroit');">America/Detroit</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Edmonton');">America/Edmonton</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Eirunepe');">America/Eirunepe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/El_Salvador');">America/El_Salvador</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Fortaleza');">America/Fortaleza</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Fort_Nelson');">America/Fort_Nelson</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Glace_Bay');">America/Glace_Bay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Godthab');">America/Godthab</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Goose_Bay');">America/Goose_Bay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Grand_Turk');">America/Grand_Turk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Guatemala');">America/Guatemala</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Guayaquil');">America/Guayaquil</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Guyana');">America/Guyana</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Halifax');">America/Halifax</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Havana');">America/Havana</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Hermosillo');">America/Hermosillo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Indianapolis');">America/Indiana/Indianapolis</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Knox');">America/Indiana/Knox</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Marengo');">America/Indiana/Marengo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Petersburg');">America/Indiana/Petersburg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Tell_City');">America/Indiana/Tell_City</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Vevay');">America/Indiana/Vevay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Vincennes');">America/Indiana/Vincennes</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Winamac');">America/Indiana/Winamac</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Inuvik');">America/Inuvik</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Iqaluit');">America/Iqaluit</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Jamaica');">America/Jamaica</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Juneau');">America/Juneau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Kentucky/Louisville');">America/Kentucky/Louisville</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Kentucky/Monticello');">America/Kentucky/Monticello</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/La_Paz');">America/La_Paz</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Lima');">America/Lima</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Los_Angeles');">America/Los_Angeles</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Maceio');">America/Maceio</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Managua');">America/Managua</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Manaus');">America/Manaus</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Martinique');">America/Martinique</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Matamoros');">America/Matamoros</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Mazatlan');">America/Mazatlan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Menominee');">America/Menominee</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Merida');">America/Merida</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Metlakatla');">America/Metlakatla</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Mexico_City');">America/Mexico_City</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Miquelon');">America/Miquelon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Moncton');">America/Moncton</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Monterrey');">America/Monterrey</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Montevideo');">America/Montevideo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Nassau');">America/Nassau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/New_York');">America/New_York</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Nipigon');">America/Nipigon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Nome');">America/Nome</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Noronha');">America/Noronha</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/North_Dakota/Beulah');">America/North_Dakota/Beulah</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/North_Dakota/Center');">America/North_Dakota/Center</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/North_Dakota/New_Salem');">America/North_Dakota/New_Salem</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Ojinaga');">America/Ojinaga</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Panama');">America/Panama</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Pangnirtung');">America/Pangnirtung</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Paramaribo');">America/Paramaribo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Phoenix');">America/Phoenix</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Port-au-Prince');">America/Port-au-Prince</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Port_of_Spain');">America/Port_of_Spain</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Porto_Velho');">America/Porto_Velho</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Puerto_Rico');">America/Puerto_Rico</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Punta_Arenas');">America/Punta_Arenas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Rainy_River');">America/Rainy_River</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Rankin_Inlet');">America/Rankin_Inlet</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Recife');">America/Recife</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Regina');">America/Regina</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Resolute');">America/Resolute</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Rio_Branco');">America/Rio_Branco</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Santarem');">America/Santarem</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Santiago');">America/Santiago</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Santo_Domingo');">America/Santo_Domingo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Sao_Paulo');">America/Sao_Paulo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Scoresbysund');">America/Scoresbysund</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Sitka');">America/Sitka</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/St_Johns');">America/St_Johns</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Swift_Current');">America/Swift_Current</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Tegucigalpa');">America/Tegucigalpa</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Thule');">America/Thule</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Thunder_Bay');">America/Thunder_Bay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Tijuana');">America/Tijuana</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Toronto');">America/Toronto</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Vancouver');">America/Vancouver</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Whitehorse');">America/Whitehorse</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Winnipeg');">America/Winnipeg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Yakutat');">America/Yakutat</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Yellowknife');">America/Yellowknife</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Casey');">Antarctica/Casey</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Davis');">Antarctica/Davis</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/DumontDUrville');">Antarctica/DumontDUrville</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Macquarie');">Antarctica/Macquarie</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Mawson');">Antarctica/Mawson</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Palmer');">Antarctica/Palmer</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Rothera');">Antarctica/Rothera</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Syowa');">Antarctica/Syowa</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Troll');">Antarctica/Troll</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Vostok');">Antarctica/Vostok</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Almaty');">Asia/Almaty</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Amman');">Asia/Amman</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Anadyr');">Asia/Anadyr</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Aqtau');">Asia/Aqtau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Aqtobe');">Asia/Aqtobe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Ashgabat');">Asia/Ashgabat</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Atyrau');">Asia/Atyrau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Baghdad');">Asia/Baghdad</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Baku');">Asia/Baku</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Bangkok');">Asia/Bangkok</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Barnaul');">Asia/Barnaul</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Beirut');">Asia/Beirut</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Bishkek');">Asia/Bishkek</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Brunei');">Asia/Brunei</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Chita');">Asia/Chita</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Choibalsan');">Asia/Choibalsan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Colombo');">Asia/Colombo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Damascus');">Asia/Damascus</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Dhaka');">Asia/Dhaka</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Dili');">Asia/Dili</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Dubai');">Asia/Dubai</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Dushanbe');">Asia/Dushanbe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Famagusta');">Asia/Famagusta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Gaza');">Asia/Gaza</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Hebron');">Asia/Hebron</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Ho_Chi_Minh');">Asia/Ho_Chi_Minh</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Hong_Kong');">Asia/Hong_Kong</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Hovd');">Asia/Hovd</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Irkutsk');">Asia/Irkutsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Jakarta');">Asia/Jakarta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Jayapura');">Asia/Jayapura</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Jerusalem');">Asia/Jerusalem</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kabul');">Asia/Kabul</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kamchatka');">Asia/Kamchatka</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Karachi');">Asia/Karachi</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kathmandu');">Asia/Kathmandu</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Khandyga');">Asia/Khandyga</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kolkata');">Asia/Kolkata</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Krasnoyarsk');">Asia/Krasnoyarsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kuala_Lumpur');">Asia/Kuala_Lumpur</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kuching');">Asia/Kuching</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Macau');">Asia/Macau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Magadan');">Asia/Magadan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Makassar');">Asia/Makassar</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Manila');">Asia/Manila</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Nicosia');">Asia/Nicosia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Novokuznetsk');">Asia/Novokuznetsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Novosibirsk');">Asia/Novosibirsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Omsk');">Asia/Omsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Oral');">Asia/Oral</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Pontianak');">Asia/Pontianak</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Pyongyang');">Asia/Pyongyang</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Qatar');">Asia/Qatar</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Qyzylorda');">Asia/Qyzylorda</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Riyadh');">Asia/Riyadh</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Sakhalin');">Asia/Sakhalin</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Samarkand');">Asia/Samarkand</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Seoul');">Asia/Seoul</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Shanghai');">Asia/Shanghai</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Singapore');">Asia/Singapore</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Srednekolymsk');">Asia/Srednekolymsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Taipei');">Asia/Taipei</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tashkent');">Asia/Tashkent</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tbilisi');">Asia/Tbilisi</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tehran');">Asia/Tehran</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Thimphu');">Asia/Thimphu</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tokyo');">Asia/Tokyo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tomsk');">Asia/Tomsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Ulaanbaatar');">Asia/Ulaanbaatar</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Urumqi');">Asia/Urumqi</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Ust-Nera');">Asia/Ust-Nera</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Vladivostok');">Asia/Vladivostok</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Yakutsk');">Asia/Yakutsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Yangon');">Asia/Yangon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Yekaterinburg');">Asia/Yekaterinburg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Yerevan');">Asia/Yerevan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Azores');">Atlantic/Azores</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Bermuda');">Atlantic/Bermuda</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Canary');">Atlantic/Canary</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Cape_Verde');">Atlantic/Cape_Verde</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Faroe');">Atlantic/Faroe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Madeira');">Atlantic/Madeira</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Reykjavik');">Atlantic/Reykjavik</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/South_Georgia');">Atlantic/South_Georgia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Stanley');">Atlantic/Stanley</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Adelaide');">Australia/Adelaide</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Brisbane');">Australia/Brisbane</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Broken_Hill');">Australia/Broken_Hill</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Currie');">Australia/Currie</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Darwin');">Australia/Darwin</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Eucla');">Australia/Eucla</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Hobart');">Australia/Hobart</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Lindeman');">Australia/Lindeman</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Lord_Howe');">Australia/Lord_Howe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Melbourne');">Australia/Melbourne</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Perth');">Australia/Perth</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Sydney');">Australia/Sydney</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Amsterdam');">Europe/Amsterdam</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Andorra');">Europe/Andorra</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Astrakhan');">Europe/Astrakhan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Athens');">Europe/Athens</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Belgrade');">Europe/Belgrade</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Berlin');">Europe/Berlin</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Brussels');">Europe/Brussels</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Bucharest');">Europe/Bucharest</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Budapest');">Europe/Budapest</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Chisinau');">Europe/Chisinau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Copenhagen');">Europe/Copenhagen</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Dublin');">Europe/Dublin</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Gibraltar');">Europe/Gibraltar</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Helsinki');">Europe/Helsinki</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Istanbul');">Europe/Istanbul</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Kaliningrad');">Europe/Kaliningrad</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Kiev');">Europe/Kiev</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Kirov');">Europe/Kirov</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Lisbon');">Europe/Lisbon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/London');">Europe/London</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Luxembourg');">Europe/Luxembourg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Madrid');">Europe/Madrid</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Malta');">Europe/Malta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Minsk');">Europe/Minsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Monaco');">Europe/Monaco</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Moscow');">Europe/Moscow</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Oslo');">Europe/Oslo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Paris');">Europe/Paris</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Prague');">Europe/Prague</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Riga');">Europe/Riga</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Rome');">Europe/Rome</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Samara');">Europe/Samara</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Saratov');">Europe/Saratov</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Simferopol');">Europe/Simferopol</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Sofia');">Europe/Sofia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Stockholm');">Europe/Stockholm</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Tallinn');">Europe/Tallinn</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Tirane');">Europe/Tirane</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Ulyanovsk');">Europe/Ulyanovsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Uzhgorod');">Europe/Uzhgorod</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Vienna');">Europe/Vienna</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Vilnius');">Europe/Vilnius</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Volgograd');">Europe/Volgograd</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Warsaw');">Europe/Warsaw</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Zaporozhye');">Europe/Zaporozhye</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Zurich');">Europe/Zurich</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Chagos');">Indian/Chagos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Christmas');">Indian/Christmas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Cocos');">Indian/Cocos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Kerguelen');">Indian/Kerguelen</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Mahe');">Indian/Mahe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Maldives');">Indian/Maldives</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Mauritius');">Indian/Mauritius</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Reunion');">Indian/Reunion</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Apia');">Pacific/Apia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Auckland');">Pacific/Auckland</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Bougainville');">Pacific/Bougainville</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Chatham');">Pacific/Chatham</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Chuuk');">Pacific/Chuuk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Easter');">Pacific/Easter</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Efate');">Pacific/Efate</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Enderbury');">Pacific/Enderbury</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Fakaofo');">Pacific/Fakaofo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Fiji');">Pacific/Fiji</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Funafuti');">Pacific/Funafuti</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Galapagos');">Pacific/Galapagos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Gambier');">Pacific/Gambier</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Guadalcanal');">Pacific/Guadalcanal</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Guam');">Pacific/Guam</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Honolulu');">Pacific/Honolulu</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Kiritimati');">Pacific/Kiritimati</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Kosrae');">Pacific/Kosrae</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Kwajalein');">Pacific/Kwajalein</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Majuro');">Pacific/Majuro</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Marquesas');">Pacific/Marquesas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Nauru');">Pacific/Nauru</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Niue');">Pacific/Niue</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Norfolk');">Pacific/Norfolk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Noumea');">Pacific/Noumea</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Pago_Pago');">Pacific/Pago_Pago</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Palau');">Pacific/Palau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Pitcairn');">Pacific/Pitcairn</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Pohnpei');">Pacific/Pohnpei</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Port_Moresby');">Pacific/Port_Moresby</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Rarotonga');">Pacific/Rarotonga</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Tahiti');">Pacific/Tahiti</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Tarawa');">Pacific/Tarawa</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Tongatapu');">Pacific/Tongatapu</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Wake');">Pacific/Wake</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Wallis');">Pacific/Wallis</a></li>
+ </ul>
+ </div>
+ <b><span id="timezone_error_message"></span></b>
+
+ </small>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </form>
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+
+ <div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="updateModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="updateModalLabel">检查更新</h4>
+ </div>
+ <div class="modal-body">
+ 您的 netdata 版本：<b><code><span id="netdataVersion">未知</span></code></b><br/>
+ <br/>
+ <div style="padding: 10px;"></div>
+ <div id="versionCheckLog">尚未检查，请下 立即检查 按钮。</div>
+ <div>
+ <hr/>
+ </div>
+ <div>
+ 到这里查阅 netdata 的进度报告与关键更新：<strong><a href="https://twitter.com/linuxnetdata" target="_blank">在 <i class="fab fa-twitter"></i> twitter 上跟随 netdata</a></strong>。
+ <br/>
+ 您也可以在 <a href="https://www.facebook.com/linuxnetdata/" target="_blank"><i class="fab fa-facebook"></i> facebook 上给 netdata 按赞</a>,
+ 或是 <a href="https://github.com/netdata/netdata" target="_blank">到 <i class="fab fa-github"></i> github 上了解 netdata</a>.
+ </div>
+ </div>
+ <div class="modal-footer">
+ <a href="#" onclick="notifyForUpdate(true); return false;" type="button" class="btn btn-default">立即检查</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="signInModal" tabindex="-1" role="dialog" aria-labelledby="signInModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="signInModalLabel">登入</h4>
+ </div>
+ <div class="modal-body">
+ <p>
+ Signing-in to netdata.cloud will synchronize the list of
+ your netdata monitored nodes known at registry
+ <strong><span id="sim-registry"></span></strong>. This
+ may include server hostnames, urls and identification
+ GUIDs.
+ </p>
+ <p>
+ After you upgrade all your netdata servers, your private
+ registry will not be needed any more.
+ </p>
+ <p>
+ Are you sure you want to proceed?
+ </p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+ <a href="#" onclick="explicitlySignIn(); return false;" type="button" class="btn btn-success">登入</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="syncRegistryModal" tabindex="-1" role="dialog" aria-labelledby="syncRegistryModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="syncRegistryModalLabel">将netdata.cloud与注册表同步?</h4>
+ </div>
+ <div class="modal-body">
+ <p>
+ You are about to synchronize your netdata.cloud account with data from the registry at <strong><span id="sync-registry-modal-registry"></span></strong>.
+ This may include server hostnames, urls and identification GUIDs.
+ </p>
+ <p>
+ Are you sure you want to proceed?
+ </p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+ <a href="#" onclick="explicitlySyncAgents(); return false;" type="button" class="btn btn-success">Synchronize</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="deleteRegistryModal" tabindex="-1" role="dialog" aria-labelledby="deleteRegistryModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="deleteRegistryModalLabel">Delete <span id="deleteRegistryServerName"></span>?</h4>
+ </div>
+ <div class="modal-body">
+ You are about to delete, from your personal list of netdata servers, the following server:
+ <p style="text-align: center; padding-top: 10px; padding-bottom: 10px; line-height: 2;">
+ <b><span id="deleteRegistryServerName2"></span></b>
+ <br/>
+ <b><span id="deleteRegistryServerURL"></span></b>
+ </p>
+ Are you sure you want to do this?
+ <br/>
+ <div style="padding: 10px;"></div>
+ <small>Keep in mind, this server will be added back if and when you visit it again.</small>
+ <br/>
+ <div id="deleteRegistryResponse" style="display: block; width: 100%; text-align: center; padding-top: 20px;"></div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-success" data-dismiss="modal">keep it</button>
+ <a href="#" onclick="notifyForDeleteRegistry(); return false;" type="button" class="btn btn-danger">delete it</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="switchRegistryModal" tabindex="-1" role="dialog" aria-labelledby="switchRegistryModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="switchRegistryModalLabel">更换Netdata注册表标识</h4>
+ </div>
+ <div class="modal-body">
+ 可以将以下ID复制并粘贴到所有浏览器(例：工作和家庭).
+ <br/>
+ 所有具有相同ID的浏览器都将识别<b>you</b>, 所以请不要和别人分享.
+ <div style="text-align: center; padding-top: 10px; padding-bottom: 10px; line-height: 2;">
+ <form action="#">
+ <input type="text" class="form-control" id="switchRegistryPersonGUID" placeholder="your personal ID" maxlength="36" autocomplete="off" style="text-align: center; font-size: 1.4em;">
+ </form>
+ </div>
+ 复制此ID并将其粘贴到其他浏览器，或将从其他浏览器获取的ID粘贴到此处。
+ <div style="padding-top: 10px;"><small>
+ Keep in mind that:
+ <ul>
+ <li>当您切换ID时，您以前的ID将永远丢失-这是不可逆的。</li>
+ <li>两个ID（旧的和新的）必须在其个人列表中列出此网络数据。</li>
+ <li>注册中心必须知道这两个ID： <b><span id="switchRegistryURL"></span></b>.</li>
+ <li>要获取新的ID，只需清除浏览器cookies。</li>
+ </ul>
+ </small></div>
+ <div id="switchRegistryResponse" style="display: block; width: 100%; text-align: center; padding-top: 20px;"></div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-success" data-dismiss="modal">取消</button>
+ <a href="#" onclick="notifyForSwitchRegistry(); return false;" type="button" class="btn btn-danger">更换</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="gotoServerModal" tabindex="-1" role="dialog" aria-labelledby="gotoServerModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="gotoServerModalLabel"><span id="gotoServerName"></span></h4>
+ </div>
+ <div class="modal-body">
+ Checking known URLs for this server...
+ <div style="padding-top: 20px;">
+ <table id="gotoServerList">
+ </table>
+ </div>
+ <p style="padding-top: 10px;"><small>
+ Checks may fail if you are viewing an HTTPS page and the server to be checked is HTTP only.
+ </small></p>
+ <div id="gotoServerResponse" style="display: block; width: 100%; text-align: center; padding-top: 20px;"></div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <iframe id="ssoifrm" width="0" height="0" style="border: none;"></iframe>
+ <div id="hiddenDownloadLinks" style="display: none;" hidden></div>
+ <script type="text/javascript" src="dashboard.js?v20190902-0"></script>
+</body>
+</html>
diff --git a/applications/luci-app-netdata/root/usr/share/netdata/webcn/main.js b/applications/luci-app-netdata/root/usr/share/netdata/webcn/main.js
new file mode 100755
index 0000000..a9cfc2b
--- /dev/null
+++ b/applications/luci-app-netdata/root/usr/share/netdata/webcn/main.js
@@ -0,0 +1,5149 @@
+// Main JavaScript file for the Netdata GUI.
+
+// Codacy declarations
+/* global NETDATA */
+
+// netdata snapshot data
+var netdataSnapshotData = null;
+
+// enable alarms checking and notifications
+var netdataShowAlarms = true;
+
+// enable registry updates
+var netdataRegistry = true;
+
+// forward definition only - not used here
+var netdataServer = undefined;
+var netdataServerStatic = undefined;
+var netdataCheckXSS = undefined;
+
+// control the welcome modal and analytics
+var this_is_demo = null;
+
+function escapeUserInputHTML(s) {
+ return s.toString()
+ .replace(/&/g, '&')
+ .replace(/</g, '<')
+ .replace(/>/g, '>')
+ .replace(/"/g, '"')
+ .replace(/#/g, '#')
+ .replace(/'/g, ''')
+ .replace(/\(/g, '(')
+ .replace(/\)/g, ')')
+ .replace(/\//g, '/');
+}
+
+function verifyURL(s) {
+ if (typeof (s) === 'string' && (s.startsWith('http://') || s.startsWith('https://'))) {
+ return s
+ .replace(/'/g, '%22')
+ .replace(/"/g, '%27')
+ .replace(/\)/g, '%28')
+ .replace(/\(/g, '%29');
+ }
+
+ console.log('invalid URL detected:');
+ console.log(s);
+ return 'javascript:alert("invalid url");';
+}
+
+// --------------------------------------------------------------------
+// urlOptions
+
+var urlOptions = {
+ hash: '#',
+ theme: null,
+ help: null,
+ mode: 'live', // 'live', 'print'
+ update_always: false,
+ pan_and_zoom: false,
+ server: null,
+ after: 0,
+ before: 0,
+ highlight: false,
+ highlight_after: 0,
+ highlight_before: 0,
+ nowelcome: false,
+ show_alarms: false,
+ chart: null,
+ family: null,
+ alarm: null,
+ alarm_unique_id: 0,
+ alarm_id: 0,
+ alarm_event_id: 0,
+ alarm_when: 0,
+
+ hasProperty: function (property) {
+ // console.log('checking property ' + property + ' of type ' + typeof(this[property]));
+ return typeof this[property] !== 'undefined';
+ },
+
+ genHash: function (forReload) {
+ var hash = urlOptions.hash;
+
+ if (urlOptions.pan_and_zoom === true) {
+ hash += ';after=' + urlOptions.after.toString() +
+ ';before=' + urlOptions.before.toString();
+ }
+
+ if (urlOptions.highlight === true) {
+ hash += ';highlight_after=' + urlOptions.highlight_after.toString() +
+ ';highlight_before=' + urlOptions.highlight_before.toString();
+ }
+
+ if (urlOptions.theme !== null) {
+ hash += ';theme=' + urlOptions.theme.toString();
+ }
+
+ if (urlOptions.help !== null) {
+ hash += ';help=' + urlOptions.help.toString();
+ }
+
+ if (urlOptions.update_always === true) {
+ hash += ';update_always=true';
+ }
+
+ if (forReload === true && urlOptions.server !== null) {
+ hash += ';server=' + urlOptions.server.toString();
+ }
+
+ if (urlOptions.mode !== 'live') {
+ hash += ';mode=' + urlOptions.mode;
+ }
+
+ return hash;
+ },
+
+ parseHash: function () {
+ var variables = document.location.hash.split(';');
+ var len = variables.length;
+ while (len--) {
+ if (len !== 0) {
+ var p = variables[len].split('=');
+ if (urlOptions.hasProperty(p[0]) && typeof p[1] !== 'undefined') {
+ urlOptions[p[0]] = decodeURIComponent(p[1]);
+ }
+ } else {
+ if (variables[len].length > 0) {
+ urlOptions.hash = variables[len];
+ }
+ }
+ }
+
+ var booleans = ['nowelcome', 'show_alarms', 'update_always'];
+ len = booleans.length;
+ while (len--) {
+ if (urlOptions[booleans[len]] === 'true' || urlOptions[booleans[len]] === true || urlOptions[booleans[len]] === '1' || urlOptions[booleans[len]] === 1) {
+ urlOptions[booleans[len]] = true;
+ } else {
+ urlOptions[booleans[len]] = false;
+ }
+ }
+
+ var numeric = ['after', 'before', 'highlight_after', 'highlight_before', 'alarm_when'];
+ len = numeric.length;
+ while (len--) {
+ if (typeof urlOptions[numeric[len]] === 'string') {
+ try {
+ urlOptions[numeric[len]] = parseInt(urlOptions[numeric[len]]);
+ }
+ catch (e) {
+ console.log('failed to parse URL hash parameter ' + numeric[len]);
+ urlOptions[numeric[len]] = 0;
+ }
+ }
+ }
+
+ if (urlOptions.alarm_when) {
+ // if alarm_when exists, create after/before params
+ // -/+ 2 minutes from the alarm, and reload the page
+ const alarmTime = new Date(urlOptions.alarm_when * 1000).valueOf();
+ const timeMarginMs = 120000; // 2 mins
+
+ const after = alarmTime - timeMarginMs;
+ const before = alarmTime + timeMarginMs;
+ const newHash = document.location.hash.replace(
+ /;alarm_when=[0-9]*/i,
+ ";after=" + after + ";before=" + before,
+ );
+ history.replaceState(null, '', newHash);
+ location.reload();
+ }
+
+ if (urlOptions.server !== null && urlOptions.server !== '') {
+ netdataServerStatic = document.location.origin.toString() + document.location.pathname.toString();
+ netdataServer = urlOptions.server;
+ netdataCheckXSS = true;
+ } else {
+ urlOptions.server = null;
+ }
+
+ if (urlOptions.before > 0 && urlOptions.after > 0) {
+ urlOptions.pan_and_zoom = true;
+ urlOptions.nowelcome = true;
+ } else {
+ urlOptions.pan_and_zoom = false;
+ }
+
+ if (urlOptions.highlight_before > 0 && urlOptions.highlight_after > 0) {
+ urlOptions.highlight = true;
+ } else {
+ urlOptions.highlight = false;
+ }
+
+ switch (urlOptions.mode) {
+ case 'print':
+ urlOptions.theme = 'white';
+ urlOptions.welcome = false;
+ urlOptions.help = false;
+ urlOptions.show_alarms = false;
+
+ if (urlOptions.pan_and_zoom === false) {
+ urlOptions.pan_and_zoom = true;
+ urlOptions.before = Date.now();
+ urlOptions.after = urlOptions.before - 600000;
+ }
+
+ netdataShowAlarms = false;
+ netdataRegistry = false;
+ this_is_demo = false;
+ break;
+
+ case 'live':
+ default:
+ urlOptions.mode = 'live';
+ break;
+ }
+
+ // console.log(urlOptions);
+ },
+
+ hashUpdate: function () {
+ history.replaceState(null, '', urlOptions.genHash(true));
+ },
+
+ netdataPanAndZoomCallback: function (status, after, before) {
+ //console.log(1);
+ //console.log(new Error().stack);
+
+ if (netdataSnapshotData === null) {
+ urlOptions.pan_and_zoom = status;
+ urlOptions.after = after;
+ urlOptions.before = before;
+ urlOptions.hashUpdate();
+ }
+ },
+
+ netdataHighlightCallback: function (status, after, before) {
+ //console.log(2);
+ //console.log(new Error().stack);
+
+ if (status === true && (after === null || before === null || after <= 0 || before <= 0 || after >= before)) {
+ status = false;
+ after = 0;
+ before = 0;
+ }
+
+ if (netdataSnapshotData === null) {
+ urlOptions.highlight = status;
+ } else {
+ urlOptions.highlight = false;
+ }
+
+ urlOptions.highlight_after = Math.round(after);
+ urlOptions.highlight_before = Math.round(before);
+ urlOptions.hashUpdate();
+
+ var show_eye = NETDATA.globalChartUnderlay.hasViewport();
+
+ if (status === true && after > 0 && before > 0 && after < before) {
+ var d1 = NETDATA.dateTime.localeDateString(after);
+ var d2 = NETDATA.dateTime.localeDateString(before);
+ if (d1 === d2) {
+ d2 = '';
+ }
+ document.getElementById('navbar-highlight-content').innerHTML =
+ ((show_eye === true) ? '<span class="navbar-highlight-bar highlight-tooltip" onclick="urlOptions.showHighlight();" title="restore the highlighted view" data-toggle="tooltip" data-placement="bottom">' : '<span>').toString()
+ + 'highlighted time-frame'
+ + ' <b>' + d1 + ' <code>' + NETDATA.dateTime.localeTimeString(after) + '</code></b> to '
+ + ' <b>' + d2 + ' <code>' + NETDATA.dateTime.localeTimeString(before) + '</code></b>, '
+ + 'duration <b>' + NETDATA.seconds4human(Math.round((before - after) / 1000)) + '</b>'
+ + '</span>'
+ + '<span class="navbar-highlight-button-right highlight-tooltip" onclick="urlOptions.clearHighlight();" title="clear the highlighted time-frame" data-toggle="tooltip" data-placement="bottom"><i class="fas fa-times"></i></span>';
+
+ $('.navbar-highlight').show();
+
+ $('.highlight-tooltip').tooltip({
+ html: true,
+ delay: {show: 500, hide: 0},
+ container: 'body'
+ });
+ } else {
+ $('.navbar-highlight').hide();
+ }
+ },
+
+ clearHighlight: function () {
+ NETDATA.globalChartUnderlay.clear();
+
+ if (NETDATA.globalPanAndZoom.isActive() === true) {
+ NETDATA.globalPanAndZoom.clearMaster();
+ }
+ },
+
+ showHighlight: function () {
+ NETDATA.globalChartUnderlay.focus();
+ }
+};
+
+urlOptions.parseHash();
+
+// --------------------------------------------------------------------
+// check options that should be processed before loading netdata.js
+
+var localStorageTested = -1;
+
+function localStorageTest() {
+ if (localStorageTested !== -1) {
+ return localStorageTested;
+ }
+
+ if (typeof Storage !== "undefined" && typeof localStorage === 'object') {
+ var test = 'test';
+ try {
+ localStorage.setItem(test, test);
+ localStorage.removeItem(test);
+ localStorageTested = true;
+ }
+ catch (e) {
+ console.log(e);
+ localStorageTested = false;
+ }
+ } else {
+ localStorageTested = false;
+ }
+
+ return localStorageTested;
+}
+
+function loadLocalStorage(name) {
+ var ret = null;
+
+ try {
+ if (localStorageTest() === true) {
+ ret = localStorage.getItem(name);
+ } else {
+ console.log('localStorage is not available');
+ }
+ }
+ catch (error) {
+ console.log(error);
+ return null;
+ }
+
+ if (typeof ret === 'undefined' || ret === null) {
+ return null;
+ }
+
+ // console.log('loaded: ' + name.toString() + ' = ' + ret.toString());
+
+ return ret;
+}
+
+function saveLocalStorage(name, value) {
+ // console.log('saving: ' + name.toString() + ' = ' + value.toString());
+ try {
+ if (localStorageTest() === true) {
+ localStorage.setItem(name, value.toString());
+ return true;
+ }
+ }
+ catch (error) {
+ console.log(error);
+ }
+
+ return false;
+}
+
+function getTheme(def) {
+ if (urlOptions.mode === 'print') {
+ return 'white';
+ }
+
+ var ret = loadLocalStorage('netdataTheme');
+ if (typeof ret === 'undefined' || ret === null || ret === 'undefined') {
+ return def;
+ } else {
+ return ret;
+ }
+}
+
+function setTheme(theme) {
+ if (urlOptions.mode === 'print') {
+ return false;
+ }
+
+ if (theme === netdataTheme) {
+ return false;
+ }
+ return saveLocalStorage('netdataTheme', theme);
+}
+
+var netdataTheme = getTheme('slate');
+var netdataShowHelp = true;
+
+if (urlOptions.theme !== null) {
+ setTheme(urlOptions.theme);
+ netdataTheme = urlOptions.theme;
+} else {
+ urlOptions.theme = netdataTheme;
+}
+
+if (urlOptions.help !== null) {
+ saveLocalStorage('options.show_help', urlOptions.help);
+ netdataShowHelp = urlOptions.help;
+} else {
+ urlOptions.help = loadLocalStorage('options.show_help');
+}
+
+// --------------------------------------------------------------------
+// natural sorting
+// http://www.davekoelle.com/files/alphanum.js - LGPL
+
+function naturalSortChunkify(t) {
+ var tz = [];
+ var x = 0, y = -1, n = 0, i, j;
+
+ while (i = (j = t.charAt(x++)).charCodeAt(0)) {
+ var m = (i >= 48 && i <= 57);
+ if (m !== n) {
+ tz[++y] = "";
+ n = m;
+ }
+ tz[y] += j;
+ }
+
+ return tz;
+}
+
+function naturalSortCompare(a, b) {
+ var aa = naturalSortChunkify(a.toLowerCase());
+ var bb = naturalSortChunkify(b.toLowerCase());
+
+ for (var x = 0; aa[x] && bb[x]; x++) {
+ if (aa[x] !== bb[x]) {
+ var c = Number(aa[x]), d = Number(bb[x]);
+ if (c.toString() === aa[x] && d.toString() === bb[x]) {
+ return c - d;
+ } else {
+ return (aa[x] > bb[x]) ? 1 : -1;
+ }
+ }
+ }
+
+ return aa.length - bb.length;
+}
+
+// --------------------------------------------------------------------
+// saving files to client
+
+function saveTextToClient(data, filename) {
+ var blob = new Blob([data], {
+ type: 'application/octet-stream'
+ });
+
+ var url = URL.createObjectURL(blob);
+ var link = document.createElement('a');
+ link.setAttribute('href', url);
+ link.setAttribute('download', filename);
+
+ var el = document.getElementById('hiddenDownloadLinks');
+ el.innerHTML = '';
+ el.appendChild(link);
+
+ setTimeout(function () {
+ el.removeChild(link);
+ URL.revokeObjectURL(url);
+ }, 60);
+
+ link.click();
+}
+
+function saveObjectToClient(data, filename) {
+ saveTextToClient(JSON.stringify(data), filename);
+}
+
+// -----------------------------------------------------------------------------
+// registry call back to render my-netdata menu
+
+function toggleExpandIcon(svgEl) {
+ if (svgEl.getAttribute('data-icon') === 'caret-down') {
+ svgEl.setAttribute('data-icon', 'caret-up');
+ } else {
+ svgEl.setAttribute('data-icon', 'caret-down');
+ }
+}
+
+function toggleAgentItem(e, guid) {
+ e.stopPropagation();
+ e.preventDefault();
+
+ toggleExpandIcon(e.currentTarget.children[0]);
+
+ const el = document.querySelector(`.agent-alternate-urls.agent-${guid}`);
+ if (el) {
+ el.classList.toggle('collapsed');
+ }
+}
+
+// When you stream metrics from netdata to netdata, the recieving netdata now
+// has multiple host databases. It's own, and multiple mirrored. Mirrored databases
+// can be accessed with <http://localhost:19999/host/NAME/>
+const OLD_DASHBOARD_SUFFIX = "old"
+let isOldSuffix = true
+try {
+ const currentScriptMainJs = document.currentScript;
+ const mainJsSrc = currentScriptMainJs.getAttribute("src")
+ isOldSuffix = mainJsSrc.startsWith("../main.js")
+} catch {
+ console.warn("current script not detecting, assuming the dashboard is running with /old suffix")
+}
+
+function transformWithOldSuffix(url) {
+ return isOldSuffix ? `../${url}` : url
+}
+
+function renderStreamedHosts(options) {
+ let html = `<div class="info-item">Databases streamed to this agent</div>`;
+
+ var base = document.location.origin.toString() +
+ document.location.pathname.toString()
+ .replace(isOldSuffix ? `/${OLD_DASHBOARD_SUFFIX}` : "", "");
+ if (base.endsWith("/host/" + options.hostname + "/")) {
+ base = base.substring(0, base.length - ("/host/" + options.hostname + "/").toString().length);
+ }
+
+ if (base.endsWith("/")) {
+ base = base.substring(0, base.length - 1);
+ }
+
+ var master = options.hosts[0].hostname;
+ // We sort a clone of options.hosts, to keep the master as the first element
+ // for future calls.
+ var sorted = options.hosts.slice(0).sort(function (a, b) {
+ if (a.hostname === master) {
+ return -1;
+ }
+ return naturalSortCompare(a.hostname, b.hostname);
+ });
+
+ let displayedDatabases = false;
+
+ for (var s of sorted) {
+ let url, icon;
+ const hostname = s.hostname;
+
+ if (myNetdataMenuFilterValue !== "") {
+ if (!hostname.includes(myNetdataMenuFilterValue)) {
+ continue;
+ }
+ }
+
+ displayedDatabases = true;
+
+ if (hostname === master) {
+ url = isOldSuffix ? `${base}/${OLD_DASHBOARD_SUFFIX}/` : `${base}/`;
+ icon = 'home';
+ } else {
+ url = isOldSuffix ? `${base}/host/${hostname}/${OLD_DASHBOARD_SUFFIX}/` : `${base}/host/${hostname}/`;
+ icon = 'window-restore';
+ }
+
+ html += (
+ `<div class="agent-item">
+ <a class="registry_link" href="${url}#" onClick="return gotoHostedModalHandler('${url}');">
+ <i class="fas fa-${icon}" style="color: #999;"></i>
+ </a>
+ <span class="__title" onClick="return gotoHostedModalHandler('${url}');">
+ <a class="registry_link" href="${url}#">${hostname}</a>
+ </span>
+ <div></div>
+ </div>`
+ )
+ }
+
+ if (!displayedDatabases) {
+ html += (
+ `<div class="info-item">
+ <i class="fas fa-filter"></i>
+ <span style="margin-left: 8px">no databases match the filter criteria.<span>
+ </div>`
+ )
+ }
+
+ return html;
+}
+
+function renderMachines(machinesArray) {
+ let html = `<div class="info-item">My nodes</div>`;
+
+ if (machinesArray === null) {
+ let ret = loadLocalStorage("registryCallback");
+ if (ret) {
+ machinesArray = JSON.parse(ret);
+ console.log("failed to contact the registry - loaded registry data from browser local storage");
+ }
+ }
+
+ let found = false;
+ let displayedAgents = false;
+
+ const maskedURL = NETDATA.registry.MASKED_DATA;
+
+ if (machinesArray) {
+ saveLocalStorage("registryCallback", JSON.stringify(machinesArray));
+
+ var machines = machinesArray.sort(function (a, b) {
+ return naturalSortCompare(a.name, b.name);
+ });
+
+ for (var machine of machines) {
+ found = true;
+
+ if (myNetdataMenuFilterValue !== "") {
+ if (!machine.name.includes(myNetdataMenuFilterValue)) {
+ continue;
+ }
+ }
+
+ displayedAgents = true;
+
+ const alternateUrlItems = (
+ `<div class="agent-alternate-urls agent-${machine.guid} collapsed">
+ ${machine.alternate_urls.reduce((str, url) => {
+ if (url === maskedURL) {
+ return str
+ }
+
+ return str + (
+ `<div class="agent-item agent-item--alternate">
+ <div></div>
+ <a href="${url}" title="${url}">${truncateString(url, 64)}</a>
+ <a href="#" onclick="deleteRegistryModalHandler('${machine.guid}', '${machine.name}', '${url}'); return false;">
+ <i class="fas fa-trash" style="color: #777;"></i>
+ </a>
+ </div>`
+ )
+ },
+ ''
+ )}
+ </div>`
+ )
+
+ html += (
+ `<div class="agent-item agent-${machine.guid}">
+ <i class="fas fa-chart-bar" color: #fff"></i>
+ <span class="__title" onClick="return gotoServerModalHandler('${machine.guid}');">
+ <a class="registry_link" href="${machine.url}#">${machine.name}</a>
+ </span>
+ <a href="#" onClick="toggleAgentItem(event, '${machine.guid}');">
+ <i class="fas fa-caret-down" style="color: #999"></i>
+ </a>
+ </div>
+ ${alternateUrlItems}`
+ )
+ }
+
+ if (found && (!displayedAgents)) {
+ html += (
+ `<div class="info-item">
+ <i class="fas fa-filter"></i>
+ <span style="margin-left: 8px">zero nodes are matching the filter value.<span>
+ </div>`
+ )
+ }
+ }
+
+ if (!found) {
+ if (machines) {
+ html += (
+ `<div class="info-item">
+ <a href="https://github.com/netdata/netdata/tree/master/registry#registry" target="_blank">Your nodes list is empty</a>
+ </div>`
+ )
+ } else {
+ html += (
+ `<div class="info-item">
+ <a href="https://github.com/netdata/netdata/tree/master/registry#registry" target="_blank">Failed to contact the registry</a>
+ </div>`
+ )
+ }
+
+ html += `<hr />`;
+ html += `<div class="info-item">Demo netdata nodes</div>`;
+
+ const demoServers = [
+ {url: "//london.netdata.rocks/default.html", title: "UK - London (DigitalOcean.com)"},
+ {url: "//newyork.netdata.rocks/default.html", title: "US - New York (DigitalOcean.com)"},
+ {url: "//sanfrancisco.netdata.rocks/default.html", title: "US - San Francisco (DigitalOcean.com)"},
+ {url: "//atlanta.netdata.rocks/default.html", title: "US - Atlanta (CDN77.com)"},
+ {url: "//frankfurt.netdata.rocks/default.html", title: "Germany - Frankfurt (DigitalOcean.com)"},
+ {url: "//toronto.netdata.rocks/default.html", title: "Canada - Toronto (DigitalOcean.com)"},
+ {url: "//singapore.netdata.rocks/default.html", title: "Japan - Singapore (DigitalOcean.com)"},
+ {url: "//bangalore.netdata.rocks/default.html", title: "India - Bangalore (DigitalOcean.com)"},
+
+ ]
+
+ for (var server of demoServers) {
+ html += (
+ `<div class="agent-item">
+ <i class="fas fa-chart-bar" style="color: #fff"></i>
+ <a href="${server.url}">${server.title}</a>
+ <div></div>
+ </div>
+ `
+ );
+ }
+ }
+
+ return html;
+}
+
+function setMyNetdataMenu(html) {
+ const el = document.getElementById('my-netdata-dropdown-content')
+ el.innerHTML = html;
+}
+
+function clearMyNetdataMenu() {
+ setMyNetdataMenu(`<div class="agent-item" style="white-space: nowrap">
+ <i class="fas fa-hourglass-half"></i>
+ Loading, please wait...
+ <div></div>
+ </div>`);
+}
+
+function errorMyNetdataMenu() {
+ setMyNetdataMenu(`<div class="agent-item" style="padding: 0 8px">
+ <i class="fas fa-exclamation-triangle" style="color: red"></i>
+ Cannot load known Netdata agents from Netdata Cloud! Please make sure you have the latest version of Netdata.
+ </div>`);
+}
+
+function restrictMyNetdataMenu() {
+ setMyNetdataMenu(`<div class="info-item" style="white-space: nowrap">
+ <span>Please <a href="#" onclick="signInDidClick(event); return false">sign in to netdata.cloud</a> to view your nodes!</span>
+ <div></div>
+ </div>`);
+}
+
+function openAuthenticatedUrl(url) {
+ if (isSignedIn()) {
+ window.open(url);
+ } else {
+ window.open(`${NETDATA.registry.cloudBaseURL}/account/sign-in-agent?id=${NETDATA.registry.machine_guid}&name=${encodeURIComponent(NETDATA.registry.hostname)}&origin=${encodeURIComponent(window.location.origin + "/")}&redirect_uri=${encodeURIComponent(window.location.origin + "/" + url)}`);
+ }
+}
+
+function renderMyNetdataMenu(machinesArray) {
+ const el = document.getElementById('my-netdata-dropdown-content');
+ el.classList.add(`theme-${netdataTheme}`);
+
+ if (machinesArray == registryAgents) {
+ console.log("Rendering my-netdata menu from registry");
+ } else {
+ console.log("Rendering my-netdata menu from netdata.cloud", machinesArray);
+ }
+
+ let html = '';
+
+ if (!isSignedIn()) {
+ if (!NETDATA.registry.isRegistryEnabled()) {
+ html += (
+ ``
+ );
+ }
+ }
+
+ if (isSignedIn()) {
+ html += (
+ `<div class="filter-control">
+ <input
+ id="my-netdata-menu-filter-input"
+ type="text"
+ placeholder="filter nodes..."
+ autofocus
+ autocomplete="off"
+ value="${myNetdataMenuFilterValue}"
+ onkeydown="myNetdataFilterDidChange(event)"
+ />
+ <span class="filter-control__clear" onclick="myNetdataFilterClearDidClick(event)"><i class="fas fa-times"></i><span>
+ </div>
+ <hr />`
+ );
+ }
+
+ // options.hosts = [
+ // {
+ // hostname: "streamed1",
+ // },
+ // {
+ // hostname: "streamed2",
+ // },
+ // ]
+
+ if (options.hosts.length > 1) {
+ html += `<div id="my-netdata-menu-streamed">${renderStreamedHosts(options)}</div><hr />`;
+ }
+
+ if (isSignedIn() || NETDATA.registry.isRegistryEnabled()) {
+ html += `<div id="my-netdata-menu-machines">${renderMachines(machinesArray)}</div><hr />`;
+ }
+
+ if (!isSignedIn()) {
+ html += (
+ `<div class="agent-item">
+ <i class="fas fa-cog""></i>
+ <a href="#" onclick="switchRegistryModalHandler(); return false;">更换标识</a>
+ <div></div>
+ </div>
+ <div class="agent-item">
+ <i class="fas fa-question-circle""></i>
+ <a href="https://github.com/netdata/netdata/tree/master/registry#registry" target="_blank">这是什么?</a>
+ <div></div>
+ </div>`
+ )
+ } else {
+ html += (
+ `<div class="agent-item">
+ <i class="fas fa-tv"></i>
+ <a onclick="openAuthenticatedUrl('console.html');" target="_blank">Nodes<sup class="beta"> beta</sup></a>
+ <div></div>
+ </div>
+ <div class="agent-item">
+ <i class="fas fa-sync"></i>
+ <a href="#" onclick="showSyncModal(); return false">Synchronize with netdata.cloud</a>
+ <div></div>
+ </div>
+ <div class="agent-item">
+ <i class="fas fa-question-circle""></i>
+ <a href="https://netdata.cloud/about" target="_blank">What is this?</a>
+ <div></div>
+ </div>`
+ )
+ }
+
+ el.innerHTML = html;
+
+ gotoServerInit();
+}
+
+function isdemo() {
+ if (this_is_demo !== null) {
+ return this_is_demo;
+ }
+ this_is_demo = false;
+
+ try {
+ if (typeof document.location.hostname === 'string') {
+ if (document.location.hostname.endsWith('.my-netdata.io') ||
+ document.location.hostname.endsWith('.mynetdata.io') ||
+ document.location.hostname.endsWith('.netdata.rocks') ||
+ document.location.hostname.endsWith('.netdata.ai') ||
+ document.location.hostname.endsWith('.netdata.live') ||
+ document.location.hostname.endsWith('.firehol.org') ||
+ document.location.hostname.endsWith('.netdata.online') ||
+ document.location.hostname.endsWith('.netdata.cloud')) {
+ this_is_demo = true;
+ }
+ }
+ }
+ catch (error) {
+ }
+ return this_is_demo;
+}
+
+function netdataURL(url, forReload) {
+ if (typeof url === 'undefined')
+ // url = document.location.toString();
+ {
+ url = '';
+ }
+
+ if (url.indexOf('#') !== -1) {
+ url = url.substring(0, url.indexOf('#'));
+ }
+
+ var hash = urlOptions.genHash(forReload);
+
+ // console.log('netdataURL: ' + url + hash);
+
+ return url + hash;
+}
+
+function netdataReload(url) {
+ document.location = verifyURL(netdataURL(url, true));
+
+ // since we play with hash
+ // this is needed to reload the page
+ location.reload();
+}
+
+function gotoHostedModalHandler(url) {
+ document.location = verifyURL(url + urlOptions.genHash());
+ return false;
+}
+
+var gotoServerValidateRemaining = 0;
+var gotoServerMiddleClick = false;
+var gotoServerStop = false;
+
+function gotoServerValidateUrl(id, guid, url) {
+ var penalty = 0;
+ var error = 'failed';
+
+ if (document.location.toString().startsWith('http://') && url.toString().startsWith('https://'))
+ // we penalize https only if the current url is http
+ // to allow the user walk through all its servers.
+ {
+ penalty = 500;
+ } else if (document.location.toString().startsWith('https://') && url.toString().startsWith('http://')) {
+ error = 'can\'t check';
+ }
+
+ var finalURL = netdataURL(url);
+
+ setTimeout(function () {
+ document.getElementById('gotoServerList').innerHTML += '<tr><td style="padding-left: 20px;"><a href="' + verifyURL(finalURL) + '" target="_blank">' + escapeUserInputHTML(url) + '</a></td><td style="padding-left: 30px;"><code id="' + guid + '-' + id + '-status">checking...</code></td></tr>';
+
+ NETDATA.registry.hello(url, function (data) {
+ if (typeof data !== 'undefined' && data !== null && typeof data.machine_guid === 'string' && data.machine_guid === guid) {
+ // console.log('OK ' + id + ' URL: ' + url);
+ document.getElementById(guid + '-' + id + '-status').innerHTML = "OK";
+
+ if (!gotoServerStop) {
+ gotoServerStop = true;
+
+ if (gotoServerMiddleClick) {
+ window.open(verifyURL(finalURL), '_blank');
+ gotoServerMiddleClick = false;
+ document.getElementById('gotoServerResponse').innerHTML = '<b>Opening new window to ' + NETDATA.registry.machines[guid].name + '<br/><a href="' + verifyURL(finalURL) + '">' + escapeUserInputHTML(url) + '</a></b><br/>(check your pop-up blocker if it fails)';
+ } else {
+ document.getElementById('gotoServerResponse').innerHTML += 'found it! It is at:<br/><small>' + escapeUserInputHTML(url) + '</small>';
+ document.location = verifyURL(finalURL);
+ $('#gotoServerModal').modal('hide');
+ }
+ }
+ } else {
+ if (typeof data !== 'undefined' && data !== null && typeof data.machine_guid === 'string' && data.machine_guid !== guid) {
+ error = 'wrong machine';
+ }
+
+ document.getElementById(guid + '-' + id + '-status').innerHTML = error;
+ gotoServerValidateRemaining--;
+ if (gotoServerValidateRemaining <= 0) {
+ gotoServerMiddleClick = false;
+ document.getElementById('gotoServerResponse').innerHTML = '<b>Sorry! I cannot find any operational URL for this server</b>';
+ }
+ }
+ });
+ }, (id * 50) + penalty);
+}
+
+function gotoServerModalHandler(guid) {
+ // console.log('goto server: ' + guid);
+
+ gotoServerStop = false;
+ var checked = {};
+ var len = NETDATA.registry.machines[guid].alternate_urls.length;
+ var count = 0;
+
+ document.getElementById('gotoServerResponse').innerHTML = '';
+ document.getElementById('gotoServerList').innerHTML = '';
+ document.getElementById('gotoServerName').innerHTML = NETDATA.registry.machines[guid].name;
+ $('#gotoServerModal').modal('show');
+
+ gotoServerValidateRemaining = len;
+ while (len--) {
+ var url = NETDATA.registry.machines[guid].alternate_urls[len];
+ checked[url] = true;
+ gotoServerValidateUrl(count++, guid, url);
+ }
+
+ if (!isSignedIn()) {
+ // When the registry is enabled, if the user's known URLs are not working
+ // we consult the registry to get additional URLs.
+ setTimeout(function () {
+ if (gotoServerStop === false) {
+ document.getElementById('gotoServerResponse').innerHTML = '<b>Added all the known URLs for this machine.</b>';
+ NETDATA.registry.search(guid, function (data) {
+ // console.log(data);
+ len = data.urls.length;
+ while (len--) {
+ var url = data.urls[len][1];
+ // console.log(url);
+ if (typeof checked[url] === 'undefined') {
+ gotoServerValidateRemaining++;
+ checked[url] = true;
+ gotoServerValidateUrl(count++, guid, url);
+ }
+ }
+ });
+ }
+ }, 2000);
+ }
+
+ 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;
+ document.getElementById('switchRegistryResponse').innerHTML = '';
+ $('#switchRegistryModal').modal('show');
+}
+
+function notifyForSwitchRegistry() {
+ var n = document.getElementById('switchRegistryPersonGUID').value;
+
+ if (n !== '' && n.length === 36) {
+ NETDATA.registry.switch(n, function (result) {
+ if (result !== null) {
+ $('#switchRegistryModal').modal('hide');
+ NETDATA.registry.init();
+ } else {
+ document.getElementById('switchRegistryResponse').innerHTML = "<b>Sorry! The registry rejected your request.</b>";
+ }
+ });
+ } else {
+ document.getElementById('switchRegistryResponse').innerHTML = "<b>The ID you have entered is not a GUID.</b>";
+ }
+}
+
+var deleteRegistryGuid = null;
+var deleteRegistryUrl = null;
+
+function deleteRegistryModalHandler(guid, name, url) {
+ // void (guid);
+
+ deleteRegistryGuid = guid;
+ deleteRegistryUrl = url;
+
+ document.getElementById('deleteRegistryServerName').innerHTML = name;
+ document.getElementById('deleteRegistryServerName2').innerHTML = name;
+ document.getElementById('deleteRegistryServerURL').innerHTML = url;
+ document.getElementById('deleteRegistryResponse').innerHTML = '';
+
+ $('#deleteRegistryModal').modal('show');
+}
+
+function notifyForDeleteRegistry() {
+ const responseEl = document.getElementById('deleteRegistryResponse');
+
+ if (deleteRegistryUrl) {
+ if (isSignedIn()) {
+ deleteCloudAgentURL(deleteRegistryGuid, deleteRegistryUrl)
+ .then((count) => {
+ if (!count) {
+ responseEl.innerHTML = "<b>Sorry, this command was rejected by netdata.cloud!</b>";
+ return;
+ }
+ NETDATA.registry.delete(deleteRegistryUrl, function (result) {
+ if (result === null) {
+ console.log("Received error from registry", result);
+ }
+
+ deleteRegistryUrl = null;
+ $('#deleteRegistryModal').modal('hide');
+ NETDATA.registry.init();
+ });
+ });
+ } else {
+ NETDATA.registry.delete(deleteRegistryUrl, function (result) {
+ if (result !== null) {
+ deleteRegistryUrl = null;
+ $('#deleteRegistryModal').modal('hide');
+ NETDATA.registry.init();
+ } else {
+ responseEl.innerHTML = "<b>Sorry, this command was rejected by the registry server!</b>";
+ }
+ });
+ }
+ }
+}
+
+var options = {
+ menus: {},
+ submenu_names: {},
+ data: null,
+ hostname: 'netdata_server', // will be overwritten by the netdata server
+ version: 'unknown',
+ release_channel: 'unknown',
+ hosts: [],
+
+ duration: 0, // the default duration of the charts
+ update_every: 1,
+
+ chartsPerRow: 0,
+ // chartsMinWidth: 1450,
+ chartsHeight: 180,
+};
+
+function chartsPerRow(total) {
+ void (total);
+
+ if (options.chartsPerRow === 0) {
+ return 1;
+ //var width = Math.floor(total / options.chartsMinWidth);
+ //if(width === 0) width = 1;
+ //return width;
+ } else {
+ return options.chartsPerRow;
+ }
+}
+
+function prioritySort(a, b) {
+ if (a.priority < b.priority) {
+ return -1;
+ }
+ if (a.priority > b.priority) {
+ return 1;
+ }
+ return naturalSortCompare(a.name, b.name);
+}
+
+function sortObjectByPriority(object) {
+ var idx = {};
+ var sorted = [];
+
+ for (var i in object) {
+ if (!object.hasOwnProperty(i)) {
+ continue;
+ }
+
+ if (typeof idx[i] === 'undefined') {
+ idx[i] = object[i];
+ sorted.push(i);
+ }
+ }
+
+ sorted.sort(function (a, b) {
+ if (idx[a].priority < idx[b].priority) {
+ return -1;
+ }
+ if (idx[a].priority > idx[b].priority) {
+ return 1;
+ }
+ return naturalSortCompare(a, b);
+ });
+
+ return sorted;
+}
+
+// ----------------------------------------------------------------------------
+// scroll to a section, without changing the browser history
+
+function scrollToId(hash) {
+ if (hash && hash !== '' && document.getElementById(hash) !== null) {
+ var offset = $('#' + hash).offset();
+ if (typeof offset !== 'undefined') {
+ //console.log('scrolling to ' + hash + ' at ' + offset.top.toString());
+ $('html, body').animate({scrollTop: offset.top - 30}, 0);
+ }
+ }
+
+ // we must return false to prevent the default action
+ return false;
+}
+
+// ----------------------------------------------------------------------------
+
+// user editable information
+var customDashboard = {
+ menu: {},
+ submenu: {},
+ context: {}
+};
+
+// netdata standard information
+var netdataDashboard = {
+ sparklines_registry: {},
+ os: 'unknown',
+
+ menu: {},
+ submenu: {},
+ context: {},
+
+ // generate a sparkline
+ // used in the documentation
+ sparkline: function (prefix, chart, dimension, units, suffix) {
+ if (options.data === null || typeof options.data.charts === 'undefined') {
+ return '';
+ }
+
+ if (typeof options.data.charts[chart] === 'undefined') {
+ return '';
+ }
+
+ if (typeof options.data.charts[chart].dimensions === 'undefined') {
+ return '';
+ }
+
+ if (typeof options.data.charts[chart].dimensions[dimension] === 'undefined') {
+ return '';
+ }
+
+ var key = chart + '.' + dimension;
+
+ if (typeof units === 'undefined') {
+ units = '';
+ }
+
+ if (typeof this.sparklines_registry[key] === 'undefined') {
+ this.sparklines_registry[key] = {count: 1};
+ } else {
+ this.sparklines_registry[key].count++;
+ }
+
+ key = key + '.' + this.sparklines_registry[key].count;
+
+ return prefix + '<div class="netdata-container" data-netdata="' + chart + '" data-after="-120" data-width="25%" data-height="15px" data-chart-library="dygraph" data-dygraph-theme="sparkline" data-dimensions="' + dimension + '" data-show-value-of-' + dimension + '-at="' + key + '"></div> (<span id="' + key + '" style="display: inline-block; min-width: 50px; text-align: right;">X</span>' + units + ')' + suffix;
+ },
+
+ gaugeChart: function (title, width, dimensions, colors) {
+ if (typeof colors === 'undefined') {
+ colors = '';
+ }
+
+ if (typeof dimensions === 'undefined') {
+ dimensions = '';
+ }
+
+ return '<div class="netdata-container" data-netdata="CHART_UNIQUE_ID"'
+ + ' data-dimensions="' + dimensions + '"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-adjust="width"'
+ + ' data-title="' + title + '"'
+ + ' data-width="' + width + '"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + colors + '"'
+ + ' role="application"></div>';
+ },
+
+ anyAttribute: function (obj, attr, key, def) {
+ if (typeof (obj[key]) !== 'undefined') {
+ var x = obj[key][attr];
+
+ if (typeof (x) === 'undefined') {
+ return def;
+ }
+
+ if (typeof (x) === 'function') {
+ return x(netdataDashboard.os);
+ }
+
+ return x;
+ }
+
+ return def;
+ },
+
+ menuTitle: function (chart) {
+ if (typeof chart.menu_pattern !== 'undefined') {
+ return (this.anyAttribute(this.menu, 'title', chart.menu_pattern, chart.menu_pattern).toString()
+ + ' ' + chart.type.slice(-(chart.type.length - chart.menu_pattern.length - 1)).toString()).replace(/_/g, ' ');
+ }
+
+ return (this.anyAttribute(this.menu, 'title', chart.menu, chart.menu)).toString().replace(/_/g, ' ');
+ },
+
+ menuIcon: function (chart) {
+ if (typeof chart.menu_pattern !== 'undefined') {
+ return this.anyAttribute(this.menu, 'icon', chart.menu_pattern, '<i class="fas fa-puzzle-piece"></i>').toString();
+ }
+
+ return this.anyAttribute(this.menu, 'icon', chart.menu, '<i class="fas fa-puzzle-piece"></i>');
+ },
+
+ menuInfo: function (chart) {
+ if (typeof chart.menu_pattern !== 'undefined') {
+ return this.anyAttribute(this.menu, 'info', chart.menu_pattern, null);
+ }
+
+ return this.anyAttribute(this.menu, 'info', chart.menu, null);
+ },
+
+ menuHeight: function (chart) {
+ if (typeof chart.menu_pattern !== 'undefined') {
+ return this.anyAttribute(this.menu, 'height', chart.menu_pattern, 1.0);
+ }
+
+ return this.anyAttribute(this.menu, 'height', chart.menu, 1.0);
+ },
+
+ submenuTitle: function (menu, submenu) {
+ var key = menu + '.' + submenu;
+ // console.log(key);
+ var title = this.anyAttribute(this.submenu, 'title', key, submenu).toString().replace(/_/g, ' ');
+ if (title.length > 28) {
+ var a = title.substring(0, 13);
+ var b = title.substring(title.length - 12, title.length);
+ return a + '...' + b;
+ }
+ return title;
+ },
+
+ submenuInfo: function (menu, submenu) {
+ var key = menu + '.' + submenu;
+ return this.anyAttribute(this.submenu, 'info', key, null);
+ },
+
+ submenuHeight: function (menu, submenu, relative) {
+ var key = menu + '.' + submenu;
+ return this.anyAttribute(this.submenu, 'height', key, 1.0) * relative;
+ },
+
+ contextInfo: function (id) {
+ var x = this.anyAttribute(this.context, 'info', id, null);
+
+ if (x !== null) {
+ return '<div class="shorten dashboard-context-info netdata-chart-alignment" role="document">' + x + '</div>';
+ } else {
+ return '';
+ }
+ },
+
+ contextValueRange: function (id) {
+ if (typeof this.context[id] !== 'undefined' && typeof this.context[id].valueRange !== 'undefined') {
+ return this.context[id].valueRange;
+ } else {
+ return '[null, null]';
+ }
+ },
+
+ contextHeight: function (id, def) {
+ if (typeof this.context[id] !== 'undefined' && typeof this.context[id].height !== 'undefined') {
+ return def * this.context[id].height;
+ } else {
+ return def;
+ }
+ },
+
+ contextDecimalDigits: function (id, def) {
+ if (typeof this.context[id] !== 'undefined' && typeof this.context[id].decimalDigits !== 'undefined') {
+ return this.context[id].decimalDigits;
+ } else {
+ return def;
+ }
+ }
+};
+
+// ----------------------------------------------------------------------------
+
+// enrich the data structure returned by netdata
+// to reflect our menu system and content
+// TODO: this is a shame - we should fix charts naming (issue #807)
+function enrichChartData(chart) {
+ var parts = chart.type.split('_');
+ var tmp = parts[0];
+
+ switch (tmp) {
+ case 'ap':
+ case 'net':
+ case 'disk':
+ case 'powersupply':
+ case 'statsd':
+ chart.menu = tmp;
+ break;
+
+ case 'apache':
+ 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':
+ chart.menu = chart.type;
+ if (chart.id.match(/.*[\._\/-:]qemu[\._\/-:]*/) || chart.id.match(/.*[\._\/-:]kvm[\._\/-:]*/)) {
+ chart.menu_pattern = 'cgqemu';
+ } else {
+ chart.menu_pattern = 'cgroup';
+ }
+ break;
+
+ case 'go':
+ chart.menu = chart.type;
+ if (parts.length > 2 && parts[1] === 'expvar') {
+ chart.menu_pattern = tmp + '_' + parts[1];
+ } else if (parts.length > 1) {
+ chart.menu_pattern = tmp;
+ }
+ break;
+
+ case 'isc':
+ 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':
+ case 'web':
+ chart.menu = chart.type;
+ if (parts.length > 2 && parts[1] === 'log') {
+ chart.menu_pattern = tmp + '_' + parts[1];
+ } else if (parts.length > 1) {
+ chart.menu_pattern = tmp;
+ }
+ break;
+
+ case 'tc':
+ chart.menu = tmp;
+
+ // find a name for this device from fireqos info
+ // we strip '_(in|out)' or '(in|out)_'
+ if (chart.context === 'tc.qos' && (typeof options.submenu_names[chart.family] === 'undefined' || options.submenu_names[chart.family] === chart.family)) {
+ var n = chart.name.split('.')[1];
+ if (n.endsWith('_in')) {
+ options.submenu_names[chart.family] = n.slice(0, n.lastIndexOf('_in'));
+ } else if (n.endsWith('_out')) {
+ options.submenu_names[chart.family] = n.slice(0, n.lastIndexOf('_out'));
+ } else if (n.startsWith('in_')) {
+ options.submenu_names[chart.family] = n.slice(3, n.length);
+ } else if (n.startsWith('out_')) {
+ options.submenu_names[chart.family] = n.slice(4, n.length);
+ } else {
+ options.submenu_names[chart.family] = n;
+ }
+ }
+
+ // increase the priority of IFB devices
+ // to have inbound appear before outbound
+ if (chart.id.match(/.*-ifb$/)) {
+ chart.priority--;
+ }
+
+ break;
+
+ default:
+ chart.menu = chart.type;
+ if (parts.length > 1) {
+ chart.menu_pattern = tmp;
+ }
+ break;
+ }
+
+ chart.submenu = chart.family;
+}
+
+// ----------------------------------------------------------------------------
+
+function headMain(os, charts, duration) {
+ void (os);
+
+ if (urlOptions.mode === 'print') {
+ return '';
+ }
+
+ var head = '';
+
+ if (typeof charts['system.swap'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.swap"'
+ + ' data-dimensions="used"'
+ + ' data-append-options="percentage"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Used Swap"'
+ + ' data-units="%"'
+ + ' data-easypiechart-max-value="100"'
+ + ' data-width="9%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-colors="#DD4400"'
+ + ' role="application"></div>';
+ }
+
+ if (typeof charts['system.io'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.io"'
+ + ' data-dimensions="in"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="磁碟读取"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.io.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.io"'
+ + ' data-dimensions="out"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="磁碟写入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.io.mainhead"'
+ + ' role="application"></div>';
+ }
+ else if (typeof charts['system.pgpgio'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.pgpgio"'
+ + ' data-dimensions="in"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="磁碟读取"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.pgpgio.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.pgpgio"'
+ + ' data-dimensions="out"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="磁碟写入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.pgpgio.mainhead"'
+ + ' role="application"></div>';
+ }
+
+ if (typeof charts['system.cpu'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.cpu"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="CPU"'
+ + ' data-units="%"'
+ + ' data-gauge-max-value="100"'
+ + ' data-width="20%"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-colors="' + NETDATA.colors[12] + '"'
+ + ' role="application"></div>';
+ }
+
+ if (typeof charts['system.net'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.net"'
+ + ' data-dimensions="received"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="网路流入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.net.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.net"'
+ + ' data-dimensions="sent"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="网路流出"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.net.mainhead"'
+ + ' role="application"></div>';
+ }
+ else if (typeof charts['system.ip'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ip"'
+ + ' data-dimensions="received"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IP 流入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ip.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ip"'
+ + ' data-dimensions="sent"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IP 流出"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ip.mainhead"'
+ + ' role="application"></div>';
+ }
+ else if (typeof charts['system.ipv4'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ipv4"'
+ + ' data-dimensions="received"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IPv4 流入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ipv4.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ipv4"'
+ + ' data-dimensions="sent"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IPv4 流出"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ipv4.mainhead"'
+ + ' role="application"></div>';
+ }
+ else if (typeof charts['system.ipv6'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ipv6"'
+ + ' data-dimensions="received"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IPv6 流入"'
+ + ' data-units="kbps"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ipv6.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ipv6"'
+ + ' data-dimensions="sent"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IPv6 流出"'
+ + ' data-units="kbps"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ipv6.mainhead"'
+ + ' role="application"></div>';
+ }
+
+ if (typeof charts['system.ram'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ram"'
+ + ' data-dimensions="used|buffers|active|wired"' // active and wired are FreeBSD stats
+ + ' data-append-options="percentage"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="已用内存"'
+ + ' data-units="%"'
+ + ' data-easypiechart-max-value="100"'
+ + ' data-width="9%"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-colors="' + NETDATA.colors[7] + '"'
+ + ' role="application"></div>';
+ }
+
+ return head;
+}
+
+function generateHeadCharts(type, chart, duration) {
+ if (urlOptions.mode === 'print') {
+ return '';
+ }
+
+ var head = '';
+ var hcharts = netdataDashboard.anyAttribute(netdataDashboard.context, type, chart.context, []);
+ if (hcharts.length > 0) {
+ var hi = 0, hlen = hcharts.length;
+ while (hi < hlen) {
+ if (typeof hcharts[hi] === 'function') {
+ head += hcharts[hi](netdataDashboard.os, chart.id).replace(/CHART_DURATION/g, duration.toString()).replace(/CHART_UNIQUE_ID/g, chart.id);
+ } else {
+ head += hcharts[hi].replace(/CHART_DURATION/g, duration.toString()).replace(/CHART_UNIQUE_ID/g, chart.id);
+ }
+ hi++;
+ }
+ }
+ return head;
+}
+
+function renderPage(menus, data) {
+ var div = document.getElementById('charts_div');
+ var pcent_width = Math.floor(100 / chartsPerRow($(div).width()));
+
+ // find the proper duration for per-second updates
+ var duration = Math.round(($(div).width() * pcent_width / 100 * data.update_every / 3) / 60) * 60;
+ options.duration = duration;
+ options.update_every = data.update_every;
+
+ var html = '';
+ var sidebar = '<ul class="nav dashboard-sidenav" data-spy="affix" id="sidebar_ul">';
+ var mainhead = headMain(netdataDashboard.os, data.charts, duration);
+
+ // sort the menus
+ var main = sortObjectByPriority(menus);
+ var i = 0, len = main.length;
+ while (i < len) {
+ var menu = main[i++];
+
+ // generate an entry at the main menu
+
+ var menuid = NETDATA.name2id('menu_' + menu);
+ sidebar += '<li class=""><a href="#' + menuid + '" onClick="return scrollToId(\'' + menuid + '\');">' + menus[menu].icon + ' ' + menus[menu].title + '</a><ul class="nav">';
+ html += '<div role="section" class="dashboard-section"><div role="sectionhead"><h1 id="' + menuid + '" role="heading">' + menus[menu].icon + ' ' + menus[menu].title + '</h1></div><div role="section" class="dashboard-subsection">';
+
+ if (menus[menu].info !== null) {
+ html += menus[menu].info;
+ }
+
+ // console.log(' >> ' + menu + ' (' + menus[menu].priority + '): ' + menus[menu].title);
+
+ var shtml = '';
+ var mhead = '<div class="netdata-chart-row">' + mainhead;
+ mainhead = '';
+
+ // sort the submenus of this menu
+ var sub = sortObjectByPriority(menus[menu].submenus);
+ var si = 0, slen = sub.length;
+ while (si < slen) {
+ var submenu = sub[si++];
+
+ // generate an entry at the submenu
+ var submenuid = NETDATA.name2id('menu_' + menu + '_submenu_' + submenu);
+ sidebar += '<li class><a href="#' + submenuid + '" onClick="return scrollToId(\'' + submenuid + '\');">' + menus[menu].submenus[submenu].title + '</a></li>';
+ shtml += '<div role="section" class="dashboard-section-container" id="' + submenuid + '"><h2 id="' + submenuid + '" class="netdata-chart-alignment" role="heading">' + menus[menu].submenus[submenu].title + '</h2>';
+
+ if (menus[menu].submenus[submenu].info !== null) {
+ shtml += '<div class="dashboard-submenu-info netdata-chart-alignment" role="document">' + menus[menu].submenus[submenu].info + '</div>';
+ }
+
+ var head = '<div class="netdata-chart-row">';
+ var chtml = '';
+
+ // console.log(' \------- ' + submenu + ' (' + menus[menu].submenus[submenu].priority + '): ' + menus[menu].submenus[submenu].title);
+
+ // sort the charts in this submenu of this menu
+ menus[menu].submenus[submenu].charts.sort(prioritySort);
+ var ci = 0, clen = menus[menu].submenus[submenu].charts.length;
+ while (ci < clen) {
+ var chart = menus[menu].submenus[submenu].charts[ci++];
+
+ // generate the submenu heading charts
+ mhead += generateHeadCharts('mainheads', chart, duration);
+ head += generateHeadCharts('heads', chart, duration);
+
+ function chartCommonMin(family, context, units) {
+ var x = netdataDashboard.anyAttribute(netdataDashboard.context, 'commonMin', context, undefined);
+ if (typeof x !== 'undefined') {
+ return ' data-common-min="' + family + '/' + context + '/' + units + '"';
+ } else {
+ return '';
+ }
+ }
+
+ function chartCommonMax(family, context, units) {
+ var x = netdataDashboard.anyAttribute(netdataDashboard.context, 'commonMax', context, undefined);
+ if (typeof x !== 'undefined') {
+ return ' data-common-max="' + family + '/' + context + '/' + units + '"';
+ } else {
+ return '';
+ }
+ }
+
+ // generate the chart
+ if (urlOptions.mode === 'print') {
+ chtml += '<div role="row" class="dashboard-print-row">';
+ }
+
+ chtml += '<div class="netdata-chartblock-container" style="width: ' + pcent_width.toString() + '%;">' + netdataDashboard.contextInfo(chart.context) + '<div class="netdata-container" id="chart_' + NETDATA.name2id(chart.id) + '" data-netdata="' + chart.id + '"'
+ + ' data-width="100%"'
+ + ' data-height="' + netdataDashboard.contextHeight(chart.context, options.chartsHeight).toString() + 'px"'
+ + ' data-dygraph-valuerange="' + netdataDashboard.contextValueRange(chart.context) + '"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-id="' + NETDATA.name2id(options.hostname + '/' + chart.id) + '"'
+ + ' data-colors="' + netdataDashboard.anyAttribute(netdataDashboard.context, 'colors', chart.context, '') + '"'
+ + ' data-decimal-digits="' + netdataDashboard.contextDecimalDigits(chart.context, -1) + '"'
+ + chartCommonMin(chart.family, chart.context, chart.units)
+ + chartCommonMax(chart.family, chart.context, chart.units)
+ + ' role="application"></div></div>';
+
+ if (urlOptions.mode === 'print') {
+ chtml += '</div>';
+ }
+ }
+
+ head += '</div>';
+ shtml += head + chtml + '</div>';
+ }
+
+ mhead += '</div>';
+ sidebar += '</ul></li>';
+ html += mhead + shtml + '</div></div><hr role="separator"/>';
+ }
+
+ const isMemoryModeDbEngine = data.memory_mode === "dbengine";
+ sidebar += '<li class="" style="padding-top:15px;"><a href="https://github.com/netdata/netdata/blob/master/docs/Add-more-charts-to-netdata.md#add-more-charts-to-netdata" target="_blank"><i class="fas fa-plus"></i> 加入更多图表</a></li>';
+ sidebar += '<li class=""><a href="https://github.com/netdata/netdata/tree/master/health#Health-monitoring" target="_blank"><i class="fas fa-plus"></i> 加入更多警报</a></li>';
+ sidebar += '<li class="" style="margin:20px;color:#666;"><small>每 ' +
+ ((data.update_every === 1) ? '秒' : data.update_every.toString() + ' 秒') + ', ' +
+ '收集<strong>' + data.dimensions_count.toLocaleString() + '</strong> 上的度量 ' +
+ data.hostname.toString() + ', 把它们呈现在<strong>' +
+ data.charts_count.toLocaleString() + '</strong> 图表' +
+ (isMemoryModeDbEngine ? '' : ',') + // oxford comma
+ ' 监控<strong>' +
+ data.alarms_count.toLocaleString() + '</strong> 警报.';
+
+ if (!isMemoryModeDbEngine) {
+ sidebar += '<br /> <br />获取更多历史记录 ' +
+ '<a href="https://learn.netdata.cloud/guides/longer-metrics-storage#using-the-round-robin-database" target=_blank>配置Netdata\'s <strong>历史</strong></a> 或使用 <a href="https://learn.netdata.cloud/docs/agent/database/engine/" target=_blank>DB 引擎.</a>';
+ }
+
+ sidebar += '<br/> <br/><strong>netdata</strong><br/>' + data.version.toString() + '</small></li>';
+ sidebar += '</ul>';
+ div.innerHTML = html;
+ document.getElementById('sidebar').innerHTML = sidebar;
+
+ if (urlOptions.highlight === true) {
+ NETDATA.globalChartUnderlay.init(null
+ , urlOptions.highlight_after
+ , urlOptions.highlight_before
+ , (urlOptions.after > 0) ? urlOptions.after : null
+ , (urlOptions.before > 0) ? urlOptions.before : null
+ );
+ } else {
+ NETDATA.globalChartUnderlay.clear();
+ }
+
+ if (urlOptions.mode === 'print') {
+ printPage();
+ } else {
+ finalizePage();
+ }
+}
+
+function renderChartsAndMenu(data) {
+ options.menus = {};
+ options.submenu_names = {};
+
+ var menus = options.menus;
+ var charts = data.charts;
+ var m, menu_key;
+
+ for (var c in charts) {
+ if (!charts.hasOwnProperty(c)) {
+ continue;
+ }
+
+ var chart = charts[c];
+ enrichChartData(chart);
+ m = chart.menu;
+
+ // create the menu
+ if (typeof menus[m] === 'undefined') {
+ menus[m] = {
+ menu_pattern: chart.menu_pattern,
+ priority: chart.priority,
+ submenus: {},
+ title: netdataDashboard.menuTitle(chart),
+ icon: netdataDashboard.menuIcon(chart),
+ info: netdataDashboard.menuInfo(chart),
+ height: netdataDashboard.menuHeight(chart) * options.chartsHeight
+ };
+ } else {
+ if (typeof (menus[m].menu_pattern) === 'undefined') {
+ menus[m].menu_pattern = chart.menu_pattern;
+ }
+
+ if (chart.priority < menus[m].priority) {
+ menus[m].priority = chart.priority;
+ }
+ }
+
+ menu_key = (typeof (menus[m].menu_pattern) !== 'undefined') ? menus[m].menu_pattern : m;
+
+ // create the submenu
+ if (typeof menus[m].submenus[chart.submenu] === 'undefined') {
+ menus[m].submenus[chart.submenu] = {
+ priority: chart.priority,
+ charts: [],
+ title: null,
+ info: netdataDashboard.submenuInfo(menu_key, chart.submenu),
+ height: netdataDashboard.submenuHeight(menu_key, chart.submenu, menus[m].height)
+ };
+ } else {
+ if (chart.priority < menus[m].submenus[chart.submenu].priority) {
+ menus[m].submenus[chart.submenu].priority = chart.priority;
+ }
+ }
+
+ // index the chart in the menu/submenu
+ menus[m].submenus[chart.submenu].charts.push(chart);
+ }
+
+ // propagate the descriptive subname given to QoS
+ // to all the other submenus with the same name
+ for (var m in menus) {
+ if (!menus.hasOwnProperty(m)) {
+ continue;
+ }
+
+ for (var s in menus[m].submenus) {
+ if (!menus[m].submenus.hasOwnProperty(s)) {
+ continue;
+ }
+
+ // set the family using a name
+ if (typeof options.submenu_names[s] !== 'undefined') {
+ menus[m].submenus[s].title = s + ' (' + options.submenu_names[s] + ')';
+ } else {
+ menu_key = (typeof (menus[m].menu_pattern) !== 'undefined') ? menus[m].menu_pattern : m;
+ menus[m].submenus[s].title = netdataDashboard.submenuTitle(menu_key, s);
+ }
+ }
+ }
+
+ renderPage(menus, data);
+}
+
+// ----------------------------------------------------------------------------
+
+function loadJs(url, callback) {
+ $.ajax({
+ url: url.startsWith("http") ? url : transformWithOldSuffix(url),
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .fail(function () {
+ alert('Cannot load required JS library: ' + url);
+ })
+ .always(function () {
+ if (typeof callback === 'function') {
+ callback();
+ }
+ })
+}
+
+var clipboardLoaded = false;
+
+function loadClipboard(callback) {
+ if (clipboardLoaded === false) {
+ clipboardLoaded = true;
+ loadJs('lib/clipboard-polyfill-be05dad.js', callback);
+ } else {
+ callback();
+ }
+}
+
+var bootstrapTableLoaded = false;
+
+function loadBootstrapTable(callback) {
+ if (bootstrapTableLoaded === false) {
+ bootstrapTableLoaded = true;
+ loadJs('lib/bootstrap-table-1.11.0.min.js', function () {
+ loadJs('lib/bootstrap-table-export-1.11.0.min.js', function () {
+ loadJs('lib/tableExport-1.6.0.min.js', callback);
+ })
+ });
+ } else {
+ callback();
+ }
+}
+
+var bootstrapSliderLoaded = false;
+
+function loadBootstrapSlider(callback) {
+ if (bootstrapSliderLoaded === false) {
+ bootstrapSliderLoaded = true;
+ loadJs('lib/bootstrap-slider-10.0.0.min.js', function () {
+ NETDATA._loadCSS(transformWithOldSuffix("css/bootstrap-slider-10.0.0.min.css"));
+ callback();
+ });
+ } else {
+ callback();
+ }
+}
+
+var lzStringLoaded = false;
+
+function loadLzString(callback) {
+ if (lzStringLoaded === false) {
+ lzStringLoaded = true;
+ loadJs('lib/lz-string-1.4.4.min.js', callback);
+ } else {
+ callback();
+ }
+}
+
+var pakoLoaded = false;
+
+function loadPako(callback) {
+ if (pakoLoaded === false) {
+ pakoLoaded = true;
+ loadJs('lib/pako-1.0.6.min.js', callback);
+ } else {
+ callback();
+ }
+}
+
+// ----------------------------------------------------------------------------
+
+function clipboardCopy(text) {
+ clipboard.writeText(text);
+}
+
+function clipboardCopyBadgeEmbed(url) {
+ clipboard.writeText('<embed src="' + url + '" type="image/svg+xml" height="20"/>');
+}
+
+// ----------------------------------------------------------------------------
+
+function alarmsUpdateModal() {
+ var active = '<h3>触发警报</h3><table class="table">';
+ var all = '<h3>所有作用中的警报</h3><div class="panel-group" id="alarms_all_accordion" role="tablist" aria-multiselectable="true">';
+ var footer = '<hr/><a href="https://github.com/netdata/netdata/tree/master/web/api/badges#netdata-badges" target="_blank">netdata badges</a> 会自动重新整理。不同颜色分表代表的警报状态：<span style="color: #e05d44"><b> 红色 </b></span> 表示重大，<span style="color:#fe7d37"><b> 橘色 </b></span> 表示警告，<span style="color: #4c1"><b> 绿色 </b></span> 表示良好，<span style="color: #9f9f9f"><b> 灰色 </b></span> 表示未定义 (例如无资料或无状态)，<span style="color: #000"><b> 黑色 </b></span> 表示尚未初始化。您可以复制这里的网址并将它们嵌入到任一个网页。<br/>netdata 能够发送这些警报通知。请参阅 <a href="https://github.com/netdata/netdata/blob/master/health/notifications/health_alarm_notify.conf">这个设定档</a> 了解更多资讯。';
+
+ loadClipboard(function () {
+ });
+
+ NETDATA.alarms.get('all', function (data) {
+ options.alarm_families = [];
+
+ alarmsCallback(data);
+
+ if (data === null) {
+ document.getElementById('alarms_active').innerHTML =
+ document.getElementById('alarms_all').innerHTML =
+ document.getElementById('alarms_log').innerHTML =
+ 'failed to load alarm data!';
+ return;
+ }
+
+ function alarmid4human(id) {
+ if (id === 0) {
+ return '-';
+ }
+
+ return id.toString();
+ }
+
+ function timestamp4human(timestamp, space) {
+ if (timestamp === 0) {
+ return '-';
+ }
+
+ if (typeof space === 'undefined') {
+ space = ' ';
+ }
+
+ var t = new Date(timestamp * 1000);
+ var now = new Date();
+
+ if (t.toDateString() === now.toDateString()) {
+ return t.toLocaleTimeString();
+ }
+
+ return t.toLocaleDateString() + space + t.toLocaleTimeString();
+ }
+
+ function alarm_lookup_explain(alarm, chart) {
+ var dimensions = ' of all values ';
+
+ if (chart.dimensions.length > 1) {
+ dimensions = ' of the sum of all dimensions ';
+ }
+
+ if (typeof alarm.lookup_dimensions !== 'undefined') {
+ var d = alarm.lookup_dimensions.replace(/|/g, ',');
+ var x = d.split(',');
+ if (x.length > 1) {
+ dimensions = 'of the sum of dimensions <code>' + alarm.lookup_dimensions + '</code> ';
+ } else {
+ dimensions = 'of all values of dimension <code>' + alarm.lookup_dimensions + '</code> ';
+ }
+ }
+
+ return '<code>' + alarm.lookup_method + '</code> '
+ + dimensions + ', of chart <code>' + alarm.chart + '</code>'
+ + ', starting <code>' + NETDATA.seconds4human(alarm.lookup_after + alarm.lookup_before, { space: ' ' }) + '</code> and up to <code>' + NETDATA.seconds4human(alarm.lookup_before, { space: ' ' }) + '</code>'
+ + ((alarm.lookup_options) ? (', with options <code>' + alarm.lookup_options.replace(/ /g, ', ') + '</code>') : '')
+ + '.';
+ }
+
+ function alarm_to_html(alarm, full) {
+ var chart = options.data.charts[alarm.chart];
+ if (typeof (chart) === 'undefined') {
+ chart = options.data.charts_by_name[alarm.chart];
+ if (typeof (chart) === 'undefined') {
+ // this means the charts loaded are incomplete
+ // probably netdata was restarted and more alarms
+ // are now available.
+ console.log('Cannot find chart ' + alarm.chart + ', you probably need to refresh the page.');
+ return '';
+ }
+ }
+
+ var has_alarm = (typeof alarm.warn !== 'undefined' || typeof alarm.crit !== 'undefined');
+ var badge_url = NETDATA.alarms.server + '/api/v1/badge.svg?chart=' + alarm.chart + '&alarm=' + alarm.name + '&refresh=auto';
+
+ var action_buttons = '<br/> <br/>role: <b>' + alarm.recipient + '</b><br/> <br/>'
+ + '<div class="action-button ripple" title="click to scroll the dashboard to the chart of this alarm" data-toggle="tooltip" data-placement="bottom" onClick="scrollToChartAfterHidingModal(\'' + alarm.chart + '\', ' + alarm.last_status_change * 1000 + ', \'' + alarm.status + '\'); $(\'#alarmsModal\').modal(\'hide\'); return false;"><i class="fab fa-periscope"></i></div>'
+ + '<div class="action-button ripple" title="click to copy to the clipboard the URL of this badge" data-toggle="tooltip" data-placement="bottom" onClick="clipboardCopy(\'' + badge_url + '\'); return false;"><i class="far fa-copy"></i></div>'
+ + '<div class="action-button ripple" title="click to copy to the clipboard an auto-refreshing <code>embed</code> html element for this badge" data-toggle="tooltip" data-placement="bottom" onClick="clipboardCopyBadgeEmbed(\'' + badge_url + '\'); return false;"><i class="fas fa-copy"></i></div>';
+
+ var html = '<tr><td class="text-center" style="vertical-align:middle" width="40%"><b>' + alarm.chart + '</b><br/> <br/><embed src="' + badge_url + '" type="image/svg+xml" height="20"/><br/> <br/><span style="font-size: 18px">' + alarm.info + '</span>' + action_buttons + '</td>'
+ + '<td><table class="table">'
+ + ((typeof alarm.warn !== 'undefined') ? ('<tr><td width="10%" style="text-align:right">warning when</td><td><span style="font-family: monospace; color:#fe7d37; font-weight: bold;">' + alarm.warn + '</span></td></tr>') : '')
+ + ((typeof alarm.crit !== 'undefined') ? ('<tr><td width="10%" style="text-align:right">critical when</td><td><span style="font-family: monospace; color: #e05d44; font-weight: bold;">' + alarm.crit + '</span></td></tr>') : '');
+
+ if (full === true) {
+ var units = chart.units;
+ if (units === '%') {
+ units = '%';
+ }
+
+ html += ((typeof alarm.lookup_after !== 'undefined') ? ('<tr><td width="10%" style="text-align:right">db lookup</td><td>' + alarm_lookup_explain(alarm, chart) + '</td></tr>') : '')
+ + ((typeof alarm.calc !== 'undefined') ? ('<tr><td width="10%" style="text-align:right">calculation</td><td><span style="font-family: monospace;">' + alarm.calc + '</span></td></tr>') : '')
+ + ((chart.green !== null) ? ('<tr><td width="10%" style="text-align:right">green threshold</td><td><code>' + chart.green + ' ' + units + '</code></td></tr>') : '')
+ + ((chart.red !== null) ? ('<tr><td width="10%" style="text-align:right">red threshold</td><td><code>' + chart.red + ' ' + units + '</code></td></tr>') : '');
+ }
+
+ if (alarm.warn_repeat_every > 0) {
+ html += '<tr><td width="10%" style="text-align:right">repeat warning</td><td>' + NETDATA.seconds4human(alarm.warn_repeat_every) + '</td></tr>';
+ }
+
+ if (alarm.crit_repeat_every > 0) {
+ html += '<tr><td width="10%" style="text-align:right">repeat critical</td><td>' + NETDATA.seconds4human(alarm.crit_repeat_every) + '</td></tr>';
+ }
+
+ var delay = '';
+ if ((alarm.delay_up_duration > 0 || alarm.delay_down_duration > 0) && alarm.delay_multiplier !== 0 && alarm.delay_max_duration > 0) {
+ if (alarm.delay_up_duration === alarm.delay_down_duration) {
+ delay += '<small><br/>hysteresis ' + NETDATA.seconds4human(alarm.delay_up_duration, {
+ space: ' ',
+ negative_suffix: ''
+ });
+ } else {
+ delay = '<small><br/>hysteresis ';
+ if (alarm.delay_up_duration > 0) {
+ delay += 'on escalation <code>' + NETDATA.seconds4human(alarm.delay_up_duration, {
+ space: ' ',
+ negative_suffix: ''
+ }) + '</code>, ';
+ }
+ if (alarm.delay_down_duration > 0) {
+ delay += 'on recovery <code>' + NETDATA.seconds4human(alarm.delay_down_duration, {
+ space: ' ',
+ negative_suffix: ''
+ }) + '</code>, ';
+ }
+ }
+ if (alarm.delay_multiplier !== 1.0) {
+ delay += 'multiplied by <code>' + alarm.delay_multiplier.toString() + '</code>';
+ delay += ', up to <code>' + NETDATA.seconds4human(alarm.delay_max_duration, {
+ space: ' ',
+ negative_suffix: ''
+ }) + '</code>';
+ }
+ delay += '</small>';
+ }
+
+ html += '<tr><td width="10%" style="text-align:right">check every</td><td>' + NETDATA.seconds4human(alarm.update_every, {
+ space: ' ',
+ negative_suffix: ''
+ }) + '</td></tr>'
+ + ((has_alarm === true) ? ('<tr><td width="10%" style="text-align:right">execute</td><td><span style="font-family: monospace;">' + alarm.exec + '</span>' + delay + '</td></tr>') : '')
+ + '<tr><td width="10%" style="text-align:right">source</td><td><span style="font-family: monospace;">' + alarm.source + '</span></td></tr>'
+ + '</table></td></tr>';
+
+ return html;
+ }
+
+ function alarm_family_show(id) {
+ var html = '<table class="table">';
+ var family = options.alarm_families[id];
+ var len = family.arr.length;
+ while (len--) {
+ var alarm = family.arr[len];
+ html += alarm_to_html(alarm, true);
+ }
+ html += '</table>';
+
+ $('#alarm_all_' + id.toString()).html(html);
+ enableTooltipsAndPopovers();
+ }
+
+ // find the proper family of each alarm
+ var x, family, alarm;
+ var count_active = 0;
+ var count_all = 0;
+ var families = {};
+ var families_sort = [];
+ for (x in data.alarms) {
+ if (!data.alarms.hasOwnProperty(x)) {
+ continue;
+ }
+
+ alarm = data.alarms[x];
+ family = alarm.family;
+
+ // find the chart
+ var chart = options.data.charts[alarm.chart];
+ if (typeof chart === 'undefined') {
+ chart = options.data.charts_by_name[alarm.chart];
+ }
+
+ // not found - this should never happen!
+ if (typeof chart === 'undefined') {
+ console.log('WARNING: alarm ' + x + ' is linked to chart ' + alarm.chart + ', which is not found in the list of chart got from the server.');
+ chart = { priority: 9999999 };
+ }
+ else if (typeof chart.menu !== 'undefined' && typeof chart.submenu !== 'undefined')
+ // the family based on the chart
+ {
+ family = chart.menu + ' - ' + chart.submenu;
+ }
+
+ if (typeof families[family] === 'undefined') {
+ families[family] = {
+ name: family,
+ arr: [],
+ priority: chart.priority
+ };
+
+ families_sort.push(families[family]);
+ }
+
+ if (chart.priority < families[family].priority) {
+ families[family].priority = chart.priority;
+ }
+
+ families[family].arr.unshift(alarm);
+ }
+
+ // sort the families, like the dashboard menu does
+ var families_sorted = families_sort.sort(function (a, b) {
+ if (a.priority < b.priority) {
+ return -1;
+ }
+ if (a.priority > b.priority) {
+ return 1;
+ }
+ return naturalSortCompare(a.name, b.name);
+ });
+
+ var i = 0;
+ var fc = 0;
+ var len = families_sorted.length;
+ while (len--) {
+ family = families_sorted[i++].name;
+ var active_family_added = false;
+ var expanded = 'true';
+ var collapsed = '';
+ var cin = 'in';
+
+ if (fc !== 0) {
+ all += "</table></div></div></div>";
+ expanded = 'false';
+ collapsed = 'class="collapsed"';
+ cin = '';
+ }
+
+ all += '<div class="panel panel-default"><div class="panel-heading" role="tab" id="alarm_all_heading_' + fc.toString() + '"><h4 class="panel-title"><a ' + collapsed + ' role="button" data-toggle="collapse" data-parent="#alarms_all_accordion" href="#alarm_all_' + fc.toString() + '" aria-expanded="' + expanded + '" aria-controls="alarm_all_' + fc.toString() + '">' + family.toString() + '</a></h4></div><div id="alarm_all_' + fc.toString() + '" class="panel-collapse collapse ' + cin + '" role="tabpanel" aria-labelledby="alarm_all_heading_' + fc.toString() + '" data-alarm-id="' + fc.toString() + '"><div class="panel-body" id="alarm_all_body_' + fc.toString() + '">';
+
+ options.alarm_families[fc] = families[family];
+
+ fc++;
+
+ var arr = families[family].arr;
+ var c = arr.length;
+ while (c--) {
+ alarm = arr[c];
+ if (alarm.status === 'WARNING' || alarm.status === 'CRITICAL') {
+ if (!active_family_added) {
+ active_family_added = true;
+ active += '<tr><th class="text-center" colspan="2"><h4>' + family + '</h4></th></tr>';
+ }
+ count_active++;
+ active += alarm_to_html(alarm, true);
+ }
+
+ count_all++;
+ }
+ }
+ active += "</table>";
+ if (families_sorted.length > 0) {
+ all += "</div></div></div>";
+ }
+ all += "</div>";
+
+ if (!count_active) {
+ active += '<div style="width:100%; height: 100px; text-align: center;"><span style="font-size: 50px;"><i class="fas fa-thumbs-up"></i></span><br/>一切正常。没有警报。</div>';
+ } else {
+ active += footer;
+ }
+
+ if (!count_all) {
+ all += "<h4>此系统中没有运行警报。</h4>";
+ } else {
+ all += footer;
+ }
+
+ document.getElementById('alarms_active').innerHTML = active;
+ document.getElementById('alarms_all').innerHTML = all;
+ enableTooltipsAndPopovers();
+
+ if (families_sorted.length > 0) {
+ alarm_family_show(0);
+ }
+
+ // register bootstrap events
+ var $accordion = $('#alarms_all_accordion');
+ $accordion.on('show.bs.collapse', function (d) {
+ var target = $(d.target);
+ var id = $(target).data('alarm-id');
+ alarm_family_show(id);
+ });
+ $accordion.on('hidden.bs.collapse', function (d) {
+ var target = $(d.target);
+ var id = $(target).data('alarm-id');
+ $('#alarm_all_' + id.toString()).html('');
+ });
+
+ document.getElementById('alarms_log').innerHTML = '<h3>警报记录</h3><table id="alarms_log_table"></table>';
+
+ loadBootstrapTable(function () {
+ $('#alarms_log_table').bootstrapTable({
+ url: NETDATA.alarms.server + '/api/v1/alarm_log?all',
+ cache: false,
+ pagination: true,
+ pageSize: 10,
+ showPaginationSwitch: false,
+ search: true,
+ searchTimeOut: 300,
+ searchAlign: 'left',
+ showColumns: true,
+ showExport: true,
+ exportDataType: 'basic',
+ exportOptions: {
+ fileName: 'netdata_alarm_log'
+ },
+ onClickRow: function (row, $element,field) {
+ void (field);
+ void ($element);
+ let main_url;
+ let common_url = "&host=" + encodeURIComponent(row['hostname']) + "&chart=" + encodeURIComponent(row['chart']) + "&family=" + encodeURIComponent(row['family']) + "&alarm=" + encodeURIComponent(row['name']) + "&alarm_unique_id=" + row['unique_id'] + "&alarm_id=" + row['alarm_id'] + "&alarm_event_id=" + row['alarm_event_id'] + "&alarm_when=" + row['when'];
+ if (NETDATA.registry.isUsingGlobalRegistry() && NETDATA.registry.machine_guid != null) {
+ main_url = "https://netdata.cloud/alarms/redirect?agentID=" + NETDATA.registry.machine_guid + common_url;
+ } else {
+ main_url = NETDATA.registry.server + "/goto-host-from-alarm.html?" + common_url ;
+ }
+ window.open(main_url,"_blank");
+ },
+ rowStyle: function (row, index) {
+ void (index);
+
+ switch (row.status) {
+ case 'CRITICAL':
+ return { classes: 'danger' };
+ break;
+ case 'WARNING':
+ return { classes: 'warning' };
+ break;
+ case 'UNDEFINED':
+ return { classes: 'info' };
+ break;
+ case 'CLEAR':
+ return { classes: 'success' };
+ break;
+ }
+ return {};
+ },
+ showFooter: false,
+ showHeader: true,
+ showRefresh: true,
+ showToggle: false,
+ sortable: true,
+ silentSort: false,
+ columns: [
+ {
+ field: 'when',
+ title: '事件日期',
+ valign: 'middle',
+ titleTooltip: 'The date and time the even took place',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return timestamp4human(value, ' ');
+ },
+ align: 'center',
+ switchable: false,
+ sortable: true
+ },
+ {
+ field: 'hostname',
+ title: '主机',
+ valign: 'middle',
+ titleTooltip: 'The host that generated this event',
+ align: 'center',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'unique_id',
+ title: '唯一 ID',
+ titleTooltip: 'The host unique ID for this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'alarm_id',
+ title: '警报 ID',
+ titleTooltip: 'The ID of the alarm that generated this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'alarm_event_id',
+ title: '警报事件 ID',
+ titleTooltip: 'The incremental ID of this event for the given alarm',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'chart',
+ title: '图表',
+ titleTooltip: 'The chart the alarm is attached to',
+ align: 'center',
+ valign: 'middle',
+ switchable: false,
+ sortable: true
+ },
+ {
+ field: 'family',
+ title: 'Family',
+ titleTooltip: 'The family of the chart the alarm is attached to',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'name',
+ title: '警报',
+ titleTooltip: 'The alarm name that generated this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return value.toString().replace(/_/g, ' ');
+ },
+ align: 'center',
+ valign: 'middle',
+ switchable: false,
+ sortable: true
+ },
+ {
+ field: 'value_string',
+ title: 'Friendly Value',
+ titleTooltip: 'The value of the alarm, that triggered this event',
+ align: 'right',
+ valign: 'middle',
+ sortable: true
+ },
+ {
+ field: 'old_value_string',
+ title: 'Friendly Old Value',
+ titleTooltip: 'The value of the alarm, just before this event',
+ align: 'right',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'old_value',
+ title: 'Old Value',
+ titleTooltip: 'The value of the alarm, just before this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return ((value !== null) ? Math.round(value * 100) / 100 : 'NaN').toString();
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'value',
+ title: 'Value',
+ titleTooltip: 'The value of the alarm, that triggered this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return ((value !== null) ? Math.round(value * 100) / 100 : 'NaN').toString();
+ },
+ align: 'right',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'units',
+ title: '单位',
+ titleTooltip: 'The units of the value of the alarm',
+ align: 'left',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'old_status',
+ title: '先前状态',
+ titleTooltip: 'The status of the alarm, just before this event',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'status',
+ title: '状态',
+ titleTooltip: 'The status of the alarm, that was set due to this event',
+ align: 'center',
+ valign: 'middle',
+ switchable: false,
+ sortable: true
+ },
+ {
+ field: 'duration',
+ title: 'Last Duration',
+ titleTooltip: 'The duration the alarm was at its previous state, just before this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return NETDATA.seconds4human(value, {negative_suffix: '', space: ' ', now: 'no time'});
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'non_clear_duration',
+ title: 'Raised Duration',
+ titleTooltip: 'The duration the alarm was raised, just before this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return NETDATA.seconds4human(value, {negative_suffix: '', space: ' ', now: 'no time'});
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'recipient',
+ title: 'Recipient',
+ titleTooltip: 'The recipient of this event',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'processed',
+ title: 'Processed Status',
+ titleTooltip: 'True when this event is processed',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+
+ if (value === true) {
+ return 'DONE';
+ } else {
+ return 'PENDING';
+ }
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'updated',
+ title: 'Updated Status',
+ titleTooltip: 'True when this event has been updated by another event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+
+ if (value === true) {
+ return 'UPDATED';
+ } else {
+ return 'CURRENT';
+ }
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'updated_by_id',
+ title: 'Updated By ID',
+ titleTooltip: 'The unique ID of the event that obsoleted this one',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'updates_id',
+ title: 'Updates ID',
+ titleTooltip: 'The unique ID of the event obsoleted because of this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'exec',
+ title: 'Script',
+ titleTooltip: 'The script to handle the event notification',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'exec_run',
+ title: 'Script Run At',
+ titleTooltip: 'The date and time the script has been ran',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return timestamp4human(value, ' ');
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'exec_code',
+ title: 'Script Return Value',
+ titleTooltip: 'The return code of the script',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+
+ if (value === 0) {
+ return 'OK (returned 0)';
+ } else {
+ return 'FAILED (with code ' + value.toString() + ')';
+ }
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'delay',
+ title: 'Script Delay',
+ titleTooltip: 'The hysteresis of the notification',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+
+ return NETDATA.seconds4human(value, {negative_suffix: '', space: ' ', now: 'no time'});
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'delay_up_to_timestamp',
+ title: 'Script Delay Run At',
+ titleTooltip: 'The date and time the script should be run, after hysteresis',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return timestamp4human(value, ' ');
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'info',
+ title: '说明',
+ titleTooltip: 'A short description of the alarm',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'source',
+ title: '警报来源',
+ titleTooltip: 'The source of configuration of the alarm',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ }
+ ]
+ });
+ // console.log($('#alarms_log_table').bootstrapTable('getOptions'));
+ });
+ });
+}
+
+function alarmsCallback(data) {
+ var count = 0, x;
+ for (x in data.alarms) {
+ if (!data.alarms.hasOwnProperty(x)) {
+ continue;
+ }
+
+ var alarm = data.alarms[x];
+ if (alarm.status === 'WARNING' || alarm.status === 'CRITICAL') {
+ count++;
+ }
+ }
+
+ if (count > 0) {
+ document.getElementById('alarms_count_badge').innerHTML = count.toString();
+ } else {
+ document.getElementById('alarms_count_badge').innerHTML = '';
+ }
+}
+
+function initializeDynamicDashboardWithData(data) {
+ if (data !== null) {
+ options.hostname = data.hostname;
+ options.data = data;
+ options.version = data.version;
+ options.release_channel = data.release_channel;
+ netdataDashboard.os = data.os;
+
+ if (typeof data.hosts !== 'undefined') {
+ options.hosts = data.hosts;
+ }
+
+ // update the dashboard hostname
+ document.getElementById('hostname').innerHTML = '<span id="hostnametext">' + options.hostname + ((netdataSnapshotData !== null) ? ' (snap)' : '').toString() + '</span> <strong class="caret">';
+ document.getElementById('hostname').href = NETDATA.serverDefault;
+ document.getElementById('netdataVersion').innerHTML = options.version;
+
+ if (netdataSnapshotData !== null) {
+ $('#alarmsButton').hide();
+ $('#updateButton').hide();
+ // $('#loadButton').hide();
+ $('#saveButton').hide();
+ $('#printButton').hide();
+ }
+
+ // update the dashboard title
+ document.title = options.hostname + ' netdata 仪表板';
+
+ // 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);
+
+ // Ensure MyNetdata menu is rendered with latest host info #5370
+ renderMyNetdataMenu(isSignedIn() ? cloudAgents : registryAgents);
+ }
+}
+
+// an object to keep initilization configuration
+// needed due to the async nature of the XSS modal
+var initializeConfig = {
+ url: null,
+ custom_info: true,
+};
+
+function loadCustomDashboardInfo(url, callback) {
+ loadJs(url, function () {
+ $.extend(true, netdataDashboard, customDashboard);
+ callback();
+ });
+}
+
+function initializeChartsAndCustomInfo() {
+ NETDATA.alarms.callback = alarmsCallback;
+
+ // download all the charts the server knows
+ NETDATA.chartRegistry.downloadAll(initializeConfig.url, function (data) {
+ if (data !== null) {
+ if (initializeConfig.custom_info === true && typeof data.custom_info !== 'undefined' && data.custom_info !== "" && netdataSnapshotData === null) {
+ //console.log('loading custom dashboard decorations from server ' + initializeConfig.url);
+ loadCustomDashboardInfo(NETDATA.serverDefault + data.custom_info, function () {
+ initializeDynamicDashboardWithData(data);
+ });
+ } else {
+ //console.log('not loading custom dashboard decorations from server ' + initializeConfig.url);
+ initializeDynamicDashboardWithData(data);
+ }
+ }
+ });
+}
+
+function xssModalDisableXss() {
+ //console.log('disabling xss checks');
+ NETDATA.xss.enabled = false;
+ NETDATA.xss.enabled_for_data = false;
+ initializeConfig.custom_info = true;
+ initializeChartsAndCustomInfo();
+ return false;
+}
+
+function xssModalKeepXss() {
+ //console.log('keeping xss checks');
+ NETDATA.xss.enabled = true;
+ NETDATA.xss.enabled_for_data = true;
+ initializeConfig.custom_info = false;
+ initializeChartsAndCustomInfo();
+ return false;
+}
+
+function initializeDynamicDashboard(netdata_url) {
+ if (typeof netdata_url === 'undefined' || netdata_url === null) {
+ netdata_url = NETDATA.serverDefault;
+ }
+
+ initializeConfig.url = netdata_url;
+
+ // initialize clickable alarms
+ NETDATA.alarms.chart_div_offset = -50;
+ NETDATA.alarms.chart_div_id_prefix = 'chart_';
+ NETDATA.alarms.chart_div_animation_duration = 0;
+
+ NETDATA.pause(function () {
+ if (typeof netdataCheckXSS !== 'undefined' && netdataCheckXSS === true) {
+ //$("#loadOverlay").css("display","none");
+ document.getElementById('netdataXssModalServer').innerText = initializeConfig.url;
+ $('#xssModal').modal('show');
+ } else {
+ initializeChartsAndCustomInfo();
+ }
+ });
+}
+
+// ----------------------------------------------------------------------------
+
+function versionLog(msg) {
+ document.getElementById('versionCheckLog').innerHTML = msg;
+}
+
+// New way of checking for updates, based only on versions
+
+function versionsMatch(v1, v2) {
+ if (v1 == v2) {
+ return true;
+ } else {
+ let s1 = v1.split('.');
+ let s2 = v2.split('.');
+ // Check major version
+ let n1 = parseInt(s1[0].substring(1, 2), 10);
+ let n2 = parseInt(s2[0].substring(1, 2), 10);
+ if (n1 < n2) return false;
+ else if (n1 > n2) return true;
+
+ // Check minor version
+ n1 = parseInt(s1[1], 10);
+ n2 = parseInt(s2[1], 10);
+ if (n1 < n2) return false;
+ else if (n1 > n2) return true;
+
+ // Split patch: format could be e.g. 0-22-nightly
+ s1 = s1[2].split('-');
+ s2 = s2[2].split('-');
+
+ n1 = parseInt(s1[0], 10);
+ n2 = parseInt(s2[0], 10);
+ if (n1 < n2) return false;
+ else if (n1 > n2) return true;
+
+ n1 = (s1.length > 1) ? parseInt(s1[1], 10) : 0;
+ n2 = (s2.length > 1) ? parseInt(s2[1], 10) : 0;
+ if (n1 < n2) return false;
+ else return true;
+ }
+}
+
+function getGithubLatestVersion(callback) {
+ versionLog('正在从 github 下载最新版本 ID...');
+
+ $.ajax({
+ url: 'https://api.github.com/repos/netdata/netdata/releases/latest',
+ async: true,
+ cache: false
+ })
+ .done(function (data) {
+ data = data.tag_name.replace(/(\r\n|\n|\r| |\t)/gm, "");
+ versionLog('从 github 取得最新版本是 ' + data);
+ callback(data);
+ })
+ .fail(function () {
+ versionLog('从 github 下载最新版本 ID 失败。');
+ callback(null);
+ });
+}
+
+function getGCSLatestVersion(callback) {
+ versionLog('Downloading latest version id from GCS...');
+ $.ajax({
+ url: "https://www.googleapis.com/storage/v1/b/netdata-nightlies/o/latest-version.txt",
+ async: true,
+ cache: false
+ })
+ .done(function (response) {
+ $.ajax({
+ url: response.mediaLink,
+ async: true,
+ cache: false
+ })
+ .done(function (data) {
+ data = data.replace(/(\r\n|\n|\r| |\t)/gm, "");
+ versionLog('Latest nightly version from GCS is ' + data);
+ callback(data);
+ })
+ .fail(function (xhr, textStatus, errorThrown) {
+ versionLog('Failed to download the latest nightly version id from GCS!');
+ callback(null);
+ });
+ })
+ .fail(function (xhr, textStatus, errorThrown) {
+ versionLog('Failed to download the latest nightly version from GCS!');
+ callback(null);
+ });
+}
+
+
+function checkForUpdateByVersion(force, callback) {
+ if (options.release_channel === 'stable') {
+ getGithubLatestVersion(function (sha2) {
+ callback(options.version, sha2);
+ });
+ } else {
+ getGCSLatestVersion(function (sha2) {
+ callback(options.version, sha2);
+ });
+ }
+ return null;
+}
+
+function notifyForUpdate(force) {
+ versionLog('<p>正在检查更新...</p>');
+
+ var now = Date.now();
+
+ if (typeof force === 'undefined' || force !== true) {
+ var last = loadLocalStorage('last_update_check');
+
+ if (typeof last === 'string') {
+ last = parseInt(last);
+ } else {
+ last = 0;
+ }
+
+ if (now - last < 3600000 * 8) {
+ // no need to check it - too soon
+ return;
+ }
+ }
+
+ checkForUpdateByVersion(force, function (sha1, sha2) {
+ var save = false;
+
+ if (sha1 === null) {
+ save = false;
+ versionLog('<p><big>取得您的 netdata 版本失败！</big></p><p>You can always get the latest netdata from <a href="https://github.com/netdata/netdata" target="_blank">its github page</a>.</p>');
+ } else if (sha2 === null) {
+ save = false;
+ versionLog('<p><big>从 github 取得 netdata 最新版本失败。</big></p><p>您也可以从 <a href="https://github.com/netdata/netdata" target="_blank"> github</a> 取得最新 netdata 版本。</p>');
+ } else if (versionsMatch(sha1, sha2)) {
+ save = true;
+ versionLog('<p><big>您已经是最新版本的 netdata！</big></p><p>还没有更新？<br/>或许，我们还需要一些动力继续前进！</p><p>如果您还没有做好更新的准备，请您 <a href="https://github.com/netdata/netdata" target="_blank">到 github 给 netdata <b><i class="fas fa-star"></i></b></a>。</p>');
+ } else {
+ save = true;
+ var compare = 'https://learn.netdata.cloud/docs/agent/changelog/';
+ versionLog('<p><big><strong>New version of netdata available!</strong></big></p><p>Latest version: <b><code>' + sha2 + '</code></b></p><p><a href="' + compare + '" target="_blank">Click here for the changes log</a> and<br/><a href="https://github.com/netdata/netdata/tree/master/packaging/installer/UPDATE.md" target="_blank">click here for directions on updating</a> your netdata installation.</p><p>We suggest to review the changes log for new features you may be interested, or important bug fixes you may need.<br/>Keeping your netdata updated is generally a good idea.</p>');
+
+ document.getElementById('update_badge').innerHTML = '!';
+ }
+
+ if (save) {
+ saveLocalStorage('last_update_check', now.toString());
+ }
+ });
+}
+
+// ----------------------------------------------------------------------------
+// printing dashboards
+
+function showPageFooter() {
+ document.getElementById('footer').style.display = 'block';
+}
+
+function printPreflight() {
+ var url = document.location.origin.toString() + document.location.pathname.toString() + document.location.search.toString() + urlOptions.genHash() + ';mode=print';
+ var width = 990;
+ var height = screen.height * 90 / 100;
+ //console.log(url);
+ //console.log(document.location);
+ window.open(url, '', 'width=' + width.toString() + ',height=' + height.toString() + ',menubar=no,toolbar=no,personalbar=no,location=no,resizable=no,scrollbars=yes,status=no,chrome=yes,centerscreen=yes,attention=yes,dialog=yes');
+ $('#printPreflightModal').modal('hide');
+}
+
+function printPage() {
+ var print_is_rendering = true;
+
+ $('#printModal').on('hide.bs.modal', function (e) {
+ if (print_is_rendering === true) {
+ e.preventDefault();
+ return false;
+ }
+
+ return true;
+ });
+
+ $('#printModal').on('show.bs.modal', function () {
+ var print_options = {
+ stop_updates_when_focus_is_lost: false,
+ update_only_visible: false,
+ sync_selection: false,
+ eliminate_zero_dimensions: false,
+ pan_and_zoom_data_padding: false,
+ show_help: false,
+ legend_toolbox: false,
+ resize_charts: false,
+ pixels_per_point: 1
+ };
+
+ var x;
+ for (x in print_options) {
+ if (print_options.hasOwnProperty(x)) {
+ NETDATA.options.current[x] = print_options[x];
+ }
+ }
+
+ NETDATA.parseDom();
+ showPageFooter();
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalPanAndZoom.setMaster(NETDATA.options.targets[0], urlOptions.after, urlOptions.before);
+ // NETDATA.onresize();
+
+ var el = document.getElementById('printModalProgressBar');
+ var eltxt = document.getElementById('printModalProgressBarText');
+
+ function update_chart(idx) {
+ var state = NETDATA.options.targets[--idx];
+
+ var pcent = (NETDATA.options.targets.length - idx) * 100 / NETDATA.options.targets.length;
+ $(el).css('width', pcent + '%').attr('aria-valuenow', pcent);
+ eltxt.innerText = Math.round(pcent).toString() + '%, ' + state.id;
+
+ setTimeout(function () {
+ state.updateChart(function () {
+ NETDATA.options.targets[idx].resizeForPrint();
+
+ if (idx > 0) {
+ update_chart(idx);
+ } else {
+ print_is_rendering = false;
+ $('#printModal').modal('hide');
+ window.print();
+ window.close();
+ }
+ })
+ }, 0);
+ }
+
+ print_is_rendering = true;
+ update_chart(NETDATA.options.targets.length);
+ });
+
+ $('#printModal').modal('show');
+}
+
+// --------------------------------------------------------------------
+
+function jsonStringifyFn(obj) {
+ return JSON.stringify(obj, function (key, value) {
+ return (typeof value === 'function') ? value.toString() : value;
+ });
+}
+
+function jsonParseFn(str) {
+ return JSON.parse(str, function (key, value) {
+ if (typeof value != 'string') {
+ return value;
+ }
+ return (value.substring(0, 8) == 'function') ? eval('(' + value + ')') : value;
+ });
+}
+
+// --------------------------------------------------------------------
+
+var snapshotOptions = {
+ bytes_per_chart: 2048,
+ compressionDefault: 'pako.deflate.base64',
+
+ compressions: {
+ 'none': {
+ bytes_per_point_memory: 5.2,
+ bytes_per_point_disk: 5.6,
+
+ compress: function (s) {
+ return s;
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return s;
+ }
+ },
+
+ 'pako.deflate.base64': {
+ bytes_per_point_memory: 1.8,
+ bytes_per_point_disk: 1.9,
+
+ compress: function (s) {
+ return btoa(pako.deflate(s, {to: 'string'}));
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return pako.inflate(atob(s), {to: 'string'});
+ }
+ },
+
+ 'pako.deflate': {
+ bytes_per_point_memory: 1.4,
+ bytes_per_point_disk: 3.2,
+
+ compress: function (s) {
+ return pako.deflate(s, {to: 'string'});
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return pako.inflate(s, {to: 'string'});
+ }
+ },
+
+ 'lzstring.utf16': {
+ bytes_per_point_memory: 1.7,
+ bytes_per_point_disk: 2.6,
+
+ compress: function (s) {
+ return LZString.compressToUTF16(s);
+ },
+
+ compressed_length: function (s) {
+ return s.length * 2;
+ },
+
+ uncompress: function (s) {
+ return LZString.decompressFromUTF16(s);
+ }
+ },
+
+ 'lzstring.base64': {
+ bytes_per_point_memory: 2.1,
+ bytes_per_point_disk: 2.3,
+
+ compress: function (s) {
+ return LZString.compressToBase64(s);
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return LZString.decompressFromBase64(s);
+ }
+ },
+
+ 'lzstring.uri': {
+ bytes_per_point_memory: 2.1,
+ bytes_per_point_disk: 2.3,
+
+ compress: function (s) {
+ return LZString.compressToEncodedURIComponent(s);
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return LZString.decompressFromEncodedURIComponent(s);
+ }
+ }
+ }
+};
+
+// --------------------------------------------------------------------
+// loading snapshots
+
+function loadSnapshotModalLog(priority, msg) {
+ document.getElementById('loadSnapshotStatus').className = "alert alert-" + priority;
+ document.getElementById('loadSnapshotStatus').innerHTML = msg;
+}
+
+var tmpSnapshotData = null;
+
+function loadSnapshot() {
+ $('#loadSnapshotImport').addClass('disabled');
+
+ if (tmpSnapshotData === null) {
+ loadSnapshotPreflightEmpty();
+ loadSnapshotModalLog('danger', 'no data have been loaded');
+ return;
+ }
+
+ loadPako(function () {
+ loadLzString(function () {
+ loadSnapshotModalLog('info', 'Please wait, activating snapshot...');
+ $('#loadSnapshotModal').modal('hide');
+
+ netdataShowAlarms = false;
+ netdataRegistry = false;
+ netdataServer = tmpSnapshotData.server;
+ NETDATA.serverDefault = netdataServer;
+
+ document.getElementById('charts_div').innerHTML = '';
+ document.getElementById('sidebar').innerHTML = '';
+ NETDATA.globalReset();
+
+ if (typeof tmpSnapshotData.hash !== 'undefined') {
+ urlOptions.hash = tmpSnapshotData.hash;
+ } else {
+ urlOptions.hash = '#';
+ }
+
+ if (typeof tmpSnapshotData.info !== 'undefined') {
+ var info = jsonParseFn(tmpSnapshotData.info);
+ if (typeof info.menu !== 'undefined') {
+ netdataDashboard.menu = info.menu;
+ }
+
+ if (typeof info.submenu !== 'undefined') {
+ netdataDashboard.submenu = info.submenu;
+ }
+
+ if (typeof info.context !== 'undefined') {
+ netdataDashboard.context = info.context;
+ }
+ }
+
+ if (typeof tmpSnapshotData.compression !== 'string') {
+ tmpSnapshotData.compression = 'none';
+ }
+
+ if (typeof snapshotOptions.compressions[tmpSnapshotData.compression] === 'undefined') {
+ alert('unknown compression method: ' + tmpSnapshotData.compression);
+ tmpSnapshotData.compression = 'none';
+ }
+
+ tmpSnapshotData.uncompress = snapshotOptions.compressions[tmpSnapshotData.compression].uncompress;
+ netdataSnapshotData = tmpSnapshotData;
+
+ urlOptions.after = tmpSnapshotData.after_ms;
+ urlOptions.before = tmpSnapshotData.before_ms;
+
+ if (typeof tmpSnapshotData.highlight_after_ms !== 'undefined'
+ && tmpSnapshotData.highlight_after_ms !== null
+ && tmpSnapshotData.highlight_after_ms > 0
+ && typeof tmpSnapshotData.highlight_before_ms !== 'undefined'
+ && tmpSnapshotData.highlight_before_ms !== null
+ && tmpSnapshotData.highlight_before_ms > 0
+ ) {
+ urlOptions.highlight_after = tmpSnapshotData.highlight_after_ms;
+ urlOptions.highlight_before = tmpSnapshotData.highlight_before_ms;
+ urlOptions.highlight = true;
+ } else {
+ urlOptions.highlight_after = 0;
+ urlOptions.highlight_before = 0;
+ urlOptions.highlight = false;
+ }
+
+ netdataCheckXSS = false; // disable the modal - this does not affect XSS checks, since dashboard.js is already loaded
+ NETDATA.xss.enabled = true; // we should not do any remote requests, but if we do, check them
+ NETDATA.xss.enabled_for_data = true; // check also snapshot data - that have been excluded from the initial check, due to compression
+ loadSnapshotPreflightEmpty();
+ initializeDynamicDashboard();
+ });
+ });
+};
+
+function loadSnapshotPreflightFile(file) {
+ var filename = NETDATA.xss.string(file.name);
+ var fr = new FileReader();
+ fr.onload = function (e) {
+ document.getElementById('loadSnapshotFilename').innerHTML = filename;
+ var result = null;
+ try {
+ result = NETDATA.xss.checkAlways('snapshot', JSON.parse(e.target.result), /^(snapshot\.info|snapshot\.data)$/);
+
+ //console.log(result);
+ var date_after = new Date(result.after_ms);
+ var date_before = new Date(result.before_ms);
+
+ if (typeof result.charts_ok === 'undefined') {
+ result.charts_ok = 'unknown';
+ }
+
+ if (typeof result.charts_failed === 'undefined') {
+ result.charts_failed = 0;
+ }
+
+ if (typeof result.compression === 'undefined') {
+ result.compression = 'none';
+ }
+
+ if (typeof result.data_size === 'undefined') {
+ result.data_size = 0;
+ }
+
+ document.getElementById('loadSnapshotFilename').innerHTML = '<code>' + filename + '</code>';
+ document.getElementById('loadSnapshotHostname').innerHTML = '<b>' + result.hostname + '</b>, netdata version: <b>' + result.netdata_version.toString() + '</b>';
+ document.getElementById('loadSnapshotURL').innerHTML = result.url;
+ document.getElementById('loadSnapshotCharts').innerHTML = result.charts.charts_count.toString() + ' charts, ' + result.charts.dimensions_count.toString() + ' dimensions, ' + result.data_points.toString() + ' points per dimension, ' + Math.round(result.duration_ms / result.data_points).toString() + ' ms per point';
+ document.getElementById('loadSnapshotInfo').innerHTML = 'version: <b>' + result.snapshot_version.toString() + '</b>, includes <b>' + result.charts_ok.toString() + '</b> unique chart data queries ' + ((result.charts_failed > 0) ? ('<b>' + result.charts_failed.toString() + '</b> failed') : '').toString() + ', compressed with <code>' + result.compression.toString() + '</code>, data size ' + (Math.round(result.data_size * 100 / 1024 / 1024) / 100).toString() + ' MB';
+ document.getElementById('loadSnapshotTimeRange').innerHTML = '<b>' + NETDATA.dateTime.localeDateString(date_after) + ' ' + NETDATA.dateTime.localeTimeString(date_after) + '</b> to <b>' + NETDATA.dateTime.localeDateString(date_before) + ' ' + NETDATA.dateTime.localeTimeString(date_before) + '</b>';
+ document.getElementById('loadSnapshotComments').innerHTML = ((result.comments) ? result.comments : '').toString();
+ loadSnapshotModalLog('success', 'File loaded, click <b>Import</b> to render it!');
+ $('#loadSnapshotImport').removeClass('disabled');
+
+ tmpSnapshotData = result;
+ }
+ catch (e) {
+ console.log(e);
+ document.getElementById('loadSnapshotStatus').className = "alert alert-danger";
+ document.getElementById('loadSnapshotStatus').innerHTML = "Failed to parse this file!";
+ $('#loadSnapshotImport').addClass('disabled');
+ }
+ }
+
+ //console.log(file);
+ fr.readAsText(file);
+};
+
+function loadSnapshotPreflightEmpty() {
+ document.getElementById('loadSnapshotFilename').innerHTML = '';
+ document.getElementById('loadSnapshotHostname').innerHTML = '';
+ document.getElementById('loadSnapshotURL').innerHTML = '';
+ document.getElementById('loadSnapshotCharts').innerHTML = '';
+ document.getElementById('loadSnapshotInfo').innerHTML = '';
+ document.getElementById('loadSnapshotTimeRange').innerHTML = '';
+ document.getElementById('loadSnapshotComments').innerHTML = '';
+ loadSnapshotModalLog('success', 'Browse for a snapshot file (or drag it and drop it here), then click <b>Import</b> to render it.');
+ $('#loadSnapshotImport').addClass('disabled');
+};
+
+var loadSnapshotDragAndDropInitialized = false;
+
+function loadSnapshotDragAndDropSetup() {
+ if (loadSnapshotDragAndDropInitialized === false) {
+ loadSnapshotDragAndDropInitialized = true;
+ $('#loadSnapshotDragAndDrop')
+ .on('drag dragstart dragend dragover dragenter dragleave drop', function (e) {
+ e.preventDefault();
+ e.stopPropagation();
+ })
+ .on('drop', function (e) {
+ if (e.originalEvent.dataTransfer.files.length) {
+ loadSnapshotPreflightFile(e.originalEvent.dataTransfer.files.item(0));
+ } else {
+ loadSnapshotPreflightEmpty();
+ loadSnapshotModalLog('danger', 'No file selected');
+ }
+ });
+ }
+};
+
+function loadSnapshotPreflight() {
+ var files = document.getElementById('loadSnapshotSelectFiles').files;
+ if (files.length <= 0) {
+ loadSnapshotPreflightEmpty();
+ loadSnapshotModalLog('danger', 'No file selected');
+ return;
+ }
+
+ loadSnapshotModalLog('info', 'Loading file...');
+
+ loadSnapshotPreflightFile(files.item(0));
+}
+
+// --------------------------------------------------------------------
+// saving snapshots
+
+var saveSnapshotStop = false;
+
+function saveSnapshotCancel() {
+ saveSnapshotStop = true;
+}
+
+var saveSnapshotModalInitialized = false;
+
+function saveSnapshotModalSetup() {
+ if (saveSnapshotModalInitialized === false) {
+ saveSnapshotModalInitialized = true;
+ $('#saveSnapshotModal')
+ .on('hide.bs.modal', saveSnapshotCancel)
+ .on('show.bs.modal', saveSnapshotModalInit)
+ .on('shown.bs.modal', function () {
+ $('#saveSnapshotResolutionSlider').find(".slider-handle:first").attr("tabindex", 1);
+ document.getElementById('saveSnapshotComments').focus();
+ });
+ }
+};
+
+function saveSnapshotModalLog(priority, msg) {
+ document.getElementById('saveSnapshotStatus').className = "alert alert-" + priority;
+ document.getElementById('saveSnapshotStatus').innerHTML = msg;
+}
+
+function saveSnapshotModalShowExpectedSize() {
+ var points = Math.round(saveSnapshotViewDuration / saveSnapshotSelectedSecondsPerPoint);
+ var priority = 'info';
+ var msg = 'A moderate snapshot.';
+
+ var sizemb = Math.round(
+ (options.data.charts_count * snapshotOptions.bytes_per_chart
+ + options.data.dimensions_count * points * snapshotOptions.compressions[saveSnapshotCompression].bytes_per_point_disk)
+ * 10 / 1024 / 1024) / 10;
+
+ var memmb = Math.round(
+ (options.data.charts_count * snapshotOptions.bytes_per_chart
+ + options.data.dimensions_count * points * snapshotOptions.compressions[saveSnapshotCompression].bytes_per_point_memory)
+ * 10 / 1024 / 1024) / 10;
+
+ if (sizemb < 10) {
+ priority = 'success';
+ msg = 'A nice small snapshot!';
+ }
+ if (sizemb > 50) {
+ priority = 'warning';
+ msg = 'Will stress your browser...';
+ }
+ if (sizemb > 100) {
+ priority = 'danger';
+ msg = 'Hm... good luck...';
+ }
+
+ saveSnapshotModalLog(priority, 'The snapshot will have ' + points.toString() + ' points per dimension. Expected size on disk ' + sizemb + ' MB, at browser memory ' + memmb + ' MB.<br/>' + msg);
+}
+
+var saveSnapshotCompression = snapshotOptions.compressionDefault;
+
+function saveSnapshotSetCompression(name) {
+ saveSnapshotCompression = name;
+ document.getElementById('saveSnapshotCompressionName').innerHTML = saveSnapshotCompression;
+ saveSnapshotModalShowExpectedSize();
+}
+
+var saveSnapshotSlider = null;
+var saveSnapshotSelectedSecondsPerPoint = 1;
+var saveSnapshotViewDuration = 1;
+
+function saveSnapshotModalInit() {
+ $('#saveSnapshotModalProgressSection').hide();
+ $('#saveSnapshotResolutionRadio').show();
+ saveSnapshotModalLog('info', 'Select resolution and click <b>Save</b>');
+ $('#saveSnapshotExport').removeClass('disabled');
+
+ loadBootstrapSlider(function () {
+ saveSnapshotViewDuration = options.duration;
+ var start_ms = Math.round(Date.now() - saveSnapshotViewDuration * 1000);
+
+ if (NETDATA.globalPanAndZoom.isActive() === true) {
+ saveSnapshotViewDuration = Math.round((NETDATA.globalPanAndZoom.force_before_ms - NETDATA.globalPanAndZoom.force_after_ms) / 1000);
+ start_ms = NETDATA.globalPanAndZoom.force_after_ms;
+ }
+
+ var start_date = new Date(start_ms);
+ var yyyymmddhhssmm = start_date.getFullYear() + NETDATA.zeropad(start_date.getMonth() + 1) + NETDATA.zeropad(start_date.getDate()) + '-' + NETDATA.zeropad(start_date.getHours()) + NETDATA.zeropad(start_date.getMinutes()) + NETDATA.zeropad(start_date.getSeconds());
+
+ document.getElementById('saveSnapshotFilename').value = 'netdata-' + options.hostname.toString() + '-' + yyyymmddhhssmm.toString() + '-' + saveSnapshotViewDuration.toString() + '.snapshot';
+ saveSnapshotSetCompression(saveSnapshotCompression);
+
+ var min = options.update_every;
+ var max = Math.round(saveSnapshotViewDuration / 100);
+
+ if (NETDATA.globalPanAndZoom.isActive() === false) {
+ max = Math.round(saveSnapshotViewDuration / 50);
+ }
+
+ var view = Math.round(saveSnapshotViewDuration / Math.round($(document.getElementById('charts_div')).width() / 2));
+
+ // console.log('view duration: ' + saveSnapshotViewDuration + ', min: ' + min + ', max: ' + max + ', view: ' + view);
+
+ if (max < 10) {
+ max = 10;
+ }
+ if (max < min) {
+ max = min;
+ }
+ if (view < min) {
+ view = min;
+ }
+ if (view > max) {
+ view = max;
+ }
+
+ if (saveSnapshotSlider !== null) {
+ saveSnapshotSlider.destroy();
+ }
+
+ saveSnapshotSlider = new Slider('#saveSnapshotResolutionSlider', {
+ ticks: [min, view, max],
+ min: min,
+ max: max,
+ step: options.update_every,
+ value: view,
+ scale: (max > 100) ? 'logarithmic' : 'linear',
+ tooltip: 'always',
+ formatter: function (value) {
+ if (value < 1) {
+ value = 1;
+ }
+
+ if (value < options.data.update_every) {
+ value = options.data.update_every;
+ }
+
+ saveSnapshotSelectedSecondsPerPoint = value;
+ saveSnapshotModalShowExpectedSize();
+
+ var seconds = ' seconds ';
+ if (value === 1) {
+ seconds = ' second ';
+ }
+
+ return value + seconds + 'per point' + ((value === options.data.update_every) ? ', server default' : '').toString();
+ }
+ });
+ });
+}
+
+function saveSnapshot() {
+ loadPako(function () {
+ loadLzString(function () {
+ saveSnapshotStop = false;
+ $('#saveSnapshotModalProgressSection').show();
+ $('#saveSnapshotResolutionRadio').hide();
+ $('#saveSnapshotExport').addClass('disabled');
+
+ var filename = document.getElementById('saveSnapshotFilename').value;
+ // console.log(filename);
+ saveSnapshotModalLog('info', 'Generating snapshot as <code>' + filename.toString() + '</code>');
+
+ var save_options = {
+ stop_updates_when_focus_is_lost: false,
+ update_only_visible: false,
+ sync_selection: false,
+ eliminate_zero_dimensions: true,
+ pan_and_zoom_data_padding: false,
+ show_help: false,
+ legend_toolbox: false,
+ resize_charts: false,
+ pixels_per_point: 1
+ };
+ var backedup_options = {};
+
+ var x;
+ for (x in save_options) {
+ if (save_options.hasOwnProperty(x)) {
+ backedup_options[x] = NETDATA.options.current[x];
+ NETDATA.options.current[x] = save_options[x];
+ }
+ }
+
+ var el = document.getElementById('saveSnapshotModalProgressBar');
+ var eltxt = document.getElementById('saveSnapshotModalProgressBarText');
+
+ options.data.charts_by_name = null;
+
+ var saveData = {
+ hostname: options.hostname,
+ server: NETDATA.serverDefault,
+ netdata_version: options.data.version,
+ snapshot_version: 1,
+ after_ms: Date.now() - options.duration * 1000,
+ before_ms: Date.now(),
+ highlight_after_ms: urlOptions.highlight_after,
+ highlight_before_ms: urlOptions.highlight_before,
+ duration_ms: options.duration * 1000,
+ update_every_ms: options.update_every * 1000,
+ data_points: 0,
+ url: ((urlOptions.server !== null) ? urlOptions.server : document.location.origin.toString() + document.location.pathname.toString() + document.location.search.toString()).toString(),
+ comments: document.getElementById('saveSnapshotComments').value.toString(),
+ hash: urlOptions.hash,
+ charts: options.data,
+ info: jsonStringifyFn({
+ menu: netdataDashboard.menu,
+ submenu: netdataDashboard.submenu,
+ context: netdataDashboard.context
+ }),
+ charts_ok: 0,
+ charts_failed: 0,
+ compression: saveSnapshotCompression,
+ data_size: 0,
+ data: {}
+ };
+
+ if (typeof snapshotOptions.compressions[saveData.compression] === 'undefined') {
+ alert('unknown compression method: ' + saveData.compression);
+ saveData.compression = 'none';
+ }
+
+ var compress = snapshotOptions.compressions[saveData.compression].compress;
+ var compressed_length = snapshotOptions.compressions[saveData.compression].compressed_length;
+
+ function pack_api1_v1_chart_data(state) {
+ if (state.library_name === null || state.data === null) {
+ return;
+ }
+
+ var data = state.data;
+ state.data = null;
+ data.state = null;
+ var str = JSON.stringify(data);
+
+ if (typeof str === 'string') {
+ var cstr = compress(str);
+ saveData.data[state.chartDataUniqueID()] = cstr;
+ return compressed_length(cstr);
+ } else {
+ return 0;
+ }
+ }
+
+ var clearPanAndZoom = false;
+ if (NETDATA.globalPanAndZoom.isActive() === false) {
+ NETDATA.globalPanAndZoom.setMaster(NETDATA.options.targets[0], saveData.after_ms, saveData.before_ms);
+ clearPanAndZoom = true;
+ }
+
+ saveData.after_ms = NETDATA.globalPanAndZoom.force_after_ms;
+ saveData.before_ms = NETDATA.globalPanAndZoom.force_before_ms;
+ saveData.duration_ms = saveData.before_ms - saveData.after_ms;
+ saveData.data_points = Math.round((saveData.before_ms - saveData.after_ms) / (saveSnapshotSelectedSecondsPerPoint * 1000));
+ saveSnapshotModalLog('info', 'Generating snapshot with ' + saveData.data_points.toString() + ' data points per dimension...');
+
+ var charts_count = 0;
+ var charts_ok = 0;
+ var charts_failed = 0;
+
+ function saveSnapshotRestore() {
+ $('#saveSnapshotModal').modal('hide');
+
+ // restore the options
+ var x;
+ for (x in backedup_options) {
+ if (backedup_options.hasOwnProperty(x)) {
+ NETDATA.options.current[x] = backedup_options[x];
+ }
+ }
+
+ $(el).css('width', '0%').attr('aria-valuenow', 0);
+ eltxt.innerText = '0%';
+
+ if (clearPanAndZoom) {
+ NETDATA.globalPanAndZoom.clearMaster();
+ }
+
+ NETDATA.options.force_data_points = 0;
+ NETDATA.options.fake_chart_rendering = false;
+ NETDATA.onscroll_updater_enabled = true;
+ NETDATA.onresize();
+ NETDATA.unpause();
+
+ $('#saveSnapshotExport').removeClass('disabled');
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.options.force_data_points = saveData.data_points;
+ NETDATA.options.fake_chart_rendering = true;
+ NETDATA.onscroll_updater_enabled = false;
+ NETDATA.abortAllRefreshes();
+
+ var size = 0;
+ var info = ' Resolution: <b>' + saveSnapshotSelectedSecondsPerPoint.toString() + ((saveSnapshotSelectedSecondsPerPoint === 1) ? ' second ' : ' seconds ').toString() + 'per point</b>.';
+
+ function update_chart(idx) {
+ if (saveSnapshotStop === true) {
+ saveSnapshotModalLog('info', 'Cancelled!');
+ saveSnapshotRestore();
+ return;
+ }
+
+ var state = NETDATA.options.targets[--idx];
+
+ var pcent = (NETDATA.options.targets.length - idx) * 100 / NETDATA.options.targets.length;
+ $(el).css('width', pcent + '%').attr('aria-valuenow', pcent);
+ eltxt.innerText = Math.round(pcent).toString() + '%, ' + state.id;
+
+ setTimeout(function () {
+ charts_count++;
+ state.isVisible(true);
+ state.current.force_after_ms = saveData.after_ms;
+ state.current.force_before_ms = saveData.before_ms;
+
+ state.updateChart(function (status, reason) {
+ state.current.force_after_ms = null;
+ state.current.force_before_ms = null;
+
+ if (status === true) {
+ charts_ok++;
+ // state.log('ok');
+ size += pack_api1_v1_chart_data(state);
+ } else {
+ charts_failed++;
+ state.log('failed to be updated: ' + reason);
+ }
+
+ saveSnapshotModalLog((charts_failed) ? 'danger' : 'info', 'Generated snapshot data size <b>' + (Math.round(size * 100 / 1024 / 1024) / 100).toString() + ' MB</b>. ' + ((charts_failed) ? (charts_failed.toString() + ' charts have failed to be downloaded') : '').toString() + info);
+
+ if (idx > 0) {
+ update_chart(idx);
+ } else {
+ saveData.charts_ok = charts_ok;
+ saveData.charts_failed = charts_failed;
+ saveData.data_size = size;
+ // console.log(saveData.compression + ': ' + (size / (options.data.dimensions_count * Math.round(saveSnapshotViewDuration / saveSnapshotSelectedSecondsPerPoint))).toString());
+
+ // save it
+ // console.log(saveData);
+ saveObjectToClient(saveData, filename);
+
+ if (charts_failed > 0) {
+ alert(charts_failed.toString() + ' failed to be downloaded');
+ }
+
+ saveSnapshotRestore();
+ saveData = null;
+ }
+ })
+ }, 0);
+ }
+
+ update_chart(NETDATA.options.targets.length);
+ });
+ });
+}
+
+// --------------------------------------------------------------------
+// activate netdata on the page
+
+function dashboardSettingsSetup() {
+ var update_options_modal = function () {
+ // console.log('update_options_modal');
+
+ var sync_option = function (option) {
+ var self = $('#' + option);
+
+ if (self.prop('checked') !== NETDATA.getOption(option)) {
+ // console.log('switching ' + option.toString());
+ self.bootstrapToggle(NETDATA.getOption(option) ? 'on' : 'off');
+ }
+ };
+
+ var theme_sync_option = function (option) {
+ var self = $('#' + option);
+
+ self.bootstrapToggle(netdataTheme === 'slate' ? 'on' : 'off');
+ };
+ var units_sync_option = function (option) {
+ var self = $('#' + option);
+
+ if (self.prop('checked') !== (NETDATA.getOption('units') === 'auto')) {
+ self.bootstrapToggle(NETDATA.getOption('units') === 'auto' ? 'on' : 'off');
+ }
+
+ if (self.prop('checked') === true) {
+ $('#settingsLocaleTempRow').show();
+ $('#settingsLocaleTimeRow').show();
+ } else {
+ $('#settingsLocaleTempRow').hide();
+ $('#settingsLocaleTimeRow').hide();
+ }
+ };
+ var temp_sync_option = function (option) {
+ var self = $('#' + option);
+
+ if (self.prop('checked') !== (NETDATA.getOption('temperature') === 'celsius')) {
+ self.bootstrapToggle(NETDATA.getOption('temperature') === 'celsius' ? 'on' : 'off');
+ }
+ };
+ var timezone_sync_option = function (option) {
+ var self = $('#' + option);
+
+ document.getElementById('browser_timezone').innerText = NETDATA.options.browser_timezone;
+ document.getElementById('server_timezone').innerText = NETDATA.options.server_timezone;
+ document.getElementById('current_timezone').innerText = (NETDATA.options.current.timezone === 'default') ? 'unset, using browser default' : NETDATA.options.current.timezone;
+
+ if (self.prop('checked') === NETDATA.dateTime.using_timezone) {
+ self.bootstrapToggle(NETDATA.dateTime.using_timezone ? 'off' : 'on');
+ }
+ };
+
+ sync_option('eliminate_zero_dimensions');
+ sync_option('destroy_on_hide');
+ sync_option('async_on_scroll');
+ sync_option('parallel_refresher');
+ sync_option('concurrent_refreshes');
+ sync_option('sync_selection');
+ sync_option('sync_pan_and_zoom');
+ sync_option('stop_updates_when_focus_is_lost');
+ sync_option('smooth_plot');
+ sync_option('pan_and_zoom_data_padding');
+ sync_option('show_help');
+ sync_option('seconds_as_time');
+ theme_sync_option('netdata_theme_control');
+ units_sync_option('units_conversion');
+ temp_sync_option('units_temp');
+ timezone_sync_option('local_timezone');
+
+ if (NETDATA.getOption('parallel_refresher') === false) {
+ $('#concurrent_refreshes_row').hide();
+ } else {
+ $('#concurrent_refreshes_row').show();
+ }
+ };
+ NETDATA.setOption('setOptionCallback', update_options_modal);
+
+ // handle options changes
+ $('#eliminate_zero_dimensions').change(function () {
+ NETDATA.setOption('eliminate_zero_dimensions', $(this).prop('checked'));
+ });
+ $('#destroy_on_hide').change(function () {
+ NETDATA.setOption('destroy_on_hide', $(this).prop('checked'));
+ });
+ $('#async_on_scroll').change(function () {
+ NETDATA.setOption('async_on_scroll', $(this).prop('checked'));
+ });
+ $('#parallel_refresher').change(function () {
+ NETDATA.setOption('parallel_refresher', $(this).prop('checked'));
+ });
+ $('#concurrent_refreshes').change(function () {
+ NETDATA.setOption('concurrent_refreshes', $(this).prop('checked'));
+ });
+ $('#sync_selection').change(function () {
+ NETDATA.setOption('sync_selection', $(this).prop('checked'));
+ });
+ $('#sync_pan_and_zoom').change(function () {
+ NETDATA.setOption('sync_pan_and_zoom', $(this).prop('checked'));
+ });
+ $('#stop_updates_when_focus_is_lost').change(function () {
+ urlOptions.update_always = !$(this).prop('checked');
+ urlOptions.hashUpdate();
+
+ NETDATA.setOption('stop_updates_when_focus_is_lost', !urlOptions.update_always);
+ });
+ $('#smooth_plot').change(function () {
+ NETDATA.setOption('smooth_plot', $(this).prop('checked'));
+ });
+ $('#pan_and_zoom_data_padding').change(function () {
+ NETDATA.setOption('pan_and_zoom_data_padding', $(this).prop('checked'));
+ });
+ $('#seconds_as_time').change(function () {
+ NETDATA.setOption('seconds_as_time', $(this).prop('checked'));
+ });
+ $('#local_timezone').change(function () {
+ if ($(this).prop('checked')) {
+ selected_server_timezone('default', true);
+ } else {
+ selected_server_timezone('default', false);
+ }
+ });
+
+ $('#units_conversion').change(function () {
+ NETDATA.setOption('units', $(this).prop('checked') ? 'auto' : 'original');
+ });
+ $('#units_temp').change(function () {
+ NETDATA.setOption('temperature', $(this).prop('checked') ? 'celsius' : 'fahrenheit');
+ });
+
+ $('#show_help').change(function () {
+ urlOptions.help = $(this).prop('checked');
+ urlOptions.hashUpdate();
+
+ NETDATA.setOption('show_help', urlOptions.help);
+ netdataReload();
+ });
+
+ // this has to be the last
+ // it reloads the page
+ $('#netdata_theme_control').change(function () {
+ urlOptions.theme = $(this).prop('checked') ? 'slate' : 'white';
+ urlOptions.hashUpdate();
+
+ if (setTheme(urlOptions.theme)) {
+ netdataReload();
+ }
+ });
+}
+
+function scrollDashboardTo() {
+ if (netdataSnapshotData !== null && typeof netdataSnapshotData.hash !== 'undefined') {
+ //console.log(netdataSnapshotData.hash);
+ scrollToId(netdataSnapshotData.hash.replace('#', ''));
+ } else {
+ // check if we have to jump to a specific section
+ scrollToId(urlOptions.hash.replace('#', ''));
+
+ if (urlOptions.chart !== null) {
+ NETDATA.alarms.scrollToChart(urlOptions.chart);
+ //urlOptions.hash = '#' + NETDATA.name2id('menu_' + charts[c].menu + '_submenu_' + charts[c].submenu);
+ //urlOptions.hash = '#chart_' + NETDATA.name2id(urlOptions.chart);
+ //console.log('hash = ' + urlOptions.hash);
+ }
+ }
+}
+
+var modalHiddenCallback = null;
+
+function scrollToChartAfterHidingModal(chart, alarmDate, alarmStatus) {
+ modalHiddenCallback = function () {
+ NETDATA.alarms.scrollToChart(chart, alarmDate);
+
+ if (['WARNING', 'CRITICAL'].includes(alarmStatus)) {
+ const currentChartState = NETDATA.options.targets.find(
+ (chartState) => chartState.id === chart,
+ )
+ const twoMinutes = 2 * 60 * 1000
+ NETDATA.globalPanAndZoom.setMaster(
+ currentChartState,
+ alarmDate - twoMinutes,
+ alarmDate + twoMinutes,
+ )
+ }
+ };
+}
+
+// ----------------------------------------------------------------------------
+
+function enableTooltipsAndPopovers() {
+ $('[data-toggle="tooltip"]').tooltip({
+ animated: 'fade',
+ trigger: 'hover',
+ html: true,
+ delay: {show: 500, hide: 0},
+ container: 'body'
+ });
+ $('[data-toggle="popover"]').popover();
+}
+
+// ----------------------------------------------------------------------------
+
+var runOnceOnDashboardLastRun = 0;
+
+function runOnceOnDashboardWithjQuery() {
+ if (runOnceOnDashboardLastRun !== 0) {
+ scrollDashboardTo();
+
+ // restore the scrollspy at the proper position
+ $(document.body).scrollspy('refresh');
+ $(document.body).scrollspy('process');
+
+ return;
+ }
+
+ runOnceOnDashboardLastRun = Date.now();
+
+ // ------------------------------------------------------------------------
+ // bootstrap modals
+
+ // prevent bootstrap modals from scrolling the page
+ // maintains the current scroll position
+ // https://stackoverflow.com/a/34754029/4525767
+
+ var scrollPos = 0;
+ var modal_depth = 0; // how many modals are currently open
+ var modal_shown = false; // set to true, if a modal is shown
+ var netdata_paused_on_modal = false; // set to true, if the modal paused netdata
+ var scrollspyOffset = $(window).height() / 3; // will be updated below - the offset of scrollspy to select an item
+
+ $('.modal')
+ .on('show.bs.modal', function () {
+ if (modal_depth === 0) {
+ scrollPos = window.scrollY;
+
+ $('body').css({
+ overflow: 'hidden',
+ position: 'fixed',
+ top: -scrollPos
+ });
+
+ modal_shown = true;
+
+ if (NETDATA.options.pauseCallback === null) {
+ NETDATA.pause(function () {
+ });
+ netdata_paused_on_modal = true;
+ } else {
+ netdata_paused_on_modal = false;
+ }
+ }
+
+ modal_depth++;
+ //console.log(urlOptions.after);
+
+ })
+ .on('hide.bs.modal', function () {
+
+ modal_depth--;
+
+ if (modal_depth <= 0) {
+ modal_depth = 0;
+
+ $('body')
+ .css({
+ overflow: '',
+ position: '',
+ top: ''
+ });
+
+ // scroll to the position we had open before the modal
+ $('html, body')
+ .animate({scrollTop: scrollPos}, 0);
+
+ // unpause netdata, if we paused it
+ if (netdata_paused_on_modal === true) {
+ NETDATA.unpause();
+ netdata_paused_on_modal = false;
+ }
+
+ // restore the scrollspy at the proper position
+ $(document.body).scrollspy('process');
+ }
+ //console.log(urlOptions.after);
+ })
+ .on('hidden.bs.modal', function () {
+ if (modal_depth === 0) {
+ modal_shown = false;
+ }
+
+ if (typeof modalHiddenCallback === 'function') {
+ modalHiddenCallback();
+ }
+
+ modalHiddenCallback = null;
+ //console.log(urlOptions.after);
+ });
+
+ // ------------------------------------------------------------------------
+ // sidebar / affix
+
+ if (shouldShowSignInBanner()) {
+ const el = document.getElementById("sign-in-banner");
+ if (el) {
+ el.style.display = "initial";
+ el.classList.add(`theme-${netdataTheme}`);
+ }
+ }
+
+ $('#sidebar')
+ .affix({
+ offset: {
+ top: (isdemo()) ? 150 : 0,
+ bottom: 0
+ }
+ })
+ .on('affixed.bs.affix', function () {
+ // fix scrolling of very long affix lists
+ // http://stackoverflow.com/questions/21691585/bootstrap-3-1-0-affix-too-long
+
+ $(this).removeAttr('style');
+ })
+ .on('affix-top.bs.affix', function () {
+ // fix bootstrap affix click bug
+ // https://stackoverflow.com/a/37847981/4525767
+
+ if (modal_shown) {
+ return false;
+ }
+ })
+ .on('activate.bs.scrollspy', function (e) {
+ // change the URL based on the current position of the screen
+
+ if (modal_shown === false) {
+ var el = $(e.target);
+ var hash = el.find('a').attr('href');
+ if (typeof hash === 'string' && hash.substring(0, 1) === '#' && urlOptions.hash.startsWith(hash + '_submenu_') === false) {
+ urlOptions.hash = hash;
+ urlOptions.hashUpdate();
+ }
+ }
+ });
+
+ Ps.initialize(document.getElementById('sidebar'), {
+ wheelSpeed: 0.5,
+ wheelPropagation: true,
+ swipePropagation: true,
+ minScrollbarLength: null,
+ maxScrollbarLength: null,
+ useBothWheelAxes: false,
+ suppressScrollX: true,
+ suppressScrollY: false,
+ scrollXMarginOffset: 0,
+ scrollYMarginOffset: 0,
+ theme: 'default'
+ });
+
+ // ------------------------------------------------------------------------
+ // scrollspy
+
+ if (scrollspyOffset > 250) {
+ scrollspyOffset = 250;
+ }
+ if (scrollspyOffset < 75) {
+ scrollspyOffset = 75;
+ }
+ document.body.setAttribute('data-offset', scrollspyOffset);
+
+ // scroll the dashboard, before activating the scrollspy, so that our
+ // hash will not be updated before we got the chance to scroll to it
+ scrollDashboardTo();
+
+ $(document.body).scrollspy({
+ target: '#sidebar',
+ offset: scrollspyOffset // controls the diff of the <hX> element to the top, to select it
+ });
+
+ // ------------------------------------------------------------------------
+ // my-netdata menu
+
+ Ps.initialize(document.getElementById('my-netdata-dropdown-content'), {
+ wheelSpeed: 1,
+ wheelPropagation: false,
+ swipePropagation: false,
+ minScrollbarLength: null,
+ maxScrollbarLength: null,
+ useBothWheelAxes: false,
+ suppressScrollX: true,
+ suppressScrollY: false,
+ scrollXMarginOffset: 0,
+ scrollYMarginOffset: 0,
+ theme: 'default'
+ });
+
+ $('#myNetdataDropdownParent')
+ .on('show.bs.dropdown', function () {
+ var hash = urlOptions.genHash();
+ $('.registry_link').each(function (idx) {
+ this.setAttribute('href', this.getAttribute("href").replace(/#.*$/, hash));
+ });
+
+ NETDATA.pause(function () {
+ });
+ })
+ .on('shown.bs.dropdown', function () {
+ Ps.update(document.getElementById('my-netdata-dropdown-content'));
+ myNetdataMenuDidShow();
+ })
+ .on('hidden.bs.dropdown', function () {
+ NETDATA.unpause();
+ });
+
+ $('#deleteRegistryModal')
+ .on('hidden.bs.modal', function () {
+ deleteRegistryGuid = null;
+ });
+
+ // ------------------------------------------------------------------------
+ // update modal
+
+ $('#updateModal')
+ .on('show.bs.modal', function () {
+ versionLog('checking, please wait...');
+ })
+ .on('shown.bs.modal', function () {
+ notifyForUpdate(true);
+ });
+
+ // ------------------------------------------------------------------------
+ // alarms modal
+
+ $('#alarmsModal')
+ .on('shown.bs.modal', function () {
+ alarmsUpdateModal();
+ })
+ .on('hidden.bs.modal', function () {
+ document.getElementById('alarms_active').innerHTML =
+ document.getElementById('alarms_all').innerHTML =
+ document.getElementById('alarms_log').innerHTML =
+ 'loading...';
+ });
+
+ // ------------------------------------------------------------------------
+
+ dashboardSettingsSetup();
+ loadSnapshotDragAndDropSetup();
+ saveSnapshotModalSetup();
+ showPageFooter();
+
+ // ------------------------------------------------------------------------
+ // https://github.com/viralpatel/jquery.shorten/blob/master/src/jquery.shorten.js
+
+ $.fn.shorten = function (settings) {
+ "use strict";
+
+ var config = {
+ showChars: 750,
+ minHideChars: 10,
+ ellipsesText: "...",
+ moreText: '<i class="fas fa-expand"></i> show more information',
+ lessText: '<i class="fas fa-compress"></i> show less information',
+ onLess: function () {
+ NETDATA.onscroll();
+ },
+ onMore: function () {
+ NETDATA.onscroll();
+ },
+ errMsg: null,
+ force: false
+ };
+
+ if (settings) {
+ $.extend(config, settings);
+ }
+
+ if ($(this).data('jquery.shorten') && !config.force) {
+ return false;
+ }
+ $(this).data('jquery.shorten', true);
+
+ $(document).off("click", '.morelink');
+
+ $(document).on({
+ click: function () {
+
+ var $this = $(this);
+ if ($this.hasClass('less')) {
+ $this.removeClass('less');
+ $this.html(config.moreText);
+ $this.parent().prev().animate({'height': '0' + '%'}, 0, function () {
+ $this.parent().prev().prev().show();
+ }).hide(0, function () {
+ config.onLess();
+ });
+ } else {
+ $this.addClass('less');
+ $this.html(config.lessText);
+ $this.parent().prev().animate({'height': '100' + '%'}, 0, function () {
+ $this.parent().prev().prev().hide();
+ }).show(0, function () {
+ config.onMore();
+ });
+ }
+ return false;
+ }
+ }, '.morelink');
+
+ return this.each(function () {
+ var $this = $(this);
+
+ var content = $this.html();
+ var contentlen = $this.text().length;
+ if (contentlen > config.showChars + config.minHideChars) {
+ var c = content.substr(0, config.showChars);
+ if (c.indexOf('<') >= 0) // If there's HTML don't want to cut it
+ {
+ var inTag = false; // I'm in a tag?
+ var bag = ''; // Put the characters to be shown here
+ var countChars = 0; // Current bag size
+ var openTags = []; // Stack for opened tags, so I can close them later
+ var tagName = null;
+
+ for (var i = 0, r = 0; r <= config.showChars; i++) {
+ if (content[i] === '<' && !inTag) {
+ inTag = true;
+
+ // This could be "tag" or "/tag"
+ tagName = content.substring(i + 1, content.indexOf('>', i));
+
+ // If its a closing tag
+ if (tagName[0] === '/') {
+
+ if (tagName !== ('/' + openTags[0])) {
+ config.errMsg = 'ERROR en HTML: the top of the stack should be the tag that closes';
+ } else {
+ openTags.shift(); // Pops the last tag from the open tag stack (the tag is closed in the retult HTML!)
+ }
+
+ } else {
+ // There are some nasty tags that don't have a close tag like <br/>
+ if (tagName.toLowerCase() !== 'br') {
+ openTags.unshift(tagName); // Add to start the name of the tag that opens
+ }
+ }
+ }
+
+ if (inTag && content[i] === '>') {
+ inTag = false;
+ }
+
+ if (inTag) {
+ bag += content.charAt(i);
+ } else {
+ // Add tag name chars to the result
+ r++;
+ if (countChars <= config.showChars) {
+ bag += content.charAt(i); // Fix to ie 7 not allowing you to reference string characters using the []
+ countChars++;
+ } else {
+ // Now I have the characters needed
+ if (openTags.length > 0) {
+ // I have unclosed tags
+
+ //console.log('They were open tags');
+ //console.log(openTags);
+ for (var j = 0; j < openTags.length; j++) {
+ //console.log('Cierro tag ' + openTags[j]);
+ bag += '</' + openTags[j] + '>'; // Close all tags that were opened
+
+ // You could shift the tag from the stack to check if you end with an empty stack, that means you have closed all open tags
+ }
+ break;
+ }
+ }
+ }
+ }
+ c = $('<div/>').html(bag + '<span class="ellip">' + config.ellipsesText + '</span>').html();
+ } else {
+ c += config.ellipsesText;
+ }
+
+ var html = '<div class="shortcontent">' + c +
+ '</div><div class="allcontent">' + content +
+ '</div><span><a href="javascript://nop/" class="morelink">' + config.moreText + '</a></span>';
+
+ $this.html(html);
+ $this.find(".allcontent").hide(); // Hide all text
+ $('.shortcontent p:last', $this).css('margin-bottom', 0); //Remove bottom margin on last paragraph as it's likely shortened
+ }
+ });
+ };
+}
+
+function finalizePage() {
+ // resize all charts - without starting the background thread
+ // this has to be done while NETDATA is paused
+ // if we ommit this, the affix menu will be wrong, since all
+ // the Dom elements are initially zero-sized
+ NETDATA.parseDom();
+
+ // ------------------------------------------------------------------------
+
+ NETDATA.globalPanAndZoom.callback = null;
+ NETDATA.globalChartUnderlay.callback = null;
+
+ if (urlOptions.pan_and_zoom === true && NETDATA.options.targets.length > 0) {
+ NETDATA.globalPanAndZoom.setMaster(NETDATA.options.targets[0], urlOptions.after, urlOptions.before);
+ }
+
+ // callback for us to track PanAndZoom operations
+ NETDATA.globalPanAndZoom.callback = urlOptions.netdataPanAndZoomCallback;
+ NETDATA.globalChartUnderlay.callback = urlOptions.netdataHighlightCallback;
+
+ // ------------------------------------------------------------------------
+
+ // let it run (update the charts)
+ NETDATA.unpause();
+
+ runOnceOnDashboardWithjQuery();
+ $(".shorten").shorten();
+ enableTooltipsAndPopovers();
+
+ if (isdemo()) {
+ // do not to give errors on netdata demo servers for 60 seconds
+ NETDATA.options.current.retries_on_data_failures = 60;
+
+ // google analytics when this is used for the home page of the demo sites
+ // this does not run on user's installations
+ setTimeout(function () {
+ (function (i, s, o, g, r, a, m) {
+ i['GoogleAnalyticsObject'] = r;
+ i[r] = i[r] || function () {
+ (i[r].q = i[r].q || []).push(arguments)
+ }, i[r].l = 1 * new Date();
+ a = s.createElement(o),
+ m = s.getElementsByTagName(o)[0];
+ a.async = 1;
+ a.src = g;
+ m.parentNode.insertBefore(a, m)
+ })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
+
+ ga('create', 'UA-64295674-3', 'auto');
+ ga('send', 'pageview', '/demosite/' + window.location.host);
+ }, 2000);
+ } else {
+ notifyForUpdate();
+ }
+
+ if (urlOptions.show_alarms === true) {
+ setTimeout(function () {
+ $('#alarmsModal').modal('show');
+ }, 1000);
+ }
+
+ NETDATA.onresizeCallback = function () {
+ Ps.update(document.getElementById('sidebar'));
+ Ps.update(document.getElementById('my-netdata-dropdown-content'));
+ };
+ NETDATA.onresizeCallback();
+
+ if (netdataSnapshotData !== null) {
+ NETDATA.globalPanAndZoom.setMaster(NETDATA.options.targets[0], netdataSnapshotData.after_ms, netdataSnapshotData.before_ms);
+ }
+
+ //if (urlOptions.nowelcome !== true) {
+ // setTimeout(function () {
+ // $('#welcomeModal').modal();
+ // }, 2000);
+ //}
+
+ // var netdataEnded = performance.now();
+ // console.log('start up time: ' + (netdataEnded - netdataStarted).toString() + ' ms');
+}
+
+function resetDashboardOptions() {
+ var help = NETDATA.options.current.show_help;
+
+ NETDATA.resetOptions();
+ if (setTheme('slate')) {
+ netdataReload();
+ }
+
+ if (help !== NETDATA.options.current.show_help) {
+ netdataReload();
+ }
+}
+
+// callback to add the dashboard info to the
+// parallel javascript downloader in netdata
+var netdataPrepCallback = function () {
+ NETDATA.requiredCSS.push({
+ url: NETDATA.serverStatic + 'css/bootstrap-toggle-2.2.2.min.css',
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ });
+
+ NETDATA.requiredJs.push({
+ url: NETDATA.serverStatic + 'lib/bootstrap-toggle-2.2.2.min.js',
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ });
+
+ NETDATA.requiredJs.push({
+ url: NETDATA.serverStatic + 'dashboard_info.js?v20181019-1',
+ async: false,
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ });
+
+ if (isdemo()) {
+ document.getElementById('masthead').style.display = 'block';
+ } else {
+ if (urlOptions.update_always === true) {
+ NETDATA.setOption('stop_updates_when_focus_is_lost', !urlOptions.update_always);
+ }
+ }
+};
+
+var selected_server_timezone = function (timezone, status) {
+ //console.log('called with timezone: ' + timezone + ", status: " + ((typeof status === 'undefined')?'undefined':status).toString());
+
+ // clear the error
+ document.getElementById('timezone_error_message').innerHTML = '';
+
+ if (typeof status === 'undefined') {
+ // the user selected a timezone from the menu
+
+ NETDATA.setOption('user_set_server_timezone', timezone);
+
+ if (NETDATA.dateTime.init(timezone) === false) {
+ NETDATA.dateTime.init();
+
+ if (!$('#local_timezone').prop('checked')) {
+ $('#local_timezone').bootstrapToggle('on');
+ }
+
+ document.getElementById('timezone_error_message').innerHTML = 'Ooops! That timezone was not accepted by your browser. Please open a github issue to help us fix it.';
+ NETDATA.setOption('user_set_server_timezone', NETDATA.options.server_timezone);
+ } else {
+ if ($('#local_timezone').prop('checked')) {
+ $('#local_timezone').bootstrapToggle('off');
+ }
+ }
+ } else if (status === true) {
+ // the user wants the browser default timezone to be activated
+
+ NETDATA.dateTime.init();
+ } else {
+ // the user wants the server default timezone to be activated
+ //console.log('found ' + NETDATA.options.current.user_set_server_timezone);
+
+ if (NETDATA.options.current.user_set_server_timezone === 'default') {
+ NETDATA.options.current.user_set_server_timezone = NETDATA.options.server_timezone;
+ }
+
+ timezone = NETDATA.options.current.user_set_server_timezone;
+
+ if (NETDATA.dateTime.init(timezone) === false) {
+ NETDATA.dateTime.init();
+
+ if (!$('#local_timezone').prop('checked')) {
+ $('#local_timezone').bootstrapToggle('on');
+ }
+
+ document.getElementById('timezone_error_message').innerHTML = 'Sorry. The timezone "' + timezone.toString() + '" is not accepted by your browser. Please select one from the list.';
+ NETDATA.setOption('user_set_server_timezone', NETDATA.options.server_timezone);
+ }
+ }
+
+ document.getElementById('current_timezone').innerText = (NETDATA.options.current.timezone === 'default') ? 'unset, using browser default' : NETDATA.options.current.timezone;
+ return false;
+};
+
+// our entry point
+// var netdataStarted = performance.now();
+
+var netdataCallback = initializeDynamicDashboard;
+
+// =================================================================================================
+// netdata.cloud
+
+let registryAgents = [];
+
+let cloudAgents = [];
+
+let myNetdataMenuFilterValue = "";
+
+let cloudAccountID = null;
+
+let cloudAccountName = null;
+
+let cloudToken = null;
+
+/// Enforces a maximum string length while retaining the prefix and the postfix of
+/// the string.
+function truncateString(str, maxLength) {
+ if (str.length <= maxLength) {
+ return str;
+ }
+
+ const spanLength = Math.floor((maxLength - 3) / 2);
+ return `${str.substring(0, spanLength)}...${str.substring(str.length - spanLength)}`;
+}
+
+// -------------------------------------------------------------------------------------------------
+// netdata.cloud API Client
+// -------------------------------------------------------------------------------------------------
+
+function isValidAgent(a) {
+ return a.urls != null && a.urls.length > 0;
+}
+
+// https://github.com/netdata/hub/issues/146
+function getCloudAccountAgents() {
+ if (!isSignedIn()) {
+ return [];
+ }
+
+ return fetch(
+ `${NETDATA.registry.cloudBaseURL}/api/v1/accounts/${cloudAccountID}/agents`,
+ {
+ method: "GET",
+ mode: "cors",
+ headers: {
+ "Authorization": `Bearer ${cloudToken}`
+ }
+ }
+ ).then((response) => {
+ if (!response.ok) {
+ throw Error("Cannot fetch known accounts");
+ }
+ return response.json();
+ }).then((payload) => {
+ const agents = payload.result ? payload.result.agents : null;
+
+ if (!agents) {
+ return [];
+ }
+
+ return agents.filter((a) => isValidAgent(a)).map((a) => {
+ return {
+ "guid": a.id,
+ "name": a.name,
+ "url": a.urls[0],
+ "alternate_urls": a.urls
+ }
+ })
+ }).catch(function (error) {
+ console.log(error);
+ return null;
+ });
+}
+
+/** Updates the lastAccessTime and accessCount properties of the agent for the account. */
+function touchAgent() {
+ if (!isSignedIn()) {
+ return [];
+ }
+
+ const touchUrl = `${NETDATA.registry.cloudBaseURL}/api/v1/agents/${NETDATA.registry.machine_guid}/touch?account_id=${cloudAccountID}`;
+ return fetch(
+ touchUrl,
+ {
+ method: "post",
+ body: "",
+ mode: "cors",
+ headers: {
+ "Authorization": `Bearer ${cloudToken}`
+ }
+ }
+ ).then((response) => {
+ if (!response.ok) {
+ throw Error("Cannot touch agent" + JSON.stringify(response));
+ }
+ return response.json();
+ }).then((payload) => {
+
+ }).catch(function (error) {
+ console.log(error);
+ return null;
+ });
+}
+
+// https://github.com/netdata/hub/issues/128
+function postCloudAccountAgents(agentsToSync) {
+ if (!isSignedIn()) {
+ return [];
+ }
+
+ const maskedURL = NETDATA.registry.MASKED_DATA;
+
+ const agents = agentsToSync.map((a) => {
+ const urls = a.alternate_urls.filter((url) => url != maskedURL);
+
+ return {
+ "id": a.guid,
+ "name": a.name,
+ "urls": urls
+ }
+ }).filter((a) => isValidAgent(a))
+
+ const payload = {
+ "accountID": cloudAccountID,
+ "agents": agents,
+ "merge": false,
+ };
+
+ return fetch(
+ `${NETDATA.registry.cloudBaseURL}/api/v1/accounts/${cloudAccountID}/agents`,
+ {
+ method: "POST",
+ mode: "cors",
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ "Authorization": `Bearer ${cloudToken}`
+ },
+ body: JSON.stringify(payload)
+ }
+ ).then((response) => {
+ return response.json();
+ }).then((payload) => {
+ const agents = payload.result ? payload.result.agents : null;
+
+ if (!agents) {
+ return [];
+ }
+
+ return agents.filter((a) => isValidAgent(a)).map((a) => {
+ return {
+ "guid": a.id,
+ "name": a.name,
+ "url": a.urls[0],
+ "alternate_urls": a.urls
+ }
+ })
+ });
+}
+
+function deleteCloudAgentURL(agentID, url) {
+ if (!isSignedIn()) {
+ return [];
+ }
+
+ return fetch(
+ `${NETDATA.registry.cloudBaseURL}/api/v1/accounts/${cloudAccountID}/agents/${agentID}/url?value=${encodeURIComponent(url)}`,
+ {
+ method: "DELETE",
+ mode: "cors",
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ "Authorization": `Bearer ${cloudToken}`
+ },
+ }
+ ).then((response) => {
+ return response.json();
+ }).then((payload) => {
+ const count = payload.result ? payload.result.count : 0;
+ return count;
+ });
+}
+
+// -------------------------------------------------------------------------------------------------
+
+function signInDidClick(e) {
+ e.preventDefault();
+ e.stopPropagation();
+
+ if (!NETDATA.registry.isUsingGlobalRegistry()) {
+ // If user is using a private registry, request his consent for
+ // synchronizing with cloud.
+ showSignInModal();
+ return;
+ }
+
+ signIn();
+}
+
+function shouldShowSignInBanner() {
+ return false;
+}
+
+function closeSignInBanner() {
+ localStorage.setItem("signInBannerClosed", "true");
+ const el = document.getElementById("sign-in-banner");
+ if (el) {
+ el.style.display = "none";
+ }
+}
+
+function closeSignInBannerDidClick(e) {
+ closeSignInBanner();
+}
+
+function signOutDidClick(e) {
+ e.preventDefault();
+ e.stopPropagation();
+ signOut();
+}
+
+// -------------------------------------------------------------------------------------------------
+
+function updateMyNetdataAfterFilterChange() {
+ const machinesEl = document.getElementById("my-netdata-menu-machines")
+ machinesEl.innerHTML = renderMachines(cloudAgents);
+
+ if (options.hosts.length > 1) {
+ const streamedEl = document.getElementById("my-netdata-menu-streamed")
+ streamedEl.innerHTML = renderStreamedHosts(options);
+ }
+}
+
+function myNetdataMenuDidShow() {
+ const filterEl = document.getElementById("my-netdata-menu-filter-input");
+ if (filterEl) {
+ filterEl.focus();
+ }
+}
+
+function myNetdataFilterDidChange(e) {
+ const inputEl = e.target;
+ setTimeout(() => {
+ myNetdataMenuFilterValue = inputEl.value;
+ updateMyNetdataAfterFilterChange();
+ }, 1);
+}
+
+function myNetdataFilterClearDidClick(e) {
+ e.preventDefault();
+ e.stopPropagation();
+
+ const inputEl = document.getElementById("my-netdata-menu-filter-input");
+ inputEl.value = "";
+ myNetdataMenuFilterValue = "";
+
+ updateMyNetdataAfterFilterChange();
+
+ inputEl.focus();
+}
+
+// -------------------------------------------------------------------------------------------------
+
+function clearCloudVariables() {
+ cloudAccountID = null;
+ cloudAccountName = null;
+ cloudToken = null;
+}
+
+function clearCloudLocalStorageItems() {
+ localStorage.removeItem("cloud.baseURL");
+ localStorage.removeItem("cloud.agentID");
+ localStorage.removeItem("cloud.sync");
+}
+
+function signIn() {
+ const url = `${NETDATA.registry.cloudBaseURL}/account/sign-in-agent?id=${NETDATA.registry.machine_guid}&name=${encodeURIComponent(NETDATA.registry.hostname)}&origin=${encodeURIComponent(window.location.origin + "/")}`;
+ window.open(url);
+}
+
+function signOut() {
+ cloudSSOSignOut();
+}
+
+function handleMessage(e) {
+ switch (e.data.type) {
+ case "sign-in":
+ handleSignInMessage(e);
+ break;
+
+ case "sign-out":
+ handleSignOutMessage(e);
+ break;
+
+ default:
+ return;
+ }
+}
+
+function handleSignInMessage(e) {
+ closeSignInBanner();
+ localStorage.setItem("cloud.baseURL", NETDATA.registry.cloudBaseURL);
+
+ cloudAccountID = e.data.accountID;
+ cloudAccountName = e.data.accountName;
+ cloudToken = e.data.token;
+
+ netdataRegistryCallback(registryAgents);
+ if (e.data.redirectURI && !window.location.href.includes(e.data.redirectURI)) {
+ // lgtm false-positive - redirectURI does not come from user input, but from iframe callback
+ window.location.replace(e.data.redirectURI); // lgtm[js/client-side-unvalidated-url-redirection]
+ }
+}
+
+function handleSignOutMessage(e) {
+ clearCloudVariables();
+ renderMyNetdataMenu(registryAgents);
+}
+
+function isSignedIn() {
+ return cloudToken != null && cloudAccountID != null;
+}
+
+function sortedArraysEqual(a, b) {
+ if (a.length != b.length) return false;
+
+ for (var i = 0; i < a.length; ++i) {
+ if (a[i] !== b[i]) return false;
+ }
+
+ return true;
+}
+
+// If merging is needed returns the merged agents set, otherwise returns null.
+function mergeAgents(cloud, local) {
+ let dirty = false;
+
+ const union = new Map();
+
+ for (const cagent of cloud) {
+ union.set(cagent.guid, cagent);
+ }
+
+ for (const lagent of local) {
+ const cagent = union.get(lagent.guid);
+ if (cagent) {
+ for (const u of lagent.alternate_urls) {
+ if (u === NETDATA.registry.MASKED_DATA) { // TODO: temp until registry is updated.
+ continue;
+ }
+
+ if (!cagent.alternate_urls.includes(u)) {
+ dirty = true;
+ cagent.alternate_urls.push(u);
+ }
+ }
+ } else {
+ dirty = true;
+ union.set(lagent.guid, lagent);
+ }
+ }
+
+ if (dirty) {
+ return Array.from(union.values());
+ }
+
+ return null;
+}
+
+function showSignInModal() {
+ document.getElementById("sim-registry").innerHTML = NETDATA.registry.server;
+ $("#signInModal").modal("show");
+}
+
+function explicitlySignIn() {
+ $("#signInModal").modal("hide");
+ signIn();
+}
+
+function showSyncModal() {
+ document.getElementById("sync-registry-modal-registry").innerHTML = NETDATA.registry.server;
+ $("#syncRegistryModal").modal("show");
+}
+
+function explicitlySyncAgents() {
+ $("#syncRegistryModal").modal("hide");
+
+ const json = localStorage.getItem("cloud.sync");
+ const sync = json ? JSON.parse(json): {};
+ delete sync[cloudAccountID];
+ localStorage.setItem("cloud.sync", JSON.stringify(sync));
+
+ NETDATA.registry.init();
+}
+
+function syncAgents(callback) {
+ const json = localStorage.getItem("cloud.sync");
+ const sync = json ? JSON.parse(json): {};
+
+ const currentAgent = {
+ guid: NETDATA.registry.machine_guid,
+ name: NETDATA.registry.hostname,
+ url: NETDATA.serverDefault,
+ alternate_urls: [NETDATA.serverDefault],
+ }
+
+ const localAgents = sync[cloudAccountID]
+ ? [currentAgent]
+ : registryAgents.concat([currentAgent]);
+
+ console.log("Checking if sync is needed.", localAgents);
+
+ const agentsToSync = mergeAgents(cloudAgents, localAgents);
+
+ if ((!sync[cloudAccountID]) || agentsToSync) {
+ sync[cloudAccountID] = new Date().getTime();
+ localStorage.setItem("cloud.sync", JSON.stringify(sync));
+ }
+
+ if (agentsToSync) {
+ console.log("Synchronizing with netdata.cloud.");
+
+ postCloudAccountAgents(agentsToSync).then((agents) => {
+ // TODO: clear syncTime on error!
+ cloudAgents = agents;
+ callback(cloudAgents);
+ });
+
+ return
+ }
+
+ callback(cloudAgents);
+}
+
+let isCloudSSOInitialized = false;
+
+function cloudSSOInit() {
+ const iframeEl = document.getElementById("ssoifrm");
+ const url = `${NETDATA.registry.cloudBaseURL}/account/sso-agent?id=${NETDATA.registry.machine_guid}`;
+ iframeEl.src = url;
+ isCloudSSOInitialized = true;
+}
+
+function cloudSSOSignOut() {
+ const iframe = document.getElementById("ssoifrm");
+ const url = `${NETDATA.registry.cloudBaseURL}/account/sign-out-agent`;
+ iframe.src = url;
+}
+
+function initCloud() {
+ if (!NETDATA.registry.isCloudEnabled) {
+ clearCloudVariables();
+ clearCloudLocalStorageItems();
+ return;
+ }
+
+ if (NETDATA.registry.cloudBaseURL != localStorage.getItem("cloud.baseURL")) {
+ clearCloudVariables();
+ clearCloudLocalStorageItems();
+ if (NETDATA.registry.cloudBaseURL) {
+ localStorage.setItem("cloud.baseURL", NETDATA.registry.cloudBaseURL);
+ }
+ }
+
+ if (!isCloudSSOInitialized) {
+ cloudSSOInit();
+ }
+
+ touchAgent();
+}
+
+// This callback is called after NETDATA.registry is initialized.
+function netdataRegistryCallback(machinesArray) {
+ localStorage.setItem("cloud.agentID", NETDATA.registry.machine_guid);
+
+ initCloud();
+
+ registryAgents = machinesArray;
+
+ if (isSignedIn()) {
+ // We call getCloudAccountAgents() here because it requires that
+ // NETDATA.registry is initialized.
+ clearMyNetdataMenu();
+ getCloudAccountAgents().then((agents) => {
+ if (!agents) {
+ errorMyNetdataMenu();
+ return;
+ }
+ cloudAgents = agents;
+ syncAgents((agents) => {
+ const agentsMap = {}
+ for (const agent of agents) {
+ agentsMap[agent.guid] = agent;
+ }
+
+ NETDATA.registry.machines = agentsMap;
+ NETDATA.registry.machines_array = agents;
+
+ renderMyNetdataMenu(agents);
+ });
+ });
+ } else {
+ renderMyNetdataMenu(machinesArray)
+ }
+};
+
+// If we know the cloudBaseURL and agentID from local storage render (eagerly)
+// the account ui before receiving the definitive response from the web server.
+// This improves the perceived performance.
+function tryFastInitCloud() {
+ const baseURL = localStorage.getItem("cloud.baseURL");
+ const agentID = localStorage.getItem("cloud.agentID");
+
+ if (baseURL && agentID) {
+ NETDATA.registry.cloudBaseURL = baseURL;
+ NETDATA.registry.machine_guid = agentID;
+ NETDATA.registry.isCloudEnabled = true;
+
+ initCloud();
+ }
+}
+
+function initializeApp() {
+ window.addEventListener("message", handleMessage, false);
+
+// tryFastInitCloud();
+}
+
+if (document.readyState === "complete") {
+ initializeApp();
+} else {
+ document.addEventListener("readystatechange", () => {
+ if (document.readyState === "complete") {
+ initializeApp();
+ }
+ });
+}
diff --git a/applications/luci-app-netdata/root/usr/share/rpcd/acl.d/luci-app-netdata.json b/applications/luci-app-netdata/root/usr/share/rpcd/acl.d/luci-app-netdata.json
new file mode 100755
index 0000000..6f19d2f
--- /dev/null
+++ b/applications/luci-app-netdata/root/usr/share/rpcd/acl.d/luci-app-netdata.json
@@ -0,0 +1,11 @@
+{
+ "luci-app-nedata": {
+ "description": "Grant UCI access for luci-app-netdata",
+ "read": {
+ "uci": [ "netdata" ]
+ },
+ "write": {
+ "uci": [ "netdata" ]
+ }
+ }
+}
diff --git a/applications/luci-app-netdata/web/dashboard.js b/applications/luci-app-netdata/web/dashboard.js
new file mode 100755
index 0000000..f20f352
--- /dev/null
+++ b/applications/luci-app-netdata/web/dashboard.js
@@ -0,0 +1,10378 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// DO NOT EDIT: This file is automatically generated from the source files in src/
+
+// ----------------------------------------------------------------------------
+// You can set the following variables before loading this script:
+
+// 'use strict';
+
+/*global netdataNoDygraphs *//* boolean, disable dygraph charts
+ * (default: false) */
+/*global netdataNoSparklines *//* boolean, disable sparkline charts
+ * (default: false) */
+/*global netdataNoPeitys *//* boolean, disable peity charts
+ * (default: false) */
+/*global netdataNoGoogleCharts *//* boolean, disable google charts
+ * (default: false) */
+/*global netdataNoMorris *//* boolean, disable morris charts
+ * (default: false) */
+/*global netdataNoEasyPieChart *//* boolean, disable easypiechart charts
+ * (default: false) */
+/*global netdataNoGauge *//* boolean, disable gauge.js charts
+ * (default: false) */
+/*global netdataNoD3 *//* boolean, disable d3 charts
+ * (default: false) */
+/*global netdataNoC3 *//* boolean, disable c3 charts
+ * (default: false) */
+/*global netdataNoD3pie *//* boolean, disable d3pie charts
+ * (default: false) */
+/*global netdataNoBootstrap *//* boolean, disable bootstrap - disables help too
+ * (default: false) */
+/*global netdataNoFontAwesome *//* boolean, disable fontawesome (do not load it)
+ * (default: false) */
+/*global netdataIcons *//* object, overwrite netdata fontawesome icons
+ * (default: null) */
+/*global netdataDontStart *//* boolean, do not start the thread to process the charts
+ * (default: false) */
+/*global netdataErrorCallback *//* function, callback to be called when the dashboard encounters an error
+ * (default: null) */
+/*global netdataRegistry:true *//* boolean, use the netdata registry
+ * (default: false) */
+/*global netdataNoRegistry *//* boolean, included only for compatibility with existing custom dashboard
+ * (obsolete - do not use this any more) */
+/*global netdataRegistryCallback *//* function, callback that will be invoked with one param: the URLs from the registry
+ * (default: null) */
+/*global netdataShowHelp:true *//* boolean, disable charts help
+ * (default: true) */
+/*global netdataShowAlarms:true *//* boolean, enable alarms checks and notifications
+ * (default: false) */
+/*global netdataRegistryAfterMs:true *//* ms, delay registry use at started
+ * (default: 1500) */
+/*global netdataCallback *//* function, callback to be called when netdata is ready to start
+ * (default: null)
+ * netdata will be running while this is called
+ * (call NETDATA.pause to stop it) */
+/*global netdataPrepCallback *//* function, callback to be called before netdata does anything else
+ * (default: null) */
+/*global netdataServer *//* string, the URL of the netdata server to use
+ * (default: the URL the page is hosted at) */
+/*global netdataServerStatic *//* string, the URL of the netdata server to use for static files
+ * (default: netdataServer) */
+/*global netdataSnapshotData *//* object, a netdata snapshot loaded
+ * (default: null) */
+/*global netdataAlarmsRecipients *//* array, an array of alarm recipients to show notifications for
+ * (default: null) */
+/*global netdataAlarmsRemember *//* boolen, keep our position in the alarm log at browser local storage
+ * (default: true) */
+/*global netdataAlarmsActiveCallback *//* function, a hook for the alarm logs
+ * (default: undefined) */
+/*global netdataAlarmsNotifCallback *//* function, a hook for alarm notifications
+ * (default: undefined) */
+/*global netdataIntersectionObserver *//* boolean, enable or disable the use of intersection observer
+ * (default: true) */
+/*global netdataCheckXSS *//* boolean, enable or disable checking for XSS issues
+ * (default: false) */
+
+// ----------------------------------------------------------------------------
+// global namespace
+
+// Should stay var!
+var NETDATA = window.NETDATA || {};
+
+(function(window, document, $, undefined) {
+
+// *** src/dashboard.js/utils.js
+
+NETDATA.name2id = function (s) {
+ return s
+ .replace(/ /g, '_')
+ .replace(/:/g, '_')
+ .replace(/\(/g, '_')
+ .replace(/\)/g, '_')
+ .replace(/\./g, '_')
+ .replace(/\//g, '_');
+};
+
+NETDATA.encodeURIComponent = function (s) {
+ if (typeof(s) === 'string') {
+ return encodeURIComponent(s);
+ }
+
+ return s;
+};
+
+/// A heuristic for detecting slow devices.
+let isSlowDeviceResult = undefined;
+const isSlowDevice = function () {
+ if (!isSlowDeviceResult) {
+ return isSlowDeviceResult;
+ }
+
+ try {
+ let ua = navigator.userAgent.toLowerCase();
+
+ let iOS = /ipad|iphone|ipod/.test(ua) && !window.MSStream;
+ let android = /android/.test(ua) && !window.MSStream;
+ isSlowDeviceResult = (iOS || android);
+ } catch (e) {
+ isSlowDeviceResult = false;
+ }
+
+ return isSlowDeviceResult;
+};
+
+NETDATA.guid = function () {
+ function s4() {
+ return Math.floor((1 + Math.random()) * 0x10000)
+ .toString(16)
+ .substring(1);
+ }
+
+ return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+};
+
+NETDATA.zeropad = function (x) {
+ if (x > -10 && x < 10) {
+ return '0' + x.toString();
+ } else {
+ return x.toString();
+ }
+};
+
+NETDATA.seconds4human = function (seconds, options) {
+ let defaultOptions = {
+ now: '现在',
+ space: ' ',
+ negative_suffix: '前',
+ day: '日',
+ days: '日',
+ hour: '小时',
+ hours: '小时',
+ minute: '分钟',
+ minutes: '分钟',
+ second: '秒',
+ seconds: '秒',
+ and: '及'
+ };
+
+ if (typeof options !== 'object') {
+ options = defaultOptions;
+ } else {
+ for (var x in defaultOptions) {
+ if (typeof options[x] !== 'string') {
+ options[x] = defaultOptions[x];
+ }
+ }
+ }
+
+ if (typeof seconds === 'string') {
+ seconds = parseInt(seconds, 10);
+ }
+
+ if (seconds === 0) {
+ return options.now;
+ }
+
+ let suffix = '';
+ if (seconds < 0) {
+ seconds = -seconds;
+ if (options.negative_suffix !== '') {
+ suffix = options.space + options.negative_suffix;
+ }
+ }
+
+ let days = Math.floor(seconds / 86400);
+ seconds -= (days * 86400);
+
+ let hours = Math.floor(seconds / 3600);
+ seconds -= (hours * 3600);
+
+ let minutes = Math.floor(seconds / 60);
+ seconds -= (minutes * 60);
+
+ let strings = [];
+
+ if (days > 1) {
+ strings.push(days.toString() + options.space + options.days);
+ } else if (days === 1) {
+ strings.push(days.toString() + options.space + options.day);
+ }
+
+ if (hours > 1) {
+ strings.push(hours.toString() + options.space + options.hours);
+ } else if (hours === 1) {
+ strings.push(hours.toString() + options.space + options.hour);
+ }
+
+ if (minutes > 1) {
+ strings.push(minutes.toString() + options.space + options.minutes);
+ } else if (minutes === 1) {
+ strings.push(minutes.toString() + options.space + options.minute);
+ }
+
+ if (seconds > 1) {
+ strings.push(Math.floor(seconds).toString() + options.space + options.seconds);
+ } else if (seconds === 1) {
+ strings.push(Math.floor(seconds).toString() + options.space + options.second);
+ }
+
+ if (strings.length === 1) {
+ return strings.pop() + suffix;
+ }
+
+ let last = strings.pop();
+ return strings.join(", ") + " " + options.and + " " + last + suffix;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// element data attributes
+
+NETDATA.dataAttribute = function (element, attribute, def) {
+ let key = 'data-' + attribute.toString();
+ if (element.hasAttribute(key)) {
+ let data = element.getAttribute(key);
+
+ if (data === 'true') {
+ return true;
+ }
+ if (data === 'false') {
+ return false;
+ }
+ if (data === 'null') {
+ return null;
+ }
+
+ // Only convert to a number if it doesn't change the string
+ if (data === +data + '') {
+ return +data;
+ }
+
+ if (/^(?:\{[\w\W]*\}|\[[\w\W]*\])$/.test(data)) {
+ return JSON.parse(data);
+ }
+
+ return data;
+ } else {
+ return def;
+ }
+};
+
+NETDATA.dataAttributeBoolean = function (element, attribute, def) {
+ let value = NETDATA.dataAttribute(element, attribute, def);
+
+ if (value === true || value === false) // gmosx: Love this :)
+ {
+ return value;
+ }
+
+ if (typeof(value) === 'string') {
+ if (value === 'yes' || value === 'on') {
+ return true;
+ }
+
+ if (value === '' || value === 'no' || value === 'off' || value === 'null') {
+ return false;
+ }
+
+ return def;
+ }
+
+ if (typeof(value) === 'number') {
+ return value !== 0;
+ }
+
+ return def;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// fast numbers formatting
+
+NETDATA.fastNumberFormat = {
+ formattersFixed: [],
+ formattersZeroBased: [],
+
+ // this is the fastest and the preferred
+ getIntlNumberFormat: function (min, max) {
+ let key = max;
+ if (min === max) {
+ if (typeof this.formattersFixed[key] === 'undefined') {
+ this.formattersFixed[key] = new Intl.NumberFormat(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+
+ return this.formattersFixed[key];
+ } else if (min === 0) {
+ if (typeof this.formattersZeroBased[key] === 'undefined') {
+ this.formattersZeroBased[key] = new Intl.NumberFormat(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+
+ return this.formattersZeroBased[key];
+ } else {
+ // this is never used
+ // it is added just for completeness
+ return new Intl.NumberFormat(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+ },
+
+ // this respects locale
+ getLocaleString: function (min, max) {
+ let key = max;
+ if (min === max) {
+ if (typeof this.formattersFixed[key] === 'undefined') {
+ this.formattersFixed[key] = {
+ format: function (value) {
+ return value.toLocaleString(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+ };
+ }
+
+ return this.formattersFixed[key];
+ } else if (min === 0) {
+ if (typeof this.formattersZeroBased[key] === 'undefined') {
+ this.formattersZeroBased[key] = {
+ format: function (value) {
+ return value.toLocaleString(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+ };
+ }
+
+ return this.formattersZeroBased[key];
+ } else {
+ return {
+ format: function (value) {
+ return value.toLocaleString(undefined, {
+ // style: 'decimal',
+ // minimumIntegerDigits: 1,
+ // minimumSignificantDigits: 1,
+ // maximumSignificantDigits: 1,
+ useGrouping: true,
+ minimumFractionDigits: min,
+ maximumFractionDigits: max
+ });
+ }
+ };
+ }
+ },
+
+ // the fallback
+ getFixed: function (min, max) {
+ let key = max;
+ if (min === max) {
+ if (typeof this.formattersFixed[key] === 'undefined') {
+ this.formattersFixed[key] = {
+ format: function (value) {
+ if (value === 0) {
+ return "0";
+ }
+ return value.toFixed(max);
+ }
+ };
+ }
+
+ return this.formattersFixed[key];
+ } else if (min === 0) {
+ if (typeof this.formattersZeroBased[key] === 'undefined') {
+ this.formattersZeroBased[key] = {
+ format: function (value) {
+ if (value === 0) {
+ return "0";
+ }
+ return value.toFixed(max);
+ }
+ };
+ }
+
+ return this.formattersZeroBased[key];
+ } else {
+ return {
+ format: function (value) {
+ if (value === 0) {
+ return "0";
+ }
+ return value.toFixed(max);
+ }
+ };
+ }
+ },
+
+ testIntlNumberFormat: function () {
+ let value = 1.12345;
+ let e1 = "1.12", e2 = "1,12";
+ let s = "";
+
+ try {
+ let x = new Intl.NumberFormat(undefined, {
+ useGrouping: true,
+ minimumFractionDigits: 2,
+ maximumFractionDigits: 2
+ });
+
+ s = x.format(value);
+ } catch (e) {
+ s = "";
+ }
+
+ // console.log('NumberFormat: ', s);
+ return (s === e1 || s === e2);
+ },
+
+ testLocaleString: function () {
+ let value = 1.12345;
+ let e1 = "1.12", e2 = "1,12";
+ let s = "";
+
+ try {
+ s = value.toLocaleString(undefined, {
+ useGrouping: true,
+ minimumFractionDigits: 2,
+ maximumFractionDigits: 2
+ });
+ } catch (e) {
+ s = "";
+ }
+
+ // console.log('localeString: ', s);
+ return (s === e1 || s === e2);
+ },
+
+ // on first run we decide which formatter to use
+ get: function (min, max) {
+ if (this.testIntlNumberFormat()) {
+ // console.log('numberformat');
+ this.get = this.getIntlNumberFormat;
+ } else if (this.testLocaleString()) {
+ // console.log('localestring');
+ this.get = this.getLocaleString;
+ } else {
+ // console.log('fixed');
+ this.get = this.getFixed;
+ }
+ return this.get(min, max);
+ }
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// Detect the netdata server
+
+// http://stackoverflow.com/questions/984510/what-is-my-script-src-url
+// http://stackoverflow.com/questions/6941533/get-protocol-domain-and-port-from-url
+NETDATA._scriptSource = function () {
+ let script = null;
+
+ if (typeof document.currentScript !== 'undefined') {
+ script = document.currentScript;
+ } else {
+ const all_scripts = document.getElementsByTagName('script');
+ script = all_scripts[all_scripts.length - 1];
+ }
+
+ if (typeof script.getAttribute.length !== 'undefined') {
+ script = script.src;
+ } else {
+ script = script.getAttribute('src', -1);
+ }
+
+ return script;
+};
+
+// *** src/dashboard.js/server-detection.js
+
+if (typeof netdataServer !== 'undefined') {
+ NETDATA.serverDefault = netdataServer;
+} else {
+ let s = NETDATA._scriptSource();
+ if (s) {
+ NETDATA.serverDefault = s.replace(/\/dashboard.js(\?.*)?$/g, "");
+ } else {
+ console.log('WARNING: Cannot detect the URL of the netdata server.');
+ NETDATA.serverDefault = null;
+ }
+}
+
+if (NETDATA.serverDefault === null) {
+ NETDATA.serverDefault = '';
+} else if (NETDATA.serverDefault.slice(-1) !== '/') {
+ NETDATA.serverDefault += '/';
+}
+
+if (typeof netdataServerStatic !== 'undefined' && netdataServerStatic !== null && netdataServerStatic !== '') {
+ NETDATA.serverStatic = netdataServerStatic;
+ if (NETDATA.serverStatic.slice(-1) !== '/') {
+ NETDATA.serverStatic += '/';
+ }
+} else {
+ NETDATA.serverStatic = NETDATA.serverDefault;
+}
+
+// *** src/dashboard.js/dependencies.js
+
+// default URLs for all the external files we need
+// make them RELATIVE so that the whole thing can also be
+// installed under a web server
+NETDATA.jQuery = NETDATA.serverStatic + 'lib/jquery-2.2.4.min.js';
+NETDATA.peity_js = NETDATA.serverStatic + 'lib/jquery.peity-3.2.0.min.js';
+NETDATA.sparkline_js = NETDATA.serverStatic + 'lib/jquery.sparkline-2.1.2.min.js';
+NETDATA.easypiechart_js = NETDATA.serverStatic + 'lib/jquery.easypiechart-97b5824.min.js';
+NETDATA.gauge_js = NETDATA.serverStatic + 'lib/gauge-1.3.2.min.js';
+NETDATA.dygraph_js = NETDATA.serverStatic + 'lib/dygraph-c91c859.min.js';
+NETDATA.dygraph_smooth_js = NETDATA.serverStatic + 'lib/dygraph-smooth-plotter-c91c859.js';
+// NETDATA.raphael_js = NETDATA.serverStatic + 'lib/raphael-2.2.4-min.js';
+// NETDATA.c3_js = NETDATA.serverStatic + 'lib/c3-0.4.18.min.js';
+// NETDATA.c3_css = NETDATA.serverStatic + 'css/c3-0.4.18.min.css';
+NETDATA.d3pie_js = NETDATA.serverStatic + 'lib/d3pie-0.2.1-netdata-3.js';
+NETDATA.d3_js = NETDATA.serverStatic + 'lib/d3-4.12.2.min.js';
+// NETDATA.morris_js = NETDATA.serverStatic + 'lib/morris-0.5.1.min.js';
+// NETDATA.morris_css = NETDATA.serverStatic + 'css/morris-0.5.1.css';
+NETDATA.google_js = 'https://www.google.com/jsapi';
+// Error Handling
+
+NETDATA.errorCodes = {
+ 100: {message: "Cannot load chart library", alert: true},
+ 101: {message: "Cannot load jQuery", alert: true},
+ 402: {message: "Chart library not found", alert: false},
+ 403: {message: "Chart library not enabled/is failed", alert: false},
+ 404: {message: "Chart not found", alert: false},
+ 405: {message: "Cannot download charts index from server", alert: true},
+ 406: {message: "Invalid charts index downloaded from server", alert: true},
+ 407: {message: "Cannot HELLO netdata server", alert: false},
+ 408: {message: "Netdata servers sent invalid response to HELLO", alert: false},
+ 409: {message: "Cannot ACCESS netdata registry", alert: false},
+ 410: {message: "Netdata registry ACCESS failed", alert: false},
+ 411: {message: "Netdata registry server send invalid response to DELETE ", alert: false},
+ 412: {message: "Netdata registry DELETE failed", alert: false},
+ 413: {message: "Netdata registry server send invalid response to SWITCH ", alert: false},
+ 414: {message: "Netdata registry SWITCH failed", alert: false},
+ 415: {message: "Netdata alarms download failed", alert: false},
+ 416: {message: "Netdata alarms log download failed", alert: false},
+ 417: {message: "Netdata registry server send invalid response to SEARCH ", alert: false},
+ 418: {message: "Netdata registry SEARCH failed", alert: false}
+};
+
+NETDATA.errorLast = {
+ code: 0,
+ message: "",
+ datetime: 0
+};
+
+NETDATA.error = function (code, msg) {
+ NETDATA.errorLast.code = code;
+ NETDATA.errorLast.message = msg;
+ NETDATA.errorLast.datetime = Date.now();
+
+ console.log("ERROR " + code + ": " + NETDATA.errorCodes[code].message + ": " + msg);
+
+ let ret = true;
+ if (typeof netdataErrorCallback === 'function') {
+ ret = netdataErrorCallback('system', code, msg);
+ }
+
+ if (ret && NETDATA.errorCodes[code].alert) {
+ alert("ERROR " + code + ": " + NETDATA.errorCodes[code].message + ": " + msg);
+ }
+};
+
+NETDATA.errorReset = function () {
+ NETDATA.errorLast.code = 0;
+ NETDATA.errorLast.message = "You are doing fine!";
+ NETDATA.errorLast.datetime = 0;
+};
+// *** src/dashboard.js/compatibility.js
+
+// Compatibility fixes.
+
+// fix IE issue with console
+if (!window.console) {
+ window.console = {
+ log: function () {
+ }
+ };
+}
+
+// if string.endsWith is not defined, define it
+if (typeof String.prototype.endsWith !== 'function') {
+ String.prototype.endsWith = function (s) {
+ if (s.length > this.length) {
+ return false;
+ }
+ return this.slice(-s.length) === s;
+ };
+}
+
+// if string.startsWith is not defined, define it
+if (typeof String.prototype.startsWith !== 'function') {
+ String.prototype.startsWith = function (s) {
+ if (s.length > this.length) {
+ return false;
+ }
+ return this.slice(s.length) === s;
+ };
+}
+// ----------------------------------------------------------------------------------------------------------------
+// XSS checks
+
+NETDATA.xss = {
+ enabled: (typeof netdataCheckXSS === 'undefined') ? false : netdataCheckXSS,
+ enabled_for_data: (typeof netdataCheckXSS === 'undefined') ? false : netdataCheckXSS,
+
+ string: function (s) {
+ return s.toString()
+ .replace(/</g, '<')
+ .replace(/>/g, '>')
+ .replace(/"/g, '"')
+ .replace(/'/g, ''');
+ },
+
+ object: function (name, obj, ignore_regex) {
+ if (typeof ignore_regex !== 'undefined' && ignore_regex.test(name)) {
+ // console.log('XSS: ignoring "' + name + '"');
+ return obj;
+ }
+
+ switch (typeof(obj)) {
+ case 'string':
+ const ret = this.string(obj);
+ if (ret !== obj) {
+ console.log('XSS protection changed string ' + name + ' from "' + obj + '" to "' + ret + '"');
+ }
+ return ret;
+
+ case 'object':
+ if (obj === null) {
+ return obj;
+ }
+
+ if (Array.isArray(obj)) {
+ // console.log('checking array "' + name + '"');
+
+ let len = obj.length;
+ while (len--) {
+ obj[len] = this.object(name + '[' + len + ']', obj[len], ignore_regex);
+ }
+ } else {
+ // console.log('checking object "' + name + '"');
+
+ for (var i in obj) {
+ if (obj.hasOwnProperty(i) === false) {
+ continue;
+ }
+ if (this.string(i) !== i) {
+ console.log('XSS protection removed invalid object member "' + name + '.' + i + '"');
+ delete obj[i];
+ } else {
+ obj[i] = this.object(name + '.' + i, obj[i], ignore_regex);
+ }
+ }
+ }
+ return obj;
+
+ default:
+ return obj;
+ }
+ },
+
+ checkOptional: function (name, obj, ignore_regex) {
+ if (this.enabled) {
+ //console.log('XSS: checking optional "' + name + '"...');
+ return this.object(name, obj, ignore_regex);
+ }
+ return obj;
+ },
+
+ checkAlways: function (name, obj, ignore_regex) {
+ //console.log('XSS: checking always "' + name + '"...');
+ return this.object(name, obj, ignore_regex);
+ },
+
+ checkData: function (name, obj, ignore_regex) {
+ if (this.enabled_for_data) {
+ //console.log('XSS: checking data "' + name + '"...');
+ return this.object(name, obj, ignore_regex);
+ }
+ return obj;
+ }
+};
+NETDATA.colorHex2Rgb = function (hex) {
+ // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
+ let shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
+ hex = hex.replace(shorthandRegex, function (m, r, g, b) {
+ return r + r + g + g + b + b;
+ });
+
+ let result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+ return result ? {
+ r: parseInt(result[1], 16),
+ g: parseInt(result[2], 16),
+ b: parseInt(result[3], 16)
+ } : null;
+};
+
+NETDATA.colorLuminance = function (hex, lum) {
+ // validate hex string
+ hex = String(hex).replace(/[^0-9a-f]/gi, '');
+ if (hex.length < 6) {
+ hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+ }
+
+ lum = lum || 0;
+
+ // convert to decimal and change luminosity
+ let rgb = "#";
+ for (let i = 0; i < 3; i++) {
+ let c = parseInt(hex.substr(i * 2, 2), 16);
+ c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
+ rgb += ("00" + c).substr(c.length);
+ }
+
+ return rgb;
+};
+NETDATA.unitsConversion = {
+ keys: {}, // keys for data-common-units
+ latest: {}, // latest selected units for data-common-units
+
+ globalReset: function () {
+ this.keys = {};
+ this.latest = {};
+ },
+
+ scalableUnits: {
+ 'packets/s': {
+ 'pps': 1,
+ 'Kpps': 1000,
+ 'Mpps': 1000000
+ },
+ 'pps': {
+ 'pps': 1,
+ 'Kpps': 1000,
+ 'Mpps': 1000000
+ },
+ 'kilobits/s': {
+ 'bits/s': 1 / 1000,
+ 'kilobits/s': 1,
+ 'megabits/s': 1000,
+ 'gigabits/s': 1000000,
+ 'terabits/s': 1000000000
+ },
+ 'bytes/s': {
+ 'bytes/s': 1,
+ 'kilobytes/s': 1024,
+ 'megabytes/s': 1024 * 1024,
+ 'gigabytes/s': 1024 * 1024 * 1024,
+ 'terabytes/s': 1024 * 1024 * 1024 * 1024
+ },
+ 'kilobytes/s': {
+ 'bytes/s': 1 / 1024,
+ 'kilobytes/s': 1,
+ 'megabytes/s': 1024,
+ 'gigabytes/s': 1024 * 1024,
+ 'terabytes/s': 1024 * 1024 * 1024
+ },
+ 'B/s': {
+ 'B/s': 1,
+ 'KiB/s': 1024,
+ 'MiB/s': 1024 * 1024,
+ 'GiB/s': 1024 * 1024 * 1024,
+ 'TiB/s': 1024 * 1024 * 1024 * 1024
+ },
+ 'KB/s': {
+ 'B/s': 1 / 1024,
+ 'KB/s': 1,
+ 'MB/s': 1024,
+ 'GB/s': 1024 * 1024,
+ 'TB/s': 1024 * 1024 * 1024
+ },
+ 'KiB/s': {
+ 'B/s': 1 / 1024,
+ 'KiB/s': 1,
+ 'MiB/s': 1024,
+ 'GiB/s': 1024 * 1024,
+ 'TiB/s': 1024 * 1024 * 1024
+ },
+ 'B': {
+ 'B': 1,
+ 'KiB': 1024,
+ 'MiB': 1024 * 1024,
+ 'GiB': 1024 * 1024 * 1024,
+ 'TiB': 1024 * 1024 * 1024 * 1024,
+ 'PiB': 1024 * 1024 * 1024 * 1024 * 1024
+ },
+ 'KB': {
+ 'B': 1 / 1024,
+ 'KB': 1,
+ 'MB': 1024,
+ 'GB': 1024 * 1024,
+ 'TB': 1024 * 1024 * 1024
+ },
+ 'KiB': {
+ 'B': 1 / 1024,
+ 'KiB': 1,
+ 'MiB': 1024,
+ 'GiB': 1024 * 1024,
+ 'TiB': 1024 * 1024 * 1024
+ },
+ 'MB': {
+ 'B': 1 / (1024 * 1024),
+ 'KB': 1 / 1024,
+ 'MB': 1,
+ 'GB': 1024,
+ 'TB': 1024 * 1024,
+ 'PB': 1024 * 1024 * 1024
+ },
+ 'MiB': {
+ 'B': 1 / (1024 * 1024),
+ 'KiB': 1 / 1024,
+ 'MiB': 1,
+ 'GiB': 1024,
+ 'TiB': 1024 * 1024,
+ 'PiB': 1024 * 1024 * 1024
+ },
+ 'GB': {
+ 'B': 1 / (1024 * 1024 * 1024),
+ 'KB': 1 / (1024 * 1024),
+ 'MB': 1 / 1024,
+ 'GB': 1,
+ 'TB': 1024,
+ 'PB': 1024 * 1024,
+ 'EB': 1024 * 1024 * 1024
+ },
+ 'GiB': {
+ 'B': 1 / (1024 * 1024 * 1024),
+ 'KiB': 1 / (1024 * 1024),
+ 'MiB': 1 / 1024,
+ 'GiB': 1,
+ 'TiB': 1024,
+ 'PiB': 1024 * 1024,
+ 'EiB': 1024 * 1024 * 1024
+ },
+ 'num': {
+ 'num': 1,
+ 'num (K)': 1000,
+ 'num (M)': 1000000,
+ 'num (G)': 1000000000,
+ 'num (T)': 1000000000000
+ }
+ /*
+ 'milliseconds': {
+ 'seconds': 1000
+ },
+ 'seconds': {
+ 'milliseconds': 0.001,
+ 'seconds': 1,
+ 'minutes': 60,
+ 'hours': 3600,
+ 'days': 86400
+ }
+ */
+ },
+
+ convertibleUnits: {
+ 'Celsius': {
+ 'Fahrenheit': {
+ check: function (max) {
+ void(max);
+ return NETDATA.options.current.temperature === 'fahrenheit';
+ },
+ convert: function (value) {
+ return value * 9 / 5 + 32;
+ }
+ }
+ },
+ 'celsius': {
+ 'fahrenheit': {
+ check: function (max) {
+ void(max);
+ return NETDATA.options.current.temperature === 'fahrenheit';
+ },
+ convert: function (value) {
+ return value * 9 / 5 + 32;
+ }
+ }
+ },
+ 'seconds': {
+ 'time': {
+ check: function (max) {
+ void(max);
+ return NETDATA.options.current.seconds_as_time;
+ },
+ convert: function (seconds) {
+ return NETDATA.unitsConversion.seconds2time(seconds);
+ }
+ }
+ },
+ 'milliseconds': {
+ 'milliseconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time && max < 1000;
+ },
+ convert: function (milliseconds) {
+ let tms = Math.round(milliseconds * 10);
+ milliseconds = Math.floor(tms / 10);
+
+ tms -= milliseconds * 10;
+
+ return (milliseconds).toString() + '.' + tms.toString();
+ }
+ },
+ 'seconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time && max >= 1000 && max < 60000;
+ },
+ convert: function (milliseconds) {
+ milliseconds = Math.round(milliseconds);
+
+ let seconds = Math.floor(milliseconds / 1000);
+ milliseconds -= seconds * 1000;
+
+ milliseconds = Math.round(milliseconds / 10);
+
+ return seconds.toString() + '.'
+ + NETDATA.zeropad(milliseconds);
+ }
+ },
+ 'M:SS.ms': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time && max >= 60000;
+ },
+ convert: function (milliseconds) {
+ milliseconds = Math.round(milliseconds);
+
+ let minutes = Math.floor(milliseconds / 60000);
+ milliseconds -= minutes * 60000;
+
+ let seconds = Math.floor(milliseconds / 1000);
+ milliseconds -= seconds * 1000;
+
+ milliseconds = Math.round(milliseconds / 10);
+
+ return minutes.toString() + ':'
+ + NETDATA.zeropad(seconds) + '.'
+ + NETDATA.zeropad(milliseconds);
+ }
+ }
+ },
+ 'nanoseconds': {
+ 'nanoseconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time && max < 1000;
+ },
+ convert: function (nanoseconds) {
+ let tms = Math.round(nanoseconds * 10);
+ nanoseconds = Math.floor(tms / 10);
+
+ tms -= nanoseconds * 10;
+
+ return (nanoseconds).toString() + '.' + tms.toString();
+ }
+ },
+ 'microseconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time
+ && max >= 1000 && max < 1000 * 1000;
+ },
+ convert: function (nanoseconds) {
+ nanoseconds = Math.round(nanoseconds);
+
+ let microseconds = Math.floor(nanoseconds / 1000);
+ nanoseconds -= microseconds * 1000;
+
+ nanoseconds = Math.round(nanoseconds / 10 );
+
+ return microseconds.toString() + '.'
+ + NETDATA.zeropad(nanoseconds);
+ }
+ },
+ 'milliseconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time
+ && max >= 1000 * 1000 && max < 1000 * 1000 * 1000;
+ },
+ convert: function (nanoseconds) {
+ nanoseconds = Math.round(nanoseconds);
+
+ let milliseconds = Math.floor(nanoseconds / 1000 / 1000);
+ nanoseconds -= milliseconds * 1000 * 1000;
+
+ nanoseconds = Math.round(nanoseconds / 1000 / 10);
+
+ return milliseconds.toString() + '.'
+ + NETDATA.zeropad(nanoseconds);
+ }
+ },
+ 'seconds': {
+ check: function (max) {
+ return NETDATA.options.current.seconds_as_time
+ && max >= 1000 * 1000 * 1000;
+ },
+ convert: function (nanoseconds) {
+ nanoseconds = Math.round(nanoseconds);
+
+ let seconds = Math.floor(nanoseconds / 1000 / 1000 / 1000);
+ nanoseconds -= seconds * 1000 * 1000 * 1000;
+
+ nanoseconds = Math.round(nanoseconds / 1000 / 1000 / 10);
+
+ return seconds.toString() + '.'
+ + NETDATA.zeropad(nanoseconds);
+ }
+ },
+ }
+ },
+
+ seconds2time: function (seconds) {
+ seconds = Math.abs(seconds);
+
+ let days = Math.floor(seconds / 86400);
+ seconds -= days * 86400;
+
+ let hours = Math.floor(seconds / 3600);
+ seconds -= hours * 3600;
+
+ let minutes = Math.floor(seconds / 60);
+ seconds -= minutes * 60;
+
+ seconds = Math.round(seconds);
+
+ let ms_txt = '';
+ /*
+ let ms = seconds - Math.floor(seconds);
+ seconds -= ms;
+ ms = Math.round(ms * 1000);
+
+ if (ms > 1) {
+ if (ms < 10)
+ ms_txt = '.00' + ms.toString();
+ else if (ms < 100)
+ ms_txt = '.0' + ms.toString();
+ else
+ ms_txt = '.' + ms.toString();
+ }
+ */
+
+ return ((days > 0) ? days.toString() + 'd:' : '').toString()
+ + NETDATA.zeropad(hours) + ':'
+ + NETDATA.zeropad(minutes) + ':'
+ + NETDATA.zeropad(seconds)
+ + ms_txt;
+ },
+
+ // get a function that converts the units
+ // + every time units are switched call the callback
+ get: function (uuid, min, max, units, desired_units, common_units_name, switch_units_callback) {
+ // validate the parameters
+ if (typeof units === 'undefined') {
+ units = 'undefined';
+ }
+
+ // check if we support units conversion
+ if (typeof this.scalableUnits[units] === 'undefined' && typeof this.convertibleUnits[units] === 'undefined') {
+ // we can't convert these units
+ //console.log('DEBUG: ' + uuid.toString() + ' can\'t convert units: ' + units.toString());
+ return function (value) {
+ return value;
+ };
+ }
+
+ // check if the caller wants the original units
+ if (typeof desired_units === 'undefined' || desired_units === null || desired_units === 'original' || desired_units === units) {
+ //console.log('DEBUG: ' + uuid.toString() + ' original units wanted');
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+
+ // now we know we can convert the units
+ // and the caller wants some kind of conversion
+
+ let tunits = null;
+ let tdivider = 0;
+
+ if (typeof this.scalableUnits[units] !== 'undefined') {
+ // units that can be scaled
+ // we decide a divider
+
+ // console.log('NETDATA.unitsConversion.get(' + units.toString() + ', ' + desired_units.toString() + ', function()) decide divider with min = ' + min.toString() + ', max = ' + max.toString());
+
+ if (desired_units === 'auto') {
+ // the caller wants to auto-scale the units
+
+ // find the absolute maximum value that is rendered on the chart
+ // based on this we decide the scale
+ min = Math.abs(min);
+ max = Math.abs(max);
+ if (min > max) {
+ max = min;
+ }
+
+ // find the smallest scale that provides integers
+ // for (x in this.scalableUnits[units]) {
+ // if (this.scalableUnits[units].hasOwnProperty(x)) {
+ // let m = this.scalableUnits[units][x];
+ // if (m <= max && m > tdivider) {
+ // tunits = x;
+ // tdivider = m;
+ // }
+ // }
+ // }
+ const sunit = this.scalableUnits[units];
+ for (var x of Object.keys(sunit)) {
+ let m = sunit[x];
+ if (m <= max && m > tdivider) {
+ tunits = x;
+ tdivider = m;
+ }
+ }
+
+ if (tunits === null || tdivider <= 0) {
+ // we couldn't find one
+ //console.log('DEBUG: ' + uuid.toString() + ' cannot find an auto-scaling candidate for units: ' + units.toString() + ' (max: ' + max.toString() + ')');
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+
+ if (typeof common_units_name === 'string' && typeof uuid === 'string') {
+ // the caller wants several charts to have the same units
+ // data-common-units
+
+ let common_units_key = common_units_name + '-' + units;
+
+ // add our divider into the list of keys
+ let t = this.keys[common_units_key];
+ if (typeof t === 'undefined') {
+ this.keys[common_units_key] = {};
+ t = this.keys[common_units_key];
+ }
+ t[uuid] = {
+ units: tunits,
+ divider: tdivider
+ };
+
+ // find the max divider of all charts
+ let common_units = t[uuid];
+ for (var x in t) {
+ if (t.hasOwnProperty(x) && t[x].divider > common_units.divider) {
+ common_units = t[x];
+ }
+ }
+
+ // save our common_max to the latest keys
+ let latest = this.latest[common_units_key];
+ if (typeof latest === 'undefined') {
+ this.latest[common_units_key] = {};
+ latest = this.latest[common_units_key];
+ }
+ latest.units = common_units.units;
+ latest.divider = common_units.divider;
+
+ tunits = latest.units;
+ tdivider = latest.divider;
+
+ //console.log('DEBUG: ' + uuid.toString() + ' converted units: ' + units.toString() + ' to units: ' + tunits.toString() + ' with divider ' + tdivider.toString() + ', common-units=' + common_units_name.toString() + ((t[uuid].divider !== tdivider)?' USED COMMON, mine was ' + t[uuid].units:' set common').toString());
+
+ // apply it to this chart
+ switch_units_callback(tunits);
+ return function (value) {
+ if (tdivider !== latest.divider) {
+ // another chart switched our common units
+ // we should switch them too
+ //console.log('DEBUG: ' + uuid + ' switching units due to a common-units change, from ' + tunits.toString() + ' to ' + latest.units.toString());
+ tunits = latest.units;
+ tdivider = latest.divider;
+ switch_units_callback(tunits);
+ }
+
+ return value / tdivider;
+ };
+ } else {
+ // the caller did not give data-common-units
+ // this chart auto-scales independently of all others
+ //console.log('DEBUG: ' + uuid.toString() + ' converted units: ' + units.toString() + ' to units: ' + tunits.toString() + ' with divider ' + tdivider.toString() + ', autonomously');
+
+ switch_units_callback(tunits);
+ return function (value) {
+ return value / tdivider;
+ };
+ }
+ } else {
+ // the caller wants specific units
+
+ if (typeof this.scalableUnits[units][desired_units] !== 'undefined') {
+ // all good, set the new units
+ tdivider = this.scalableUnits[units][desired_units];
+ // console.log('DEBUG: ' + uuid.toString() + ' converted units: ' + units.toString() + ' to units: ' + desired_units.toString() + ' with divider ' + tdivider.toString() + ', by reference');
+ switch_units_callback(desired_units);
+ return function (value) {
+ return value / tdivider;
+ };
+ } else {
+ // oops! switch back to original units
+ console.log('Units conversion from ' + units.toString() + ' to ' + desired_units.toString() + ' is not supported.');
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+ }
+ } else if (typeof this.convertibleUnits[units] !== 'undefined') {
+ // units that can be converted
+ if (desired_units === 'auto') {
+ for (var x in this.convertibleUnits[units]) {
+ if (this.convertibleUnits[units].hasOwnProperty(x)) {
+ if (this.convertibleUnits[units][x].check(max)) {
+ //console.log('DEBUG: ' + uuid.toString() + ' converting ' + units.toString() + ' to: ' + x.toString());
+ switch_units_callback(x);
+ return this.convertibleUnits[units][x].convert;
+ }
+ }
+ }
+
+ // none checked ok
+ //console.log('DEBUG: ' + uuid.toString() + ' no conversion available for ' + units.toString() + ' to: ' + desired_units.toString());
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ } else if (typeof this.convertibleUnits[units][desired_units] !== 'undefined') {
+ switch_units_callback(desired_units);
+ return this.convertibleUnits[units][desired_units].convert;
+ } else {
+ console.log('Units conversion from ' + units.toString() + ' to ' + desired_units.toString() + ' is not supported.');
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+ } else {
+ // hm... did we forget to implement the new type?
+ console.log(`Unmatched unit conversion method for units ${units.toString()}`);
+ switch_units_callback(units);
+ return function (value) {
+ return value;
+ };
+ }
+ }
+};
+
+NETDATA.icons = {
+ left: '<i class="fas fa-backward"></i>',
+ reset: '<i class="fas fa-play"></i>',
+ right: '<i class="fas fa-forward"></i>',
+ zoomIn: '<i class="fas fa-plus"></i>',
+ zoomOut: '<i class="fas fa-minus"></i>',
+ resize: '<i class="fas fa-sort"></i>',
+ lineChart: '<i class="fas fa-chart-line"></i>',
+ areaChart: '<i class="fas fa-chart-area"></i>',
+ noChart: '<i class="fas fa-chart-area"></i>',
+ loading: '<i class="fas fa-sync-alt"></i>',
+ noData: '<i class="fas fa-exclamation-triangle"></i>'
+};
+
+if (typeof netdataIcons === 'object') {
+ // for (let icon in NETDATA.icons) {
+ // if (NETDATA.icons.hasOwnProperty(icon) && typeof(netdataIcons[icon]) === 'string')
+ // NETDATA.icons[icon] = netdataIcons[icon];
+ // }
+ for (var icon of Object.keys(NETDATA.icons)) {
+ if (typeof(netdataIcons[icon]) === 'string') {
+ NETDATA.icons[icon] = netdataIcons[icon]
+ }
+ }
+}
+
+if (typeof netdataSnapshotData === 'undefined') {
+ netdataSnapshotData = null;
+}
+
+if (typeof netdataShowHelp === 'undefined') {
+ netdataShowHelp = true;
+}
+
+if (typeof netdataShowAlarms === 'undefined') {
+ netdataShowAlarms = false;
+}
+
+if (typeof netdataRegistryAfterMs !== 'number' || netdataRegistryAfterMs < 0) {
+ netdataRegistryAfterMs = 0; // 1500;
+}
+
+if (typeof netdataRegistry === 'undefined') {
+ // backward compatibility
+ netdataRegistry = (typeof netdataNoRegistry !== 'undefined' && netdataNoRegistry === false);
+}
+
+if (netdataRegistry === false && typeof netdataRegistryCallback === 'function') {
+ netdataRegistry = true;
+}
+
+// ----------------------------------------------------------------------------------------------------------------
+// the defaults for all charts
+
+// if the user does not specify any of these, the following will be used
+
+NETDATA.chartDefaults = {
+ width: '100%', // the chart width - can be null
+ height: '100%', // the chart height - can be null
+ min_width: null, // the chart minimum width - can be null
+ library: 'dygraph', // the graphing library to use
+ method: 'average', // the grouping method
+ before: 0, // panning
+ after: -600, // panning
+ pixels_per_point: 1, // the detail of the chart
+ fill_luminance: 0.8 // luminance of colors in solid areas
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// global options
+
+NETDATA.options = {
+ pauseCallback: null, // a callback when we are really paused
+
+ pause: false, // when enabled we don't auto-refresh the charts
+
+ targets: [], // an array of all the state objects that are
+ // currently active (independently of their
+ // viewport visibility)
+
+ updated_dom: true, // when true, the DOM has been updated with
+ // new elements we have to check.
+
+ auto_refresher_fast_weight: 0, // this is the current time in ms, spent
+ // rendering charts continuously.
+ // used with .current.fast_render_timeframe
+
+ page_is_visible: true, // when true, this page is visible
+
+ auto_refresher_stop_until: 0, // timestamp in ms - used internally, to stop the
+ // auto-refresher for some time (when a chart is
+ // performing pan or zoom, we need to stop refreshing
+ // all other charts, to have the maximum speed for
+ // rendering the chart that is panned or zoomed).
+ // Used with .current.global_pan_sync_time
+
+ on_scroll_refresher_stop_until: 0, // timestamp in ms - used to stop evaluating
+ // charts for some time, after a page scroll
+
+ last_page_resize: Date.now(), // the timestamp of the last resize request
+
+ last_page_scroll: 0, // the timestamp the last time the page was scrolled
+
+ browser_timezone: 'unknown', // timezone detected by javascript
+ server_timezone: 'unknown', // timezone reported by the server
+
+ force_data_points: 0, // force the number of points to be returned for charts
+ fake_chart_rendering: false, // when set to true, the dashboard will download data but will not render the charts
+
+ passive_events: null, // true if the browser supports passive events
+
+ // the current profile
+ // we may have many...
+ current: {
+ units: 'auto', // can be 'auto' or 'original'
+ temperature: 'celsius', // can be 'celsius' or 'fahrenheit'
+ seconds_as_time: true, // show seconds as DDd:HH:MM:SS ?
+ timezone: 'default', // the timezone to use, or 'default'
+ user_set_server_timezone: 'default', // as set by the user on the dashboard
+
+ legend_toolbox: true, // show the legend toolbox on charts
+ resize_charts: true, // show the resize handler on charts
+
+ pixels_per_point: isSlowDevice() ? 5 : 1, // the minimum pixels per point for all charts
+ // increase this to speed javascript up
+ // each chart library has its own limit too
+ // the max of this and the chart library is used
+ // the final is calculated every time, so a change
+ // here will have immediate effect on the next chart
+ // update
+
+ idle_between_charts: 100, // ms - how much time to wait between chart updates
+
+ fast_render_timeframe: 200, // ms - render continuously until this time of continuous
+ // rendering has been reached
+ // this setting is used to make it render e.g. 10
+ // charts at once, sleep idle_between_charts time
+ // and continue for another 10 charts.
+
+ idle_between_loops: 500, // ms - if all charts have been updated, wait this
+ // time before starting again.
+
+ idle_parallel_loops: 100, // ms - the time between parallel refresher updates
+
+ idle_lost_focus: 500, // ms - when the window does not have focus, check
+ // if focus has been regained, every this time
+
+ global_pan_sync_time: 300, // ms - when you pan or zoom a chart, the background
+ // auto-refreshing of charts is paused for this amount
+ // of time
+
+ sync_selection_delay: 400, // ms - when you pan or zoom a chart, wait this amount
+ // of time before setting up synchronized selections
+ // on hover.
+
+ sync_selection: true, // enable or disable selection sync
+
+ pan_and_zoom_delay: 50, // when panning or zooming, how ofter to update the chart
+
+ sync_pan_and_zoom: true, // enable or disable pan and zoom sync
+
+ pan_and_zoom_data_padding: true, // fetch more data for the master chart when panning or zooming
+
+ update_only_visible: true, // enable or disable visibility management / used for printing
+
+ parallel_refresher: !isSlowDevice(), // enable parallel refresh of charts
+
+ concurrent_refreshes: true, // when parallel_refresher is enabled, sync also the charts
+
+ destroy_on_hide: isSlowDevice(), // destroy charts when they are not visible
+
+ show_help: netdataShowHelp, // when enabled the charts will show some help
+ show_help_delay_show_ms: 500,
+ show_help_delay_hide_ms: 0,
+
+ eliminate_zero_dimensions: true, // do not show dimensions with just zeros
+
+ stop_updates_when_focus_is_lost: true, // boolean - shall we stop auto-refreshes when document does not have user focus
+ stop_updates_while_resizing: 1000, // ms - time to stop auto-refreshes while resizing the charts
+
+ double_click_speed: 500, // ms - time between clicks / taps to detect double click/tap
+
+ smooth_plot: !isSlowDevice(), // enable smooth plot, where possible
+
+ color_fill_opacity_line: 1.0,
+ color_fill_opacity_area: 0.2,
+ color_fill_opacity_stacked: 0.8,
+
+ pan_and_zoom_factor: 0.25, // the increment when panning and zooming with the toolbox
+ pan_and_zoom_factor_multiplier_control: 2.0,
+ pan_and_zoom_factor_multiplier_shift: 3.0,
+ pan_and_zoom_factor_multiplier_alt: 4.0,
+
+ abort_ajax_on_scroll: false, // kill pending ajax page scroll
+ async_on_scroll: false, // sync/async onscroll handler
+ onscroll_worker_duration_threshold: 30, // time in ms, for async scroll handler
+
+ retries_on_data_failures: 3, // how many retries to make if we can't fetch chart data from the server
+
+ setOptionCallback: function () {
+ }
+ },
+
+ debug: {
+ show_boxes: false,
+ main_loop: false,
+ focus: false,
+ visibility: false,
+ chart_data_url: false,
+ chart_errors: true, // remember to set it to false before merging
+ chart_timing: false,
+ chart_calls: false,
+ libraries: false,
+ dygraph: false,
+ globalSelectionSync: false,
+ globalPanAndZoom: false
+ }
+};
+
+NETDATA.statistics = {
+ refreshes_total: 0,
+ refreshes_active: 0,
+ refreshes_active_max: 0
+};
+
+// local storage options
+
+NETDATA.localStorage = {
+ default: {},
+ current: {},
+ callback: {} // only used for resetting back to defaults
+};
+
+NETDATA.localStorageTested = -1;
+NETDATA.localStorageTest = function () {
+ if (NETDATA.localStorageTested !== -1) {
+ return NETDATA.localStorageTested;
+ }
+
+ if (typeof Storage !== "undefined" && typeof localStorage === 'object') {
+ let test = 'test';
+ try {
+ localStorage.setItem(test, test);
+ localStorage.removeItem(test);
+ NETDATA.localStorageTested = true;
+ } catch (e) {
+ NETDATA.localStorageTested = false;
+ }
+ } else {
+ NETDATA.localStorageTested = false;
+ }
+
+ return NETDATA.localStorageTested;
+};
+
+NETDATA.localStorageGet = function (key, def, callback) {
+ let ret = def;
+
+ if (typeof NETDATA.localStorage.default[key.toString()] === 'undefined') {
+ NETDATA.localStorage.default[key.toString()] = def;
+ NETDATA.localStorage.callback[key.toString()] = callback;
+ }
+
+ if (NETDATA.localStorageTest()) {
+ try {
+ // console.log('localStorage: loading "' + key.toString() + '"');
+ ret = localStorage.getItem(key.toString());
+ // console.log('netdata loaded: ' + key.toString() + ' = ' + ret.toString());
+ if (ret === null || ret === 'undefined') {
+ // console.log('localStorage: cannot load it, saving "' + key.toString() + '" with value "' + JSON.stringify(def) + '"');
+ localStorage.setItem(key.toString(), JSON.stringify(def));
+ ret = def;
+ } else {
+ // console.log('localStorage: got "' + key.toString() + '" with value "' + ret + '"');
+ ret = JSON.parse(ret);
+ // console.log('localStorage: loaded "' + key.toString() + '" as value ' + ret + ' of type ' + typeof(ret));
+ }
+ } catch (error) {
+ console.log('localStorage: failed to read "' + key.toString() + '", using default: "' + def.toString() + '"');
+ ret = def;
+ }
+ }
+
+ if (typeof ret === 'undefined' || ret === 'undefined') {
+ console.log('localStorage: LOADED UNDEFINED "' + key.toString() + '" as value ' + ret + ' of type ' + typeof(ret));
+ ret = def;
+ }
+
+ NETDATA.localStorage.current[key.toString()] = ret;
+ return ret;
+};
+
+NETDATA.localStorageSet = function (key, value, callback) {
+ if (typeof value === 'undefined' || value === 'undefined') {
+ console.log('localStorage: ATTEMPT TO SET UNDEFINED "' + key.toString() + '" as value ' + value + ' of type ' + typeof(value));
+ }
+
+ if (typeof NETDATA.localStorage.default[key.toString()] === 'undefined') {
+ NETDATA.localStorage.default[key.toString()] = value;
+ NETDATA.localStorage.current[key.toString()] = value;
+ NETDATA.localStorage.callback[key.toString()] = callback;
+ }
+
+ if (NETDATA.localStorageTest()) {
+ // console.log('localStorage: saving "' + key.toString() + '" with value "' + JSON.stringify(value) + '"');
+ try {
+ localStorage.setItem(key.toString(), JSON.stringify(value));
+ } catch (e) {
+ console.log('localStorage: failed to save "' + key.toString() + '" with value: "' + value.toString() + '"');
+ }
+ }
+
+ NETDATA.localStorage.current[key.toString()] = value;
+ return value;
+};
+
+NETDATA.localStorageGetRecursive = function (obj, prefix, callback) {
+ let keys = Object.keys(obj);
+ let len = keys.length;
+ while (len--) {
+ let i = keys[len];
+
+ if (typeof obj[i] === 'object') {
+ //console.log('object ' + prefix + '.' + i.toString());
+ NETDATA.localStorageGetRecursive(obj[i], prefix + '.' + i.toString(), callback);
+ continue;
+ }
+
+ obj[i] = NETDATA.localStorageGet(prefix + '.' + i.toString(), obj[i], callback);
+ }
+};
+
+NETDATA.setOption = function (key, value) {
+ if (key.toString() === 'setOptionCallback') {
+ if (typeof NETDATA.options.current.setOptionCallback === 'function') {
+ NETDATA.options.current[key.toString()] = value;
+ NETDATA.options.current.setOptionCallback();
+ }
+ } else if (NETDATA.options.current[key.toString()] !== value) {
+ let name = 'options.' + key.toString();
+
+ if (typeof NETDATA.localStorage.default[name.toString()] === 'undefined') {
+ console.log('localStorage: setOption() on unsaved option: "' + name.toString() + '", value: ' + value);
+ }
+
+ //console.log(NETDATA.localStorage);
+ //console.log('setOption: setting "' + key.toString() + '" to "' + value + '" of type ' + typeof(value) + ' original type ' + typeof(NETDATA.options.current[key.toString()]));
+ //console.log(NETDATA.options);
+ NETDATA.options.current[key.toString()] = NETDATA.localStorageSet(name.toString(), value, null);
+
+ if (typeof NETDATA.options.current.setOptionCallback === 'function') {
+ NETDATA.options.current.setOptionCallback();
+ }
+ }
+
+ return true;
+};
+
+NETDATA.getOption = function (key) {
+ return NETDATA.options.current[key.toString()];
+};
+
+// read settings from local storage
+NETDATA.localStorageGetRecursive(NETDATA.options.current, 'options', null);
+
+// always start with this option enabled.
+NETDATA.setOption('stop_updates_when_focus_is_lost', true);
+
+NETDATA.resetOptions = function () {
+ let keys = Object.keys(NETDATA.localStorage.default);
+ let len = keys.length;
+
+ while (len--) {
+ let i = keys[len];
+ let a = i.split('.');
+
+ if (a[0] === 'options') {
+ if (a[1] === 'setOptionCallback') {
+ continue;
+ }
+ if (typeof NETDATA.localStorage.default[i] === 'undefined') {
+ continue;
+ }
+ if (NETDATA.options.current[i] === NETDATA.localStorage.default[i]) {
+ continue;
+ }
+
+ NETDATA.setOption(a[1], NETDATA.localStorage.default[i]);
+ } else if (a[0] === 'chart_heights') {
+ if (typeof NETDATA.localStorage.callback[i] === 'function' && typeof NETDATA.localStorage.default[i] !== 'undefined') {
+ NETDATA.localStorage.callback[i](NETDATA.localStorage.default[i]);
+ }
+ }
+ }
+
+ NETDATA.dateTime.init(NETDATA.options.current.timezone);
+};
+
+// *** src/dashboard.js/timeout.js
+
+// TODO: Better name needed
+
+NETDATA.timeout = {
+ // by default, these are just wrappers to setTimeout() / clearTimeout()
+
+ step: function (callback) {
+ return window.setTimeout(callback, 1000 / 60);
+ },
+
+ set: function (callback, delay) {
+ return window.setTimeout(callback, delay);
+ },
+
+ clear: function (id) {
+ return window.clearTimeout(id);
+ },
+
+ init: function () {
+ let custom = true;
+
+ if (window.requestAnimationFrame) {
+ this.step = function (callback) {
+ return window.requestAnimationFrame(callback);
+ };
+
+ this.clear = function (handle) {
+ return window.cancelAnimationFrame(handle.value);
+ };
+ // } else if (window.webkitRequestAnimationFrame) {
+ // this.step = function (callback) {
+ // return window.webkitRequestAnimationFrame(callback);
+ // };
+
+ // if (window.webkitCancelAnimationFrame) {
+ // this.clear = function (handle) {
+ // return window.webkitCancelAnimationFrame(handle.value);
+ // };
+ // } else if (window.webkitCancelRequestAnimationFrame) {
+ // this.clear = function (handle) {
+ // return window.webkitCancelRequestAnimationFrame(handle.value);
+ // };
+ // }
+ // } else if (window.mozRequestAnimationFrame) {
+ // this.step = function (callback) {
+ // return window.mozRequestAnimationFrame(callback);
+ // };
+
+ // this.clear = function (handle) {
+ // return window.mozCancelRequestAnimationFrame(handle.value);
+ // };
+ // } else if (window.oRequestAnimationFrame) {
+ // this.step = function (callback) {
+ // return window.oRequestAnimationFrame(callback);
+ // };
+
+ // this.clear = function (handle) {
+ // return window.oCancelRequestAnimationFrame(handle.value);
+ // };
+ // } else if (window.msRequestAnimationFrame) {
+ // this.step = function (callback) {
+ // return window.msRequestAnimationFrame(callback);
+ // };
+
+ // this.clear = function (handle) {
+ // return window.msCancelRequestAnimationFrame(handle.value);
+ // };
+ } else {
+ custom = false;
+ }
+
+ if (custom) {
+ // we have installed custom .step() / .clear() functions
+ // overwrite the .set() too
+
+ this.set = function (callback, delay) {
+ let start = Date.now(),
+ handle = new Object();
+
+ const loop = () => {
+ let current = Date.now(),
+ delta = current - start;
+
+ if (delta >= delay) {
+ callback.call();
+ } else {
+ handle.value = this.step(loop);
+ }
+ }
+
+ handle.value = this.step(loop);
+ return handle;
+ };
+ }
+ }
+};
+
+NETDATA.timeout.init();
+// Codacy declarations
+/* global netdataTheme */
+
+NETDATA.themes = {
+ white: {
+ bootstrap_css: NETDATA.serverStatic + 'css/bootstrap-3.3.7.css',
+ dashboard_css: NETDATA.serverStatic + 'dashboard.css?v20190902-0',
+ background: '#FFFFFF',
+ foreground: '#000000',
+ grid: '#F0F0F0',
+ axis: '#F0F0F0',
+ highlight: '#F5F5F5',
+ colors: ['#3366CC', '#DC3912', '#109618', '#FF9900', '#990099', '#DD4477',
+ '#3B3EAC', '#66AA00', '#0099C6', '#B82E2E', '#AAAA11', '#5574A6',
+ '#994499', '#22AA99', '#6633CC', '#E67300', '#316395', '#8B0707',
+ '#329262', '#3B3EAC'],
+ easypiechart_track: '#f0f0f0',
+ easypiechart_scale: '#dfe0e0',
+ gauge_pointer: '#C0C0C0',
+ gauge_stroke: '#F0F0F0',
+ gauge_gradient: false,
+ d3pie: {
+ title: '#333333',
+ subtitle: '#666666',
+ footer: '#888888',
+ other: '#aaaaaa',
+ mainlabel: '#333333',
+ percentage: '#dddddd',
+ value: '#aaaa22',
+ tooltip_bg: '#000000',
+ tooltip_fg: '#efefef',
+ segment_stroke: "#ffffff",
+ gradient_color: '#000000'
+ }
+ },
+ slate: {
+ bootstrap_css: NETDATA.serverStatic + 'css/bootstrap-slate-flat-3.3.7.css?v20161229-1',
+ dashboard_css: NETDATA.serverStatic + 'dashboard.slate.css?v20190902-0',
+ background: '#272b30',
+ foreground: '#C8C8C8',
+ grid: '#283236',
+ axis: '#283236',
+ highlight: '#383838',
+ /* colors: [ '#55bb33', '#ff2222', '#0099C6', '#faa11b', '#adbce0', '#DDDD00',
+ '#4178ba', '#f58122', '#a5cc39', '#f58667', '#f5ef89', '#cf93c0',
+ '#a5d18a', '#b8539d', '#3954a3', '#c8a9cf', '#c7de8a', '#fad20a',
+ '#a6a479', '#a66da8' ],
+ */
+ colors: ['#66AA00', '#FE3912', '#3366CC', '#D66300', '#0099C6', '#DDDD00',
+ '#5054e6', '#EE9911', '#BB44CC', '#e45757', '#ef0aef', '#CC7700',
+ '#22AA99', '#109618', '#905bfd', '#f54882', '#4381bf', '#ff3737',
+ '#329262', '#3B3EFF'],
+ easypiechart_track: '#373b40',
+ easypiechart_scale: '#373b40',
+ gauge_pointer: '#474b50',
+ gauge_stroke: '#373b40',
+ gauge_gradient: false,
+ d3pie: {
+ title: '#C8C8C8',
+ subtitle: '#283236',
+ footer: '#283236',
+ other: '#283236',
+ mainlabel: '#C8C8C8',
+ percentage: '#dddddd',
+ value: '#cccc44',
+ tooltip_bg: '#272b30',
+ tooltip_fg: '#C8C8C8',
+ segment_stroke: "#283236",
+ gradient_color: '#000000'
+ }
+ }
+};
+
+if (typeof netdataTheme !== 'undefined' && typeof NETDATA.themes[netdataTheme] !== 'undefined') {
+ NETDATA.themes.current = NETDATA.themes[netdataTheme];
+} else {
+ NETDATA.themes.current = NETDATA.themes.white;
+}
+
+NETDATA.colors = NETDATA.themes.current.colors;
+
+// these are the colors Google Charts are using
+// we have them here to attempt emulate their look and feel on the other chart libraries
+// http://there4.io/2012/05/02/google-chart-color-list/
+//NETDATA.colors = [ '#3366CC', '#DC3912', '#FF9900', '#109618', '#990099', '#3B3EAC', '#0099C6',
+// '#DD4477', '#66AA00', '#B82E2E', '#316395', '#994499', '#22AA99', '#AAAA11',
+// '#6633CC', '#E67300', '#8B0707', '#329262', '#5574A6', '#3B3EAC' ];
+
+// an alternative set
+// http://www.mulinblog.com/a-color-palette-optimized-for-data-visualization/
+// (blue) (red) (orange) (green) (pink) (brown) (purple) (yellow) (gray)
+//NETDATA.colors = [ '#5DA5DA', '#F15854', '#FAA43A', '#60BD68', '#F17CB0', '#B2912F', '#B276B2', '#DECF3F', '#4D4D4D' ];
+// dygraph
+
+// Codacy declarations
+/* global smoothPlotter */
+/* global Dygraph */
+
+NETDATA.dygraph = {
+ smooth: false
+};
+
+NETDATA.dygraphToolboxPanAndZoom = function (state, after, before) {
+ if (after < state.netdata_first) {
+ after = state.netdata_first;
+ }
+
+ if (before > state.netdata_last) {
+ before = state.netdata_last;
+ }
+
+ state.setMode('zoom');
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_user_action = true;
+ state.tmp.dygraph_force_zoom = true;
+ // state.log('toolboxPanAndZoom');
+ state.updateChartPanOrZoom(after, before);
+ NETDATA.globalPanAndZoom.setMaster(state, after, before);
+};
+
+NETDATA.dygraphSetSelection = function (state, t) {
+ if (typeof state.tmp.dygraph_instance !== 'undefined') {
+ let r = state.calculateRowForTime(t);
+ if (r !== -1) {
+ state.tmp.dygraph_instance.setSelection(r);
+ return true;
+ } else {
+ state.tmp.dygraph_instance.clearSelection();
+ state.legendShowUndefined();
+ }
+ }
+
+ return false;
+};
+
+NETDATA.dygraphClearSelection = function (state) {
+ if (typeof state.tmp.dygraph_instance !== 'undefined') {
+ state.tmp.dygraph_instance.clearSelection();
+ }
+ return true;
+};
+
+NETDATA.dygraphSmoothInitialize = function (callback) {
+ $.ajax({
+ url: NETDATA.dygraph_smooth_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.dygraph.smooth = true;
+ smoothPlotter.smoothing = 0.3;
+ })
+ .fail(function () {
+ NETDATA.dygraph.smooth = false;
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+};
+
+NETDATA.dygraphInitialize = function (callback) {
+ if (typeof netdataNoDygraphs === 'undefined' || !netdataNoDygraphs) {
+ $.ajax({
+ url: NETDATA.dygraph_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('dygraph', NETDATA.dygraph_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.dygraph.enabled = false;
+ NETDATA.error(100, NETDATA.dygraph_js);
+ })
+ .always(function () {
+ if (NETDATA.chartLibraries.dygraph.enabled && NETDATA.options.current.smooth_plot) {
+ NETDATA.dygraphSmoothInitialize(callback);
+ } else if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ } else {
+ NETDATA.chartLibraries.dygraph.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.dygraphChartUpdate = function (state, data) {
+ let dygraph = state.tmp.dygraph_instance;
+
+ if (typeof dygraph === 'undefined') {
+ return NETDATA.dygraphChartCreate(state, data);
+ }
+
+ // when the chart is not visible, and hidden
+ // if there is a window resize, dygraph detects
+ // its element size as 0x0.
+ // this will make it re-appear properly
+
+ if (state.tm.last_unhidden > state.tmp.dygraph_last_rendered) {
+ dygraph.resize();
+ }
+
+ let options = {
+ file: data.result.data,
+ colors: state.chartColors(),
+ labels: data.result.labels,
+ //labelsDivWidth: state.chartWidth() - 70,
+ includeZero: state.tmp.dygraph_include_zero,
+ visibility: state.dimensions_visibility.selected2BooleanArray(state.data.dimension_names)
+ };
+
+ if (state.tmp.dygraph_chart_type === 'stacked') {
+ if (options.includeZero && state.dimensions_visibility.countSelected() < options.visibility.length) {
+ options.includeZero = 0;
+ }
+ }
+
+ if (!NETDATA.chartLibraries.dygraph.isSparkline(state)) {
+ options.ylabel = state.units_current; // (state.units_desired === 'auto')?"":state.units_current;
+ }
+
+ if (state.tmp.dygraph_force_zoom) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphChartUpdate() forced zoom update');
+ }
+
+ options.dateWindow = (state.requested_padding !== null) ? [state.view_after, state.view_before] : null;
+ //options.isZoomedIgnoreProgrammaticZoom = true;
+ state.tmp.dygraph_force_zoom = false;
+ } else if (state.current.name !== 'auto') {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphChartUpdate() loose update');
+ }
+ } else {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphChartUpdate() strict update');
+ }
+
+ options.dateWindow = (state.requested_padding !== null) ? [state.view_after, state.view_before] : null;
+ //options.isZoomedIgnoreProgrammaticZoom = true;
+ }
+
+ options.valueRange = state.tmp.dygraph_options.valueRange;
+
+ let oldMax = null, oldMin = null;
+ if (state.tmp.__commonMin !== null) {
+ state.data.min = state.tmp.dygraph_instance.axes_[0].extremeRange[0];
+ oldMin = options.valueRange[0] = NETDATA.commonMin.get(state);
+ }
+ if (state.tmp.__commonMax !== null) {
+ state.data.max = state.tmp.dygraph_instance.axes_[0].extremeRange[1];
+ oldMax = options.valueRange[1] = NETDATA.commonMax.get(state);
+ }
+
+ if (state.tmp.dygraph_smooth_eligible) {
+ if ((NETDATA.options.current.smooth_plot && state.tmp.dygraph_options.plotter !== smoothPlotter)
+ || (NETDATA.options.current.smooth_plot === false && state.tmp.dygraph_options.plotter === smoothPlotter)) {
+ NETDATA.dygraphChartCreate(state, data);
+ return;
+ }
+ }
+
+ if (netdataSnapshotData !== null && NETDATA.globalPanAndZoom.isActive() && NETDATA.globalPanAndZoom.isMaster(state) === false) {
+ // pan and zoom on snapshots
+ options.dateWindow = [NETDATA.globalPanAndZoom.force_after_ms, NETDATA.globalPanAndZoom.force_before_ms];
+ //options.isZoomedIgnoreProgrammaticZoom = true;
+ }
+
+ if (NETDATA.chartLibraries.dygraph.isLogScale(state)) {
+ if (Array.isArray(options.valueRange) && options.valueRange[0] <= 0) {
+ options.valueRange[0] = null;
+ }
+ }
+
+ dygraph.updateOptions(options);
+
+ let redraw = false;
+ if (oldMin !== null && oldMin > state.tmp.dygraph_instance.axes_[0].extremeRange[0]) {
+ state.data.min = state.tmp.dygraph_instance.axes_[0].extremeRange[0];
+ options.valueRange[0] = NETDATA.commonMin.get(state);
+ redraw = true;
+ }
+ if (oldMax !== null && oldMax < state.tmp.dygraph_instance.axes_[0].extremeRange[1]) {
+ state.data.max = state.tmp.dygraph_instance.axes_[0].extremeRange[1];
+ options.valueRange[1] = NETDATA.commonMax.get(state);
+ redraw = true;
+ }
+
+ if (redraw) {
+ // state.log('forcing redraw to adapt to common- min/max');
+ dygraph.updateOptions(options);
+ }
+
+ state.tmp.dygraph_last_rendered = Date.now();
+ return true;
+};
+
+NETDATA.dygraphChartCreate = function (state, data) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphChartCreate()');
+ }
+
+ state.tmp.dygraph_chart_type = NETDATA.dataAttribute(state.element, 'dygraph-type', state.chart.chart_type);
+ if (state.tmp.dygraph_chart_type === 'stacked' && data.dimensions === 1) {
+ state.tmp.dygraph_chart_type = 'area';
+ }
+ if (state.tmp.dygraph_chart_type === 'stacked' && NETDATA.chartLibraries.dygraph.isLogScale(state)) {
+ state.tmp.dygraph_chart_type = 'area';
+ }
+
+ let highlightCircleSize = NETDATA.chartLibraries.dygraph.isSparkline(state) ? 3 : 4;
+
+ let smooth = NETDATA.dygraph.smooth
+ ? (NETDATA.dataAttributeBoolean(state.element, 'dygraph-smooth', (state.tmp.dygraph_chart_type === 'line' && NETDATA.chartLibraries.dygraph.isSparkline(state) === false)))
+ : false;
+
+ state.tmp.dygraph_include_zero = NETDATA.dataAttribute(state.element, 'dygraph-includezero', (state.tmp.dygraph_chart_type === 'stacked'));
+ let drawAxis = NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawaxis', true);
+
+ state.tmp.dygraph_options = {
+ colors: NETDATA.dataAttribute(state.element, 'dygraph-colors', state.chartColors()),
+
+ // leave a few pixels empty on the right of the chart
+ rightGap: NETDATA.dataAttribute(state.element, 'dygraph-rightgap', 5),
+ showRangeSelector: NETDATA.dataAttributeBoolean(state.element, 'dygraph-showrangeselector', false),
+ showRoller: NETDATA.dataAttributeBoolean(state.element, 'dygraph-showroller', false),
+ title: NETDATA.dataAttribute(state.element, 'dygraph-title', state.title),
+ titleHeight: NETDATA.dataAttribute(state.element, 'dygraph-titleheight', 19),
+ legend: NETDATA.dataAttribute(state.element, 'dygraph-legend', 'always'), // we need this to get selection events
+ labels: data.result.labels,
+ labelsDiv: NETDATA.dataAttribute(state.element, 'dygraph-labelsdiv', state.element_legend_childs.hidden),
+ //labelsDivStyles: NETDATA.dataAttribute(state.element, 'dygraph-labelsdivstyles', { 'fontSize':'1px' }),
+ //labelsDivWidth: NETDATA.dataAttribute(state.element, 'dygraph-labelsdivwidth', state.chartWidth() - 70),
+ labelsSeparateLines: NETDATA.dataAttributeBoolean(state.element, 'dygraph-labelsseparatelines', true),
+ labelsShowZeroValues: NETDATA.chartLibraries.dygraph.isLogScale(state) ? false : NETDATA.dataAttributeBoolean(state.element, 'dygraph-labelsshowzerovalues', true),
+ labelsKMB: false,
+ labelsKMG2: false,
+ showLabelsOnHighlight: NETDATA.dataAttributeBoolean(state.element, 'dygraph-showlabelsonhighlight', true),
+ hideOverlayOnMouseOut: NETDATA.dataAttributeBoolean(state.element, 'dygraph-hideoverlayonmouseout', true),
+ includeZero: state.tmp.dygraph_include_zero,
+ xRangePad: NETDATA.dataAttribute(state.element, 'dygraph-xrangepad', 0),
+ yRangePad: NETDATA.dataAttribute(state.element, 'dygraph-yrangepad', 1),
+ valueRange: NETDATA.dataAttribute(state.element, 'dygraph-valuerange', [null, null]),
+ ylabel: state.units_current, // (state.units_desired === 'auto')?"":state.units_current,
+ yLabelWidth: NETDATA.dataAttribute(state.element, 'dygraph-ylabelwidth', 12),
+
+ // the function to plot the chart
+ plotter: null,
+
+ // The width of the lines connecting data points.
+ // This can be used to increase the contrast or some graphs.
+ strokeWidth: NETDATA.dataAttribute(state.element, 'dygraph-strokewidth', ((state.tmp.dygraph_chart_type === 'stacked') ? 0.1 : ((smooth === true) ? 1.5 : 0.7))),
+ strokePattern: NETDATA.dataAttribute(state.element, 'dygraph-strokepattern', undefined),
+
+ // The size of the dot to draw on each point in pixels (see drawPoints).
+ // A dot is always drawn when a point is "isolated",
+ // i.e. there is a missing point on either side of it.
+ // This also controls the size of those dots.
+ drawPoints: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawpoints', false),
+
+ // Draw points at the edges of gaps in the data.
+ // This improves visibility of small data segments or other data irregularities.
+ drawGapEdgePoints: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawgapedgepoints', true),
+ connectSeparatedPoints: NETDATA.chartLibraries.dygraph.isLogScale(state) ? false : NETDATA.dataAttributeBoolean(state.element, 'dygraph-connectseparatedpoints', false),
+ pointSize: NETDATA.dataAttribute(state.element, 'dygraph-pointsize', 1),
+
+ // enabling this makes the chart with little square lines
+ stepPlot: NETDATA.dataAttributeBoolean(state.element, 'dygraph-stepplot', false),
+
+ // Draw a border around graph lines to make crossing lines more easily
+ // distinguishable. Useful for graphs with many lines.
+ strokeBorderColor: NETDATA.dataAttribute(state.element, 'dygraph-strokebordercolor', NETDATA.themes.current.background),
+ strokeBorderWidth: NETDATA.dataAttribute(state.element, 'dygraph-strokeborderwidth', (state.tmp.dygraph_chart_type === 'stacked') ? 0.0 : 0.0),
+ fillGraph: NETDATA.dataAttribute(state.element, 'dygraph-fillgraph', (state.tmp.dygraph_chart_type === 'area' || state.tmp.dygraph_chart_type === 'stacked')),
+ fillAlpha: NETDATA.dataAttribute(state.element, 'dygraph-fillalpha',
+ ((state.tmp.dygraph_chart_type === 'stacked')
+ ? NETDATA.options.current.color_fill_opacity_stacked
+ : NETDATA.options.current.color_fill_opacity_area)
+ ),
+ stackedGraph: NETDATA.dataAttribute(state.element, 'dygraph-stackedgraph', (state.tmp.dygraph_chart_type === 'stacked')),
+ stackedGraphNaNFill: NETDATA.dataAttribute(state.element, 'dygraph-stackedgraphnanfill', 'none'),
+ drawAxis: drawAxis,
+ axisLabelFontSize: NETDATA.dataAttribute(state.element, 'dygraph-axislabelfontsize', 10),
+ axisLineColor: NETDATA.dataAttribute(state.element, 'dygraph-axislinecolor', NETDATA.themes.current.axis),
+ axisLineWidth: NETDATA.dataAttribute(state.element, 'dygraph-axislinewidth', 1.0),
+ drawGrid: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawgrid', true),
+ gridLinePattern: NETDATA.dataAttribute(state.element, 'dygraph-gridlinepattern', null),
+ gridLineWidth: NETDATA.dataAttribute(state.element, 'dygraph-gridlinewidth', 1.0),
+ gridLineColor: NETDATA.dataAttribute(state.element, 'dygraph-gridlinecolor', NETDATA.themes.current.grid),
+ maxNumberWidth: NETDATA.dataAttribute(state.element, 'dygraph-maxnumberwidth', 8),
+ sigFigs: NETDATA.dataAttribute(state.element, 'dygraph-sigfigs', null),
+ digitsAfterDecimal: NETDATA.dataAttribute(state.element, 'dygraph-digitsafterdecimal', 2),
+ valueFormatter: NETDATA.dataAttribute(state.element, 'dygraph-valueformatter', undefined),
+ highlightCircleSize: NETDATA.dataAttribute(state.element, 'dygraph-highlightcirclesize', highlightCircleSize),
+ highlightSeriesOpts: NETDATA.dataAttribute(state.element, 'dygraph-highlightseriesopts', null), // TOO SLOW: { strokeWidth: 1.5 },
+ highlightSeriesBackgroundAlpha: NETDATA.dataAttribute(state.element, 'dygraph-highlightseriesbackgroundalpha', null), // TOO SLOW: (state.tmp.dygraph_chart_type === 'stacked')?0.7:0.5,
+ pointClickCallback: NETDATA.dataAttribute(state.element, 'dygraph-pointclickcallback', undefined),
+ visibility: state.dimensions_visibility.selected2BooleanArray(state.data.dimension_names),
+ logscale: NETDATA.chartLibraries.dygraph.isLogScale(state) ? 'y' : undefined,
+
+ // Expects a string in the format "<series name>: <style>" where each series is separated by a |
+ perSeriesStyle: NETDATA.dataAttribute(state.element, 'dygraph-per-series-style', ''),
+
+ axes: {
+ x: {
+ pixelsPerLabel: NETDATA.dataAttribute(state.element, 'dygraph-xpixelsperlabel', 50),
+ ticker: Dygraph.dateTicker,
+ axisLabelWidth: NETDATA.dataAttribute(state.element, 'dygraph-xaxislabelwidth', 60),
+ drawAxis: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawxaxis', drawAxis),
+ axisLabelFormatter: function (d, gran) {
+ void(gran);
+ return NETDATA.dateTime.xAxisTimeString(d);
+ }
+ },
+ y: {
+ logscale: NETDATA.chartLibraries.dygraph.isLogScale(state) ? true : undefined,
+ pixelsPerLabel: NETDATA.dataAttribute(state.element, 'dygraph-ypixelsperlabel', 15),
+ axisLabelWidth: NETDATA.dataAttribute(state.element, 'dygraph-yaxislabelwidth', 50),
+ drawAxis: NETDATA.dataAttributeBoolean(state.element, 'dygraph-drawyaxis', drawAxis),
+ axisLabelFormatter: function (y) {
+
+ // unfortunately, we have to call this every single time
+ state.legendFormatValueDecimalsFromMinMax(
+ this.axes_[0].extremeRange[0],
+ this.axes_[0].extremeRange[1]
+ );
+
+ let old_units = this.user_attrs_.ylabel;
+ let v = state.legendFormatValue(y);
+ let new_units = state.units_current;
+
+ if (state.units_desired === 'auto' && typeof old_units !== 'undefined' && new_units !== old_units && !NETDATA.chartLibraries.dygraph.isSparkline(state)) {
+ // console.log(this);
+ // state.log('units discrepancy: old = ' + old_units + ', new = ' + new_units);
+ let len = this.plugins_.length;
+ while (len--) {
+ // console.log(this.plugins_[len]);
+ if (typeof this.plugins_[len].plugin.ylabel_div_ !== 'undefined'
+ && this.plugins_[len].plugin.ylabel_div_ !== null
+ && typeof this.plugins_[len].plugin.ylabel_div_.children !== 'undefined'
+ && this.plugins_[len].plugin.ylabel_div_.children !== null
+ && typeof this.plugins_[len].plugin.ylabel_div_.children[0].children !== 'undefined'
+ && this.plugins_[len].plugin.ylabel_div_.children[0].children !== null
+ ) {
+ this.plugins_[len].plugin.ylabel_div_.children[0].children[0].innerHTML = new_units;
+ this.user_attrs_.ylabel = new_units;
+ break;
+ }
+ }
+
+ if (len < 0) {
+ state.log('units discrepancy, but cannot find dygraphs div to change: old = ' + old_units + ', new = ' + new_units);
+ }
+ }
+
+ return v;
+ }
+ }
+ },
+ legendFormatter: function (data) {
+ if (state.tmp.dygraph_mouse_down) {
+ return;
+ }
+
+ let elements = state.element_legend_childs;
+
+ // if the hidden div is not there
+ // we are not managing the legend
+ if (elements.hidden === null) {
+ return;
+ }
+
+ if (typeof data.x !== 'undefined') {
+ state.legendSetDate(data.x);
+ let i = data.series.length;
+ while (i--) {
+ let series = data.series[i];
+ if (series.isVisible) {
+ state.legendSetLabelValue(series.label, series.y);
+ } else {
+ state.legendSetLabelValue(series.label, null);
+ }
+ }
+ }
+
+ return '';
+ },
+ drawCallback: function (dygraph, is_initial) {
+
+ // the user has panned the chart and this is called to re-draw the chart
+ // 1. refresh this chart by adding data to it
+ // 2. notify all the other charts about the update they need
+
+ // to prevent an infinite loop (feedback), we use
+ // state.tmp.dygraph_user_action
+ // - when true, this is initiated by a user
+ // - when false, this is feedback
+
+ if (state.current.name !== 'auto' && state.tmp.dygraph_user_action) {
+ state.tmp.dygraph_user_action = false;
+
+ let x_range = dygraph.xAxisRange();
+ let after = Math.round(x_range[0]);
+ let before = Math.round(x_range[1]);
+
+ if (NETDATA.options.debug.dygraph) {
+ state.log('dygraphDrawCallback(dygraph, ' + is_initial + '): mode ' + state.current.name + ' ' + (after / 1000).toString() + ' - ' + (before / 1000).toString());
+ //console.log(state);
+ }
+
+ if (before <= state.netdata_last && after >= state.netdata_first) {
+ // update only when we are within the data limits
+ state.updateChartPanOrZoom(after, before);
+ }
+ }
+ },
+ zoomCallback: function (minDate, maxDate, yRanges) {
+
+ // the user has selected a range on the chart
+ // 1. refresh this chart by adding data to it
+ // 2. notify all the other charts about the update they need
+
+ void(yRanges);
+
+ if (NETDATA.options.debug.dygraph) {
+ state.log('dygraphZoomCallback(): ' + state.current.name);
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+ state.setMode('zoom');
+
+ // refresh it to the greatest possible zoom level
+ state.tmp.dygraph_user_action = true;
+ state.tmp.dygraph_force_zoom = true;
+ state.updateChartPanOrZoom(minDate, maxDate);
+ },
+ highlightCallback: function (event, x, points, row, seriesName) {
+ void(seriesName);
+
+ state.pauseChart();
+
+ // there is a bug in dygraph when the chart is zoomed enough
+ // the time it thinks is selected is wrong
+ // here we calculate the time t based on the row number selected
+ // which is ok
+ // let t = state.data_after + row * state.data_update_every;
+ // console.log('row = ' + row + ', x = ' + x + ', t = ' + t + ' ' + ((t === x)?'SAME':(Math.abs(x-t)<=state.data_update_every)?'SIMILAR':'DIFFERENT') + ', rows in db: ' + state.data_points + ' visible(x) = ' + state.timeIsVisible(x) + ' visible(t) = ' + state.timeIsVisible(t) + ' r(x) = ' + state.calculateRowForTime(x) + ' r(t) = ' + state.calculateRowForTime(t) + ' range: ' + state.data_after + ' - ' + state.data_before + ' real: ' + state.data.after + ' - ' + state.data.before + ' every: ' + state.data_update_every);
+
+ if (state.tmp.dygraph_mouse_down !== true) {
+ NETDATA.globalSelectionSync.sync(state, x);
+ }
+
+ // fix legend zIndex using the internal structures of dygraph legend module
+ // this works, but it is a hack!
+ // state.tmp.dygraph_instance.plugins_[0].plugin.legend_div_.style.zIndex = 10000;
+ },
+ unhighlightCallback: function (event) {
+ void(event);
+
+ if (state.tmp.dygraph_mouse_down) {
+ return;
+ }
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('dygraphUnhighlightCallback()');
+ }
+
+ state.unpauseChart();
+ NETDATA.globalSelectionSync.stop();
+ },
+ underlayCallback: function (canvas, area, g) {
+
+ // the chart is about to be drawn
+
+ // update history_tip_element
+ if (state.tmp.dygraph_history_tip_element) {
+ const xHookRightSide = g.toDomXCoord(state.netdata_first);
+ if (xHookRightSide > area.x) {
+ state.tmp.dygraph_history_tip_element_displayed = true;
+ // group the styles for possible better performance
+ state.tmp.dygraph_history_tip_element.setAttribute(
+ 'style',
+ `display: block; left: ${area.x}px; right: calc(100% - ${xHookRightSide}px);`
+ )
+ } else {
+ if (state.tmp.dygraph_history_tip_element_displayed) {
+ // additional check just for performance
+ // don't update the DOM when it's not needed
+ state.tmp.dygraph_history_tip_element.style.display = 'none';
+ state.tmp.dygraph_history_tip_element_displayed = false;
+ }
+ }
+ }
+
+ // this function renders global highlighted time-frame
+
+ if (NETDATA.globalChartUnderlay.isActive()) {
+ let after = NETDATA.globalChartUnderlay.after;
+ let before = NETDATA.globalChartUnderlay.before;
+
+ if (after < state.view_after) {
+ after = state.view_after;
+ }
+
+ if (before > state.view_before) {
+ before = state.view_before;
+ }
+
+ if (after < before) {
+ let bottom_left = g.toDomCoords(after, -20);
+ let top_right = g.toDomCoords(before, +20);
+
+ let left = bottom_left[0];
+ let right = top_right[0];
+
+ canvas.fillStyle = NETDATA.themes.current.highlight;
+ canvas.fillRect(left, area.y, right - left, area.h);
+ }
+ }
+ },
+ interactionModel: {
+ mousedown: function (event, dygraph, context) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.mousedown()');
+ }
+
+ state.tmp.dygraph_user_action = true;
+
+ if (NETDATA.options.debug.dygraph) {
+ state.log('dygraphMouseDown()');
+ }
+
+ // Right-click should not initiate anything.
+ if (event.button && event.button === 2) {
+ return;
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_mouse_down = true;
+ context.initializeMouseDown(event, dygraph, context);
+
+ //console.log(event);
+ if (event.button && event.button === 1) {
+ if (event.shiftKey) {
+ //console.log('middle mouse button dragging (PAN)');
+
+ state.setMode('pan');
+ // NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_highlight_after = null;
+ Dygraph.startPan(event, dygraph, context);
+ } else if (event.altKey || event.ctrlKey || event.metaKey) {
+ //console.log('middle mouse button highlight');
+
+ if (!(event.offsetX && event.offsetY)) {
+ event.offsetX = event.layerX - event.target.offsetLeft;
+ event.offsetY = event.layerY - event.target.offsetTop;
+ }
+ state.tmp.dygraph_highlight_after = dygraph.toDataXCoord(event.offsetX);
+ Dygraph.startZoom(event, dygraph, context);
+ } else {
+ //console.log('middle mouse button selection for zoom (ZOOM)');
+
+ state.setMode('zoom');
+ // NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_highlight_after = null;
+ Dygraph.startZoom(event, dygraph, context);
+ }
+ } else {
+ if (event.shiftKey) {
+ //console.log('left mouse button selection for zoom (ZOOM)');
+
+ state.setMode('zoom');
+ // NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_highlight_after = null;
+ Dygraph.startZoom(event, dygraph, context);
+ } else if (event.altKey || event.ctrlKey || event.metaKey) {
+ //console.log('left mouse button highlight');
+
+ if (!(event.offsetX && event.offsetY)) {
+ event.offsetX = event.layerX - event.target.offsetLeft;
+ event.offsetY = event.layerY - event.target.offsetTop;
+ }
+ state.tmp.dygraph_highlight_after = dygraph.toDataXCoord(event.offsetX);
+ Dygraph.startZoom(event, dygraph, context);
+ } else {
+ //console.log('left mouse button dragging (PAN)');
+
+ state.setMode('pan');
+ // NETDATA.globalSelectionSync.delay();
+ state.tmp.dygraph_highlight_after = null;
+ Dygraph.startPan(event, dygraph, context);
+ }
+ }
+ },
+ mousemove: function (event, dygraph, context) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.mousemove()');
+ }
+
+ if (state.tmp.dygraph_highlight_after !== null) {
+ //console.log('highlight selection...');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.moveZoom(event, dygraph, context);
+ event.preventDefault();
+ } else if (context.isPanning) {
+ //console.log('panning...');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ //NETDATA.globalSelectionSync.stop();
+ //NETDATA.globalSelectionSync.delay();
+ state.setMode('pan');
+ context.is2DPan = false;
+ Dygraph.movePan(event, dygraph, context);
+ } else if (context.isZooming) {
+ //console.log('zooming...');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ //NETDATA.globalSelectionSync.stop();
+ //NETDATA.globalSelectionSync.delay();
+ state.setMode('zoom');
+ Dygraph.moveZoom(event, dygraph, context);
+ }
+ },
+ mouseup: function (event, dygraph, context) {
+ state.tmp.dygraph_mouse_down = false;
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.mouseup()');
+ }
+
+ if (state.tmp.dygraph_highlight_after !== null) {
+ //console.log('done highlight selection');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ if (!(event.offsetX && event.offsetY)) {
+ event.offsetX = event.layerX - event.target.offsetLeft;
+ event.offsetY = event.layerY - event.target.offsetTop;
+ }
+
+ NETDATA.globalChartUnderlay.set(state
+ , state.tmp.dygraph_highlight_after
+ , dygraph.toDataXCoord(event.offsetX)
+ , state.view_after
+ , state.view_before
+ );
+
+ state.tmp.dygraph_highlight_after = null;
+
+ context.isZooming = false;
+ dygraph.clearZoomRect_();
+ dygraph.drawGraph_(false);
+
+ // refresh all the charts immediately
+ NETDATA.options.auto_refresher_stop_until = 0;
+ } else if (context.isPanning) {
+ //console.log('done panning');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.endPan(event, dygraph, context);
+
+ // refresh all the charts immediately
+ NETDATA.options.auto_refresher_stop_until = 0;
+ } else if (context.isZooming) {
+ //console.log('done zomming');
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.endZoom(event, dygraph, context);
+
+ // refresh all the charts immediately
+ NETDATA.options.auto_refresher_stop_until = 0;
+ }
+ },
+ click: function (event, dygraph, context) {
+ void(dygraph);
+ void(context);
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.click()');
+ }
+
+ event.preventDefault();
+ },
+ dblclick: function (event, dygraph, context) {
+ void(event);
+ void(dygraph);
+ void(context);
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.dblclick()');
+ }
+ NETDATA.resetAllCharts(state);
+ },
+ wheel: function (event, dygraph, context) {
+ void(context);
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.wheel()');
+ }
+
+ // Take the offset of a mouse event on the dygraph canvas and
+ // convert it to a pair of percentages from the bottom left.
+ // (Not top left, bottom is where the lower value is.)
+ function offsetToPercentage(g, offsetX, offsetY) {
+ // This is calculating the pixel offset of the leftmost date.
+ let xOffset = g.toDomCoords(g.xAxisRange()[0], null)[0];
+ let yar0 = g.yAxisRange(0);
+
+ // This is calculating the pixel of the highest value. (Top pixel)
+ let yOffset = g.toDomCoords(null, yar0[1])[1];
+
+ // x y w and h are relative to the corner of the drawing area,
+ // so that the upper corner of the drawing area is (0, 0).
+ let x = offsetX - xOffset;
+ let y = offsetY - yOffset;
+
+ // This is computing the rightmost pixel, effectively defining the
+ // width.
+ let w = g.toDomCoords(g.xAxisRange()[1], null)[0] - xOffset;
+
+ // This is computing the lowest pixel, effectively defining the height.
+ let h = g.toDomCoords(null, yar0[0])[1] - yOffset;
+
+ // Percentage from the left.
+ let xPct = w === 0 ? 0 : (x / w);
+ // Percentage from the top.
+ let yPct = h === 0 ? 0 : (y / h);
+
+ // The (1-) part below changes it from "% distance down from the top"
+ // to "% distance up from the bottom".
+ return [xPct, (1 - yPct)];
+ }
+
+ // Adjusts [x, y] toward each other by zoomInPercentage%
+ // Split it so the left/bottom axis gets xBias/yBias of that change and
+ // tight/top gets (1-xBias)/(1-yBias) of that change.
+ //
+ // If a bias is missing it splits it down the middle.
+ function zoomRange(g, zoomInPercentage, xBias, yBias) {
+ xBias = xBias || 0.5;
+ yBias = yBias || 0.5;
+
+ function adjustAxis(axis, zoomInPercentage, bias) {
+ let delta = axis[1] - axis[0];
+ let increment = delta * zoomInPercentage;
+ let foo = [increment * bias, increment * (1 - bias)];
+
+ return [axis[0] + foo[0], axis[1] - foo[1]];
+ }
+
+ let yAxes = g.yAxisRanges();
+ let newYAxes = [];
+ for (let i = 0; i < yAxes.length; i++) {
+ newYAxes[i] = adjustAxis(yAxes[i], zoomInPercentage, yBias);
+ }
+
+ return adjustAxis(g.xAxisRange(), zoomInPercentage, xBias);
+ }
+
+ if (event.altKey || event.shiftKey) {
+ state.tmp.dygraph_user_action = true;
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ // http://dygraphs.com/gallery/interaction-api.js
+ let normal_def;
+ if (typeof event.wheelDelta === 'number' && !isNaN(event.wheelDelta))
+ // chrome
+ {
+ normal_def = event.wheelDelta / 40;
+ } else
+ // firefox
+ {
+ normal_def = event.deltaY * -1.2;
+ }
+
+ let normal = (event.detail) ? event.detail * -1 : normal_def;
+ let percentage = normal / 50;
+
+ if (!(event.offsetX && event.offsetY)) {
+ event.offsetX = event.layerX - event.target.offsetLeft;
+ event.offsetY = event.layerY - event.target.offsetTop;
+ }
+
+ let percentages = offsetToPercentage(dygraph, event.offsetX, event.offsetY);
+ let xPct = percentages[0];
+ let yPct = percentages[1];
+
+ let new_x_range = zoomRange(dygraph, percentage, xPct, yPct);
+ let after = new_x_range[0];
+ let before = new_x_range[1];
+
+ let first = state.netdata_first + state.data_update_every;
+ let last = state.netdata_last + state.data_update_every;
+
+ if (before > last) {
+ after -= (before - last);
+ before = last;
+ }
+ if (after < first) {
+ after = first;
+ }
+
+ state.setMode('zoom');
+ state.updateChartPanOrZoom(after, before, function () {
+ dygraph.updateOptions({dateWindow: [after, before]});
+ });
+
+ event.preventDefault();
+ }
+ },
+ touchstart: function (event, dygraph, context) {
+ state.tmp.dygraph_mouse_down = true;
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.touchstart()');
+ }
+
+ state.tmp.dygraph_user_action = true;
+ state.setMode('zoom');
+ state.pauseChart();
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ Dygraph.defaultInteractionModel.touchstart(event, dygraph, context);
+
+ // we overwrite the touch directions at the end, to overwrite
+ // the internal default of dygraph
+ context.touchDirections = {x: true, y: false};
+
+ state.dygraph_last_touch_start = Date.now();
+ state.dygraph_last_touch_move = 0;
+
+ if (typeof event.touches[0].pageX === 'number') {
+ state.dygraph_last_touch_page_x = event.touches[0].pageX;
+ } else {
+ state.dygraph_last_touch_page_x = 0;
+ }
+ },
+ touchmove: function (event, dygraph, context) {
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.touchmove()');
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.defaultInteractionModel.touchmove(event, dygraph, context);
+
+ state.dygraph_last_touch_move = Date.now();
+ },
+ touchend: function (event, dygraph, context) {
+ state.tmp.dygraph_mouse_down = false;
+
+ if (NETDATA.options.debug.dygraph || state.debug) {
+ state.log('interactionModel.touchend()');
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.delay();
+
+ state.tmp.dygraph_user_action = true;
+ Dygraph.defaultInteractionModel.touchend(event, dygraph, context);
+
+ // if it didn't move, it is a selection
+ if (state.dygraph_last_touch_move === 0 && state.dygraph_last_touch_page_x !== 0) {
+ NETDATA.globalSelectionSync.dontSyncBefore = 0;
+ NETDATA.globalSelectionSync.setMaster(state);
+
+ // internal api of dygraph
+ let pct = (state.dygraph_last_touch_page_x - (dygraph.plotter_.area.x + state.element.getBoundingClientRect().left)) / dygraph.plotter_.area.w;
+ console.log('pct: ' + pct.toString());
+
+ let t = Math.round(state.view_after + (state.view_before - state.view_after) * pct);
+ if (NETDATA.dygraphSetSelection(state, t)) {
+ NETDATA.globalSelectionSync.sync(state, t);
+ }
+ }
+
+ // if it was double tap within double click time, reset the charts
+ let now = Date.now();
+ if (typeof state.dygraph_last_touch_end !== 'undefined') {
+ if (state.dygraph_last_touch_move === 0) {
+ let dt = now - state.dygraph_last_touch_end;
+ if (dt <= NETDATA.options.current.double_click_speed) {
+ NETDATA.resetAllCharts(state);
+ }
+ }
+ }
+
+ // remember the timestamp of the last touch end
+ state.dygraph_last_touch_end = now;
+
+ // refresh all the charts immediately
+ NETDATA.options.auto_refresher_stop_until = 0;
+ }
+ }
+ };
+
+ if (NETDATA.chartLibraries.dygraph.isLogScale(state)) {
+ if (Array.isArray(state.tmp.dygraph_options.valueRange) && state.tmp.dygraph_options.valueRange[0] <= 0) {
+ state.tmp.dygraph_options.valueRange[0] = null;
+ }
+ }
+
+ if (NETDATA.chartLibraries.dygraph.isSparkline(state)) {
+ state.tmp.dygraph_options.drawGrid = false;
+ state.tmp.dygraph_options.drawAxis = false;
+ state.tmp.dygraph_options.title = undefined;
+ state.tmp.dygraph_options.ylabel = undefined;
+ state.tmp.dygraph_options.yLabelWidth = 0;
+ //state.tmp.dygraph_options.labelsDivWidth = 120;
+ //state.tmp.dygraph_options.labelsDivStyles.width = '120px';
+ state.tmp.dygraph_options.labelsSeparateLines = true;
+ state.tmp.dygraph_options.rightGap = 0;
+ state.tmp.dygraph_options.yRangePad = 1;
+ state.tmp.dygraph_options.axes.x.drawAxis = false;
+ state.tmp.dygraph_options.axes.y.drawAxis = false;
+ }
+
+ if (smooth) {
+ state.tmp.dygraph_smooth_eligible = true;
+
+ if (NETDATA.options.current.smooth_plot) {
+ state.tmp.dygraph_options.plotter = smoothPlotter;
+ }
+ }
+ else {
+ state.tmp.dygraph_smooth_eligible = false;
+ }
+
+ if (netdataSnapshotData !== null && NETDATA.globalPanAndZoom.isActive() && NETDATA.globalPanAndZoom.isMaster(state) === false) {
+ // pan and zoom on snapshots
+ state.tmp.dygraph_options.dateWindow = [NETDATA.globalPanAndZoom.force_after_ms, NETDATA.globalPanAndZoom.force_before_ms];
+ //state.tmp.dygraph_options.isZoomedIgnoreProgrammaticZoom = true;
+ }
+
+ let seriesStyles = NETDATA.dygraphGetSeriesStyle(state.tmp.dygraph_options);
+ state.tmp.dygraph_options.series = seriesStyles;
+
+ state.tmp.dygraph_instance = new Dygraph(
+ state.element_chart,
+ data.result.data,
+ state.tmp.dygraph_options
+ );
+
+ state.tmp.dygraph_history_tip_element = document.createElement('div');
+ state.tmp.dygraph_history_tip_element.innerHTML = `
+ <span class="dygraph__history-tip-content">
+ Want to extend your history of real-time metrics?
+ <br />
+ <a href="https://docs.netdata.cloud/docs/configuration-guide/#increase-the-metrics-retention-period" target=_blank>
+ Configure Netdata's <b>history</b></a>
+ or use the <a href="https://docs.netdata.cloud/database/engine/" target=_blank>DB engine</a>.
+ </span>
+ `;
+ state.tmp.dygraph_history_tip_element.className = 'dygraph__history-tip';
+ state.element_chart.appendChild(state.tmp.dygraph_history_tip_element);
+
+
+ state.tmp.dygraph_force_zoom = false;
+ state.tmp.dygraph_user_action = false;
+ state.tmp.dygraph_last_rendered = Date.now();
+ state.tmp.dygraph_highlight_after = null;
+
+ if (state.tmp.dygraph_options.valueRange[0] === null && state.tmp.dygraph_options.valueRange[1] === null) {
+ if (typeof state.tmp.dygraph_instance.axes_[0].extremeRange !== 'undefined') {
+ state.tmp.__commonMin = NETDATA.dataAttribute(state.element, 'common-min', null);
+ state.tmp.__commonMax = NETDATA.dataAttribute(state.element, 'common-max', null);
+ } else {
+ state.log('incompatible version of Dygraph detected');
+ state.tmp.__commonMin = null;
+ state.tmp.__commonMax = null;
+ }
+ } else {
+ // if the user gave a valueRange, respect it
+ state.tmp.__commonMin = null;
+ state.tmp.__commonMax = null;
+ }
+
+ return true;
+};
+
+NETDATA.dygraphGetSeriesStyle = function(dygraphOptions) {
+ const seriesStyleStr = dygraphOptions.perSeriesStyle;
+ let formattedStyles = {};
+
+ if (seriesStyleStr === '') {
+ return formattedStyles;
+ }
+
+ // Parse the config string into a JSON object
+ let styles = seriesStyleStr.replace(' ', '').split('|');
+
+ styles.forEach(style => {
+ const keys = style.split(':');
+ formattedStyles[keys[0]] = keys[1];
+ });
+
+ for (let key in formattedStyles) {
+ if (formattedStyles.hasOwnProperty(key)) {
+ let settings;
+
+ switch (formattedStyles[key]) {
+ case 'line':
+ settings = { fillGraph: false };
+ break;
+ case 'area':
+ settings = { fillGraph: true };
+ break;
+ case 'dot':
+ settings = {
+ fillGraph: false,
+ drawPoints: true,
+ pointSize: dygraphOptions.pointSize
+ };
+ break;
+ default:
+ settings = undefined;
+ }
+
+ formattedStyles[key] = settings;
+ }
+ }
+
+ return formattedStyles;
+};
+// ----------------------------------------------------------------------------------------------------------------
+// sparkline
+
+NETDATA.sparklineInitialize = function (callback) {
+ if (typeof netdataNoSparklines === 'undefined' || !netdataNoSparklines) {
+ $.ajax({
+ url: NETDATA.sparkline_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('sparkline', NETDATA.sparkline_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.sparkline.enabled = false;
+ NETDATA.error(100, NETDATA.sparkline_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ } else {
+ NETDATA.chartLibraries.sparkline.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.sparklineChartUpdate = function (state, data) {
+ state.sparkline_options.width = state.chartWidth();
+ state.sparkline_options.height = state.chartHeight();
+
+ $(state.element_chart).sparkline(data.result, state.sparkline_options);
+ return true;
+};
+
+NETDATA.sparklineChartCreate = function (state, data) {
+ let type = NETDATA.dataAttribute(state.element, 'sparkline-type', 'line');
+ let lineColor = NETDATA.dataAttribute(state.element, 'sparkline-linecolor', state.chartCustomColors()[0]);
+ let fillColor = NETDATA.dataAttribute(state.element, 'sparkline-fillcolor', ((state.chart.chart_type === 'line') ? NETDATA.themes.current.background : NETDATA.colorLuminance(lineColor, NETDATA.chartDefaults.fill_luminance)));
+ let chartRangeMin = NETDATA.dataAttribute(state.element, 'sparkline-chartrangemin', undefined);
+ let chartRangeMax = NETDATA.dataAttribute(state.element, 'sparkline-chartrangemax', undefined);
+ let composite = NETDATA.dataAttribute(state.element, 'sparkline-composite', undefined);
+ let enableTagOptions = NETDATA.dataAttribute(state.element, 'sparkline-enabletagoptions', undefined);
+ let tagOptionPrefix = NETDATA.dataAttribute(state.element, 'sparkline-tagoptionprefix', undefined);
+ let tagValuesAttribute = NETDATA.dataAttribute(state.element, 'sparkline-tagvaluesattribute', undefined);
+ let disableHiddenCheck = NETDATA.dataAttribute(state.element, 'sparkline-disablehiddencheck', undefined);
+ let defaultPixelsPerValue = NETDATA.dataAttribute(state.element, 'sparkline-defaultpixelspervalue', undefined);
+ let spotColor = NETDATA.dataAttribute(state.element, 'sparkline-spotcolor', undefined);
+ let minSpotColor = NETDATA.dataAttribute(state.element, 'sparkline-minspotcolor', undefined);
+ let maxSpotColor = NETDATA.dataAttribute(state.element, 'sparkline-maxspotcolor', undefined);
+ let spotRadius = NETDATA.dataAttribute(state.element, 'sparkline-spotradius', undefined);
+ let valueSpots = NETDATA.dataAttribute(state.element, 'sparkline-valuespots', undefined);
+ let highlightSpotColor = NETDATA.dataAttribute(state.element, 'sparkline-highlightspotcolor', undefined);
+ let highlightLineColor = NETDATA.dataAttribute(state.element, 'sparkline-highlightlinecolor', undefined);
+ let lineWidth = NETDATA.dataAttribute(state.element, 'sparkline-linewidth', undefined);
+ let normalRangeMin = NETDATA.dataAttribute(state.element, 'sparkline-normalrangemin', undefined);
+ let normalRangeMax = NETDATA.dataAttribute(state.element, 'sparkline-normalrangemax', undefined);
+ let drawNormalOnTop = NETDATA.dataAttribute(state.element, 'sparkline-drawnormalontop', undefined);
+ let xvalues = NETDATA.dataAttribute(state.element, 'sparkline-xvalues', undefined);
+ let chartRangeClip = NETDATA.dataAttribute(state.element, 'sparkline-chartrangeclip', undefined);
+ let chartRangeMinX = NETDATA.dataAttribute(state.element, 'sparkline-chartrangeminx', undefined);
+ let chartRangeMaxX = NETDATA.dataAttribute(state.element, 'sparkline-chartrangemaxx', undefined);
+ let disableInteraction = NETDATA.dataAttributeBoolean(state.element, 'sparkline-disableinteraction', false);
+ let disableTooltips = NETDATA.dataAttributeBoolean(state.element, 'sparkline-disabletooltips', false);
+ let disableHighlight = NETDATA.dataAttributeBoolean(state.element, 'sparkline-disablehighlight', false);
+ let highlightLighten = NETDATA.dataAttribute(state.element, 'sparkline-highlightlighten', 1.4);
+ let highlightColor = NETDATA.dataAttribute(state.element, 'sparkline-highlightcolor', undefined);
+ let tooltipContainer = NETDATA.dataAttribute(state.element, 'sparkline-tooltipcontainer', undefined);
+ let tooltipClassname = NETDATA.dataAttribute(state.element, 'sparkline-tooltipclassname', undefined);
+ let tooltipFormat = NETDATA.dataAttribute(state.element, 'sparkline-tooltipformat', undefined);
+ let tooltipPrefix = NETDATA.dataAttribute(state.element, 'sparkline-tooltipprefix', undefined);
+ let tooltipSuffix = NETDATA.dataAttribute(state.element, 'sparkline-tooltipsuffix', ' ' + state.units_current);
+ let tooltipSkipNull = NETDATA.dataAttributeBoolean(state.element, 'sparkline-tooltipskipnull', true);
+ let tooltipValueLookups = NETDATA.dataAttribute(state.element, 'sparkline-tooltipvaluelookups', undefined);
+ let tooltipFormatFieldlist = NETDATA.dataAttribute(state.element, 'sparkline-tooltipformatfieldlist', undefined);
+ let tooltipFormatFieldlistKey = NETDATA.dataAttribute(state.element, 'sparkline-tooltipformatfieldlistkey', undefined);
+ let numberFormatter = NETDATA.dataAttribute(state.element, 'sparkline-numberformatter', function (n) {
+ return n.toFixed(2);
+ });
+ let numberDigitGroupSep = NETDATA.dataAttribute(state.element, 'sparkline-numberdigitgroupsep', undefined);
+ let numberDecimalMark = NETDATA.dataAttribute(state.element, 'sparkline-numberdecimalmark', undefined);
+ let numberDigitGroupCount = NETDATA.dataAttribute(state.element, 'sparkline-numberdigitgroupcount', undefined);
+ let animatedZooms = NETDATA.dataAttributeBoolean(state.element, 'sparkline-animatedzooms', false);
+
+ if (spotColor === 'disable') {
+ spotColor = '';
+ }
+ if (minSpotColor === 'disable') {
+ minSpotColor = '';
+ }
+ if (maxSpotColor === 'disable') {
+ maxSpotColor = '';
+ }
+
+ // state.log('sparkline type ' + type + ', lineColor: ' + lineColor + ', fillColor: ' + fillColor);
+
+ state.sparkline_options = {
+ type: type,
+ lineColor: lineColor,
+ fillColor: fillColor,
+ chartRangeMin: chartRangeMin,
+ chartRangeMax: chartRangeMax,
+ composite: composite,
+ enableTagOptions: enableTagOptions,
+ tagOptionPrefix: tagOptionPrefix,
+ tagValuesAttribute: tagValuesAttribute,
+ disableHiddenCheck: disableHiddenCheck,
+ defaultPixelsPerValue: defaultPixelsPerValue,
+ spotColor: spotColor,
+ minSpotColor: minSpotColor,
+ maxSpotColor: maxSpotColor,
+ spotRadius: spotRadius,
+ valueSpots: valueSpots,
+ highlightSpotColor: highlightSpotColor,
+ highlightLineColor: highlightLineColor,
+ lineWidth: lineWidth,
+ normalRangeMin: normalRangeMin,
+ normalRangeMax: normalRangeMax,
+ drawNormalOnTop: drawNormalOnTop,
+ xvalues: xvalues,
+ chartRangeClip: chartRangeClip,
+ chartRangeMinX: chartRangeMinX,
+ chartRangeMaxX: chartRangeMaxX,
+ disableInteraction: disableInteraction,
+ disableTooltips: disableTooltips,
+ disableHighlight: disableHighlight,
+ highlightLighten: highlightLighten,
+ highlightColor: highlightColor,
+ tooltipContainer: tooltipContainer,
+ tooltipClassname: tooltipClassname,
+ tooltipChartTitle: state.title,
+ tooltipFormat: tooltipFormat,
+ tooltipPrefix: tooltipPrefix,
+ tooltipSuffix: tooltipSuffix,
+ tooltipSkipNull: tooltipSkipNull,
+ tooltipValueLookups: tooltipValueLookups,
+ tooltipFormatFieldlist: tooltipFormatFieldlist,
+ tooltipFormatFieldlistKey: tooltipFormatFieldlistKey,
+ numberFormatter: numberFormatter,
+ numberDigitGroupSep: numberDigitGroupSep,
+ numberDecimalMark: numberDecimalMark,
+ numberDigitGroupCount: numberDigitGroupCount,
+ animatedZooms: animatedZooms,
+ width: state.chartWidth(),
+ height: state.chartHeight()
+ };
+
+ $(state.element_chart).sparkline(data.result, state.sparkline_options);
+
+ return true;
+};
+// google charts
+
+// Codacy declarations
+/* global google */
+
+NETDATA.googleInitialize = function (callback) {
+ if (typeof netdataNoGoogleCharts === 'undefined' || !netdataNoGoogleCharts) {
+ $.ajax({
+ url: NETDATA.google_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('google', NETDATA.google_js);
+ google.load('visualization', '1.1', {
+ 'packages': ['corechart', 'controls'],
+ 'callback': callback
+ });
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.google.enabled = false;
+ NETDATA.error(100, NETDATA.google_js);
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ } else {
+ NETDATA.chartLibraries.google.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.googleChartUpdate = function (state, data) {
+ let datatable = new google.visualization.DataTable(data.result);
+ state.google_instance.draw(datatable, state.google_options);
+ return true;
+};
+
+NETDATA.googleChartCreate = function (state, data) {
+ let datatable = new google.visualization.DataTable(data.result);
+
+ state.google_options = {
+ colors: state.chartColors(),
+
+ // do not set width, height - the chart resizes itself
+ //width: state.chartWidth(),
+ //height: state.chartHeight(),
+ lineWidth: 1,
+ title: state.title,
+ fontSize: 11,
+ hAxis: {
+ // title: "Time of Day",
+ // format:'HH:mm:ss',
+ viewWindowMode: 'maximized',
+ slantedText: false,
+ format: 'HH:mm:ss',
+ textStyle: {
+ fontSize: 9
+ },
+ gridlines: {
+ color: '#EEE'
+ }
+ },
+ vAxis: {
+ title: state.units_current,
+ viewWindowMode: 'pretty',
+ minValue: -0.1,
+ maxValue: 0.1,
+ direction: 1,
+ textStyle: {
+ fontSize: 9
+ },
+ gridlines: {
+ color: '#EEE'
+ }
+ },
+ chartArea: {
+ width: '65%',
+ height: '80%'
+ },
+ focusTarget: 'category',
+ annotation: {
+ '1': {
+ style: 'line'
+ }
+ },
+ pointsVisible: 0,
+ titlePosition: 'out',
+ titleTextStyle: {
+ fontSize: 11
+ },
+ tooltip: {
+ isHtml: false,
+ ignoreBounds: true,
+ textStyle: {
+ fontSize: 9
+ }
+ },
+ curveType: 'function',
+ areaOpacity: 0.3,
+ isStacked: false
+ };
+
+ switch (state.chart.chart_type) {
+ case "area":
+ state.google_options.vAxis.viewWindowMode = 'maximized';
+ state.google_options.areaOpacity = NETDATA.options.current.color_fill_opacity_area;
+ state.google_instance = new google.visualization.AreaChart(state.element_chart);
+ break;
+
+ case "stacked":
+ state.google_options.isStacked = true;
+ state.google_options.areaOpacity = NETDATA.options.current.color_fill_opacity_stacked;
+ state.google_options.vAxis.viewWindowMode = 'maximized';
+ state.google_options.vAxis.minValue = null;
+ state.google_options.vAxis.maxValue = null;
+ state.google_instance = new google.visualization.AreaChart(state.element_chart);
+ break;
+
+ default:
+ case "line":
+ state.google_options.lineWidth = 2;
+ state.google_instance = new google.visualization.LineChart(state.element_chart);
+ break;
+ }
+
+ state.google_instance.draw(datatable, state.google_options);
+ return true;
+};
+// gauge.js
+
+NETDATA.gaugeInitialize = function (callback) {
+ if (typeof netdataNoGauge === 'undefined' || !netdataNoGauge) {
+ $.ajax({
+ url: NETDATA.gauge_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('gauge', NETDATA.gauge_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.gauge.enabled = false;
+ NETDATA.error(100, NETDATA.gauge_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ })
+ }
+ else {
+ NETDATA.chartLibraries.gauge.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.gaugeAnimation = function (state, status) {
+ let speed = 32;
+
+ if (typeof status === 'boolean' && status === false) {
+ speed = 1000000000;
+ } else if (typeof status === 'number') {
+ speed = status;
+ }
+
+ // console.log('gauge speed ' + speed);
+ state.tmp.gauge_instance.animationSpeed = speed;
+ state.tmp.___gaugeOld__.speed = speed;
+};
+
+NETDATA.gaugeSet = function (state, value, min, max) {
+ if (typeof value !== 'number') {
+ value = 0;
+ }
+ if (typeof min !== 'number') {
+ min = 0;
+ }
+ if (typeof max !== 'number') {
+ max = 0;
+ }
+ if (value > max) {
+ max = value;
+ }
+ if (value < min) {
+ min = value;
+ }
+ if (min > max) {
+ let t = min;
+ min = max;
+ max = t;
+ }
+ else if (min === max) {
+ max = min + 1;
+ }
+
+ state.legendFormatValueDecimalsFromMinMax(min, max);
+
+ // gauge.js has an issue if the needle
+ // is smaller than min or larger than max
+ // when we set the new values
+ // the needle will go crazy
+
+ // to prevent it, we always feed it
+ // with a percentage, so that the needle
+ // is always between min and max
+ let pcent = (value - min) * 100 / (max - min);
+
+ // bug fix for gauge.js 1.3.1
+ // if the value is the absolute min or max, the chart is broken
+ if (pcent < 0.001) {
+ pcent = 0.001;
+ }
+ if (pcent > 99.999) {
+ pcent = 99.999;
+ }
+
+ state.tmp.gauge_instance.set(pcent);
+ // console.log('gauge set ' + pcent + ', value ' + value + ', min ' + min + ', max ' + max);
+
+ state.tmp.___gaugeOld__.value = value;
+ state.tmp.___gaugeOld__.min = min;
+ state.tmp.___gaugeOld__.max = max;
+};
+
+NETDATA.gaugeSetLabels = function (state, value, min, max) {
+ if (state.tmp.___gaugeOld__.valueLabel !== value) {
+ state.tmp.___gaugeOld__.valueLabel = value;
+ state.tmp.gaugeChartLabel.innerText = state.legendFormatValue(value);
+ }
+ if (state.tmp.___gaugeOld__.minLabel !== min) {
+ state.tmp.___gaugeOld__.minLabel = min;
+ state.tmp.gaugeChartMin.innerText = state.legendFormatValue(min);
+ }
+ if (state.tmp.___gaugeOld__.maxLabel !== max) {
+ state.tmp.___gaugeOld__.maxLabel = max;
+ state.tmp.gaugeChartMax.innerText = state.legendFormatValue(max);
+ }
+};
+
+NETDATA.gaugeClearSelection = function (state, force) {
+ if (typeof state.tmp.gaugeEvent !== 'undefined' && typeof state.tmp.gaugeEvent.timer !== 'undefined') {
+ NETDATA.timeout.clear(state.tmp.gaugeEvent.timer);
+ state.tmp.gaugeEvent.timer = undefined;
+ }
+
+ if (state.isAutoRefreshable() && state.data !== null && force !== true) {
+ NETDATA.gaugeChartUpdate(state, state.data);
+ } else {
+ NETDATA.gaugeAnimation(state, false);
+ NETDATA.gaugeSetLabels(state, null, null, null);
+ NETDATA.gaugeSet(state, null, null, null);
+ }
+
+ NETDATA.gaugeAnimation(state, true);
+ return true;
+};
+
+NETDATA.gaugeSetSelection = function (state, t) {
+ if (state.timeIsVisible(t) !== true) {
+ return NETDATA.gaugeClearSelection(state, true);
+ }
+
+ let slot = state.calculateRowForTime(t);
+ if (slot < 0 || slot >= state.data.result.length) {
+ return NETDATA.gaugeClearSelection(state, true);
+ }
+
+ if (typeof state.tmp.gaugeEvent === 'undefined') {
+ state.tmp.gaugeEvent = {
+ timer: undefined,
+ value: 0,
+ min: 0,
+ max: 0
+ };
+ }
+
+ let value = state.data.result[state.data.result.length - 1 - slot];
+ let min = (state.tmp.gaugeMin === null) ? NETDATA.commonMin.get(state) : state.tmp.gaugeMin;
+ let max = (state.tmp.gaugeMax === null) ? NETDATA.commonMax.get(state) : state.tmp.gaugeMax;
+
+ // make sure it is zero based
+ // but only if it has not been set by the user
+ if (state.tmp.gaugeMin === null && min > 0) {
+ min = 0;
+ }
+ if (state.tmp.gaugeMax === null && max < 0) {
+ max = 0;
+ }
+
+ state.tmp.gaugeEvent.value = value;
+ state.tmp.gaugeEvent.min = min;
+ state.tmp.gaugeEvent.max = max;
+ NETDATA.gaugeSetLabels(state, value, min, max);
+
+ if (state.tmp.gaugeEvent.timer === undefined) {
+ NETDATA.gaugeAnimation(state, false);
+
+ state.tmp.gaugeEvent.timer = NETDATA.timeout.set(function () {
+ state.tmp.gaugeEvent.timer = undefined;
+ NETDATA.gaugeSet(state, state.tmp.gaugeEvent.value, state.tmp.gaugeEvent.min, state.tmp.gaugeEvent.max);
+ }, 0);
+ }
+
+ return true;
+};
+
+NETDATA.gaugeChartUpdate = function (state, data) {
+ let value, min, max;
+
+ if (NETDATA.globalPanAndZoom.isActive() || state.isAutoRefreshable() === false) {
+ NETDATA.gaugeSetLabels(state, null, null, null);
+ state.tmp.gauge_instance.set(0);
+ } else {
+ value = data.result[0];
+ min = (state.tmp.gaugeMin === null) ? NETDATA.commonMin.get(state) : state.tmp.gaugeMin;
+ max = (state.tmp.gaugeMax === null) ? NETDATA.commonMax.get(state) : state.tmp.gaugeMax;
+ if (value < min) {
+ min = value;
+ }
+ if (value > max) {
+ max = value;
+ }
+
+ // make sure it is zero based
+ // but only if it has not been set by the user
+ if (state.tmp.gaugeMin === null && min > 0) {
+ min = 0;
+ }
+ if (state.tmp.gaugeMax === null && max < 0) {
+ max = 0;
+ }
+
+ NETDATA.gaugeSet(state, value, min, max);
+ NETDATA.gaugeSetLabels(state, value, min, max);
+ }
+
+ return true;
+};
+
+NETDATA.gaugeChartCreate = function (state, data) {
+ // let chart = $(state.element_chart);
+
+ let value = data.result[0];
+ let min = NETDATA.dataAttribute(state.element, 'gauge-min-value', null);
+ let max = NETDATA.dataAttribute(state.element, 'gauge-max-value', null);
+ // let adjust = NETDATA.dataAttribute(state.element, 'gauge-adjust', null);
+ let pointerColor = NETDATA.dataAttribute(state.element, 'gauge-pointer-color', NETDATA.themes.current.gauge_pointer);
+ let strokeColor = NETDATA.dataAttribute(state.element, 'gauge-stroke-color', NETDATA.themes.current.gauge_stroke);
+ let startColor = NETDATA.dataAttribute(state.element, 'gauge-start-color', state.chartCustomColors()[0]);
+ let stopColor = NETDATA.dataAttribute(state.element, 'gauge-stop-color', void 0);
+ let generateGradient = NETDATA.dataAttribute(state.element, 'gauge-generate-gradient', false);
+
+ if (min === null) {
+ min = NETDATA.commonMin.get(state);
+ state.tmp.gaugeMin = null;
+ } else {
+ state.tmp.gaugeMin = min;
+ }
+
+ if (max === null) {
+ max = NETDATA.commonMax.get(state);
+ state.tmp.gaugeMax = null;
+ } else {
+ state.tmp.gaugeMax = max;
+ }
+
+ // make sure it is zero based
+ // but only if it has not been set by the user
+ if (state.tmp.gaugeMin === null && min > 0) {
+ min = 0;
+ }
+ if (state.tmp.gaugeMax === null && max < 0) {
+ max = 0;
+ }
+
+ let width = state.chartWidth(), height = state.chartHeight(); //, ratio = 1.5;
+ // console.log('gauge width: ' + width.toString() + ', height: ' + height.toString());
+ //switch(adjust) {
+ // case 'width': width = height * ratio; break;
+ // case 'height':
+ // default: height = width / ratio; break;
+ //}
+ //state.element.style.width = width.toString() + 'px';
+ //state.element.style.height = height.toString() + 'px';
+
+ let lum_d = 0.05;
+
+ let options = {
+ lines: 12, // The number of lines to draw
+ angle: 0.14, // The span of the gauge arc
+ lineWidth: 0.57, // The line thickness
+ radiusScale: 1.0, // Relative radius
+ pointer: {
+ length: 0.85, // 0.9 The radius of the inner circle
+ strokeWidth: 0.045, // The rotation offset
+ color: pointerColor // Fill color
+ },
+ limitMax: true, // If false, the max value of the gauge will be updated if value surpass max
+ limitMin: true, // If true, the min value of the gauge will be fixed unless you set it manually
+ colorStart: startColor, // Colors
+ colorStop: stopColor, // just experiment with them
+ strokeColor: strokeColor, // to see which ones work best for you
+ generateGradient: (generateGradient === true), // gmosx:
+ gradientType: 0,
+ highDpiSupport: true // High resolution support
+ };
+
+ if (generateGradient.constructor === Array) {
+ // example options:
+ // data-gauge-generate-gradient="[0, 50, 100]"
+ // data-gauge-gradient-percent-color-0="#FFFFFF"
+ // data-gauge-gradient-percent-color-50="#999900"
+ // data-gauge-gradient-percent-color-100="#000000"
+
+ options.percentColors = [];
+ let len = generateGradient.length;
+ while (len--) {
+ let pcent = generateGradient[len];
+ let color = NETDATA.dataAttribute(state.element, 'gauge-gradient-percent-color-' + pcent.toString(), false);
+ if (color !== false) {
+ let a = [];
+ a[0] = pcent / 100;
+ a[1] = color;
+ options.percentColors.unshift(a);
+ }
+ }
+ if (options.percentColors.length === 0) {
+ delete options.percentColors;
+ }
+ } else if (generateGradient === false && NETDATA.themes.current.gauge_gradient) {
+ //noinspection PointlessArithmeticExpressionJS
+ options.percentColors = [
+ [0.0, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 0))],
+ [0.1, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 1))],
+ [0.2, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 2))],
+ [0.3, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 3))],
+ [0.4, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 4))],
+ [0.5, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 5))],
+ [0.6, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 6))],
+ [0.7, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 7))],
+ [0.8, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 8))],
+ [0.9, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 9))],
+ [1.0, NETDATA.colorLuminance(startColor, 0.0)]];
+ }
+
+ state.tmp.gauge_canvas = document.createElement('canvas');
+ state.tmp.gauge_canvas.id = 'gauge-' + state.uuid + '-canvas';
+ state.tmp.gauge_canvas.className = 'gaugeChart';
+ state.tmp.gauge_canvas.width = width;
+ state.tmp.gauge_canvas.height = height;
+ state.element_chart.appendChild(state.tmp.gauge_canvas);
+
+ let valuefontsize = Math.floor(height / 5);
+ let valuetop = Math.round((height - valuefontsize) / 3.2);
+ state.tmp.gaugeChartLabel = document.createElement('span');
+ state.tmp.gaugeChartLabel.className = 'gaugeChartLabel';
+ state.tmp.gaugeChartLabel.style.fontSize = valuefontsize + 'px';
+ state.tmp.gaugeChartLabel.style.top = valuetop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartLabel);
+
+ let titlefontsize = Math.round(valuefontsize / 2.1);
+ let titletop = 0;
+ state.tmp.gaugeChartTitle = document.createElement('span');
+ state.tmp.gaugeChartTitle.className = 'gaugeChartTitle';
+ state.tmp.gaugeChartTitle.innerText = state.title;
+ state.tmp.gaugeChartTitle.style.fontSize = titlefontsize + 'px';
+ state.tmp.gaugeChartTitle.style.lineHeight = titlefontsize + 'px';
+ state.tmp.gaugeChartTitle.style.top = titletop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartTitle);
+
+ let unitfontsize = Math.round(titlefontsize * 0.9);
+ state.tmp.gaugeChartUnits = document.createElement('span');
+ state.tmp.gaugeChartUnits.className = 'gaugeChartUnits';
+ state.tmp.gaugeChartUnits.innerText = state.units_current;
+ state.tmp.gaugeChartUnits.style.fontSize = unitfontsize + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartUnits);
+
+ state.tmp.gaugeChartMin = document.createElement('span');
+ state.tmp.gaugeChartMin.className = 'gaugeChartMin';
+ state.tmp.gaugeChartMin.style.fontSize = Math.round(valuefontsize * 0.75).toString() + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartMin);
+
+ state.tmp.gaugeChartMax = document.createElement('span');
+ state.tmp.gaugeChartMax.className = 'gaugeChartMax';
+ state.tmp.gaugeChartMax.style.fontSize = Math.round(valuefontsize * 0.75).toString() + 'px';
+ state.element_chart.appendChild(state.tmp.gaugeChartMax);
+
+ // when we just re-create the chart
+ // do not animate the first update
+ let animate = true;
+ if (typeof state.tmp.gauge_instance !== 'undefined') {
+ animate = false;
+ }
+
+ state.tmp.gauge_instance = new Gauge(state.tmp.gauge_canvas).setOptions(options); // create sexy gauge!
+
+ state.tmp.___gaugeOld__ = {
+ value: value,
+ min: min,
+ max: max,
+ valueLabel: null,
+ minLabel: null,
+ maxLabel: null
+ };
+
+ // we will always feed a percentage
+ state.tmp.gauge_instance.minValue = 0;
+ state.tmp.gauge_instance.maxValue = 100;
+
+ NETDATA.gaugeAnimation(state, animate);
+ NETDATA.gaugeSet(state, value, min, max);
+ NETDATA.gaugeSetLabels(state, value, min, max);
+ NETDATA.gaugeAnimation(state, true);
+
+ state.legendSetUnitsString = function (units) {
+ if (typeof state.tmp.gaugeChartUnits !== 'undefined' && state.tmp.units !== units) {
+ state.tmp.gaugeChartUnits.innerText = units;
+ state.tmp.___gaugeOld__.valueLabel = null;
+ state.tmp.___gaugeOld__.minLabel = null;
+ state.tmp.___gaugeOld__.maxLabel = null;
+ state.tmp.units = units;
+ }
+ };
+ state.legendShowUndefined = function () {
+ if (typeof state.tmp.gauge_instance !== 'undefined') {
+ NETDATA.gaugeClearSelection(state);
+ }
+ };
+
+ return true;
+};
+// ----------------------------------------------------------------------------------------------------------------
+
+NETDATA.easypiechartPercentFromValueMinMax = function (state, value, min, max) {
+ if (typeof value !== 'number') {
+ value = 0;
+ }
+ if (typeof min !== 'number') {
+ min = 0;
+ }
+ if (typeof max !== 'number') {
+ max = 0;
+ }
+
+ if (min > max) {
+ let t = min;
+ min = max;
+ max = t;
+ }
+
+ if (min > value) {
+ min = value;
+ }
+ if (max < value) {
+ max = value;
+ }
+
+ state.legendFormatValueDecimalsFromMinMax(min, max);
+
+ if (state.tmp.easyPieChartMin === null && min > 0) {
+ min = 0;
+ }
+ if (state.tmp.easyPieChartMax === null && max < 0) {
+ max = 0;
+ }
+
+ let pcent;
+
+ if (min < 0 && max > 0) {
+ // it is both positive and negative
+ // zero at the top center of the chart
+ max = (-min > max) ? -min : max;
+ pcent = Math.round(value * 100 / max);
+ } else if (value >= 0 && min >= 0 && max >= 0) {
+ // clockwise
+ pcent = Math.round((value - min) * 100 / (max - min));
+ if (pcent === 0) {
+ pcent = 0.1;
+ }
+ } else {
+ // counter clockwise
+ pcent = Math.round((value - max) * 100 / (max - min));
+ if (pcent === 0) {
+ pcent = -0.1;
+ }
+ }
+
+ return pcent;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// easy-pie-chart
+
+NETDATA.easypiechartInitialize = function (callback) {
+ if (typeof netdataNoEasyPieChart === 'undefined' || !netdataNoEasyPieChart) {
+ $.ajax({
+ url: NETDATA.easypiechart_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('easypiechart', NETDATA.easypiechart_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.easypiechart.enabled = false;
+ NETDATA.error(100, NETDATA.easypiechart_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ })
+ } else {
+ NETDATA.chartLibraries.easypiechart.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.easypiechartClearSelection = function (state, force) {
+ if (typeof state.tmp.easyPieChartEvent !== 'undefined' && typeof state.tmp.easyPieChartEvent.timer !== 'undefined') {
+ NETDATA.timeout.clear(state.tmp.easyPieChartEvent.timer);
+ state.tmp.easyPieChartEvent.timer = undefined;
+ }
+
+ if (state.isAutoRefreshable() && state.data !== null && force !== true) {
+ NETDATA.easypiechartChartUpdate(state, state.data);
+ }
+ else {
+ state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(null);
+ state.tmp.easyPieChart_instance.update(0);
+ }
+ state.tmp.easyPieChart_instance.enableAnimation();
+
+ return true;
+};
+
+NETDATA.easypiechartSetSelection = function (state, t) {
+ if (state.timeIsVisible(t) !== true) {
+ return NETDATA.easypiechartClearSelection(state, true);
+ }
+
+ let slot = state.calculateRowForTime(t);
+ if (slot < 0 || slot >= state.data.result.length) {
+ return NETDATA.easypiechartClearSelection(state, true);
+ }
+
+ if (typeof state.tmp.easyPieChartEvent === 'undefined') {
+ state.tmp.easyPieChartEvent = {
+ timer: undefined,
+ value: 0,
+ pcent: 0
+ };
+ }
+
+ let value = state.data.result[state.data.result.length - 1 - slot];
+ let min = (state.tmp.easyPieChartMin === null) ? NETDATA.commonMin.get(state) : state.tmp.easyPieChartMin;
+ let max = (state.tmp.easyPieChartMax === null) ? NETDATA.commonMax.get(state) : state.tmp.easyPieChartMax;
+ let pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+
+ state.tmp.easyPieChartEvent.value = value;
+ state.tmp.easyPieChartEvent.pcent = pcent;
+ state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+
+ if (state.tmp.easyPieChartEvent.timer === undefined) {
+ state.tmp.easyPieChart_instance.disableAnimation();
+
+ state.tmp.easyPieChartEvent.timer = NETDATA.timeout.set(function () {
+ state.tmp.easyPieChartEvent.timer = undefined;
+ state.tmp.easyPieChart_instance.update(state.tmp.easyPieChartEvent.pcent);
+ }, 0);
+ }
+
+ return true;
+};
+
+NETDATA.easypiechartChartUpdate = function (state, data) {
+ let value, min, max, pcent;
+
+ if (NETDATA.globalPanAndZoom.isActive() || state.isAutoRefreshable() === false) {
+ value = null;
+ pcent = 0;
+ }
+ else {
+ value = data.result[0];
+ min = (state.tmp.easyPieChartMin === null) ? NETDATA.commonMin.get(state) : state.tmp.easyPieChartMin;
+ max = (state.tmp.easyPieChartMax === null) ? NETDATA.commonMax.get(state) : state.tmp.easyPieChartMax;
+ pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+ }
+
+ state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+ state.tmp.easyPieChart_instance.update(pcent);
+ return true;
+};
+
+NETDATA.easypiechartChartCreate = function (state, data) {
+ let chart = $(state.element_chart);
+
+ let value = data.result[0];
+ let min = NETDATA.dataAttribute(state.element, 'easypiechart-min-value', null);
+ let max = NETDATA.dataAttribute(state.element, 'easypiechart-max-value', null);
+
+ if (min === null) {
+ min = NETDATA.commonMin.get(state);
+ state.tmp.easyPieChartMin = null;
+ }
+ else {
+ state.tmp.easyPieChartMin = min;
+ }
+
+ if (max === null) {
+ max = NETDATA.commonMax.get(state);
+ state.tmp.easyPieChartMax = null;
+ }
+ else {
+ state.tmp.easyPieChartMax = max;
+ }
+
+ let size = state.chartWidth();
+ let stroke = Math.floor(size / 22);
+ if (stroke < 3) {
+ stroke = 2;
+ }
+
+ let valuefontsize = Math.floor((size * 2 / 3) / 5);
+ let valuetop = Math.round((size - valuefontsize - (size / 40)) / 2);
+ state.tmp.easyPieChartLabel = document.createElement('span');
+ state.tmp.easyPieChartLabel.className = 'easyPieChartLabel';
+ state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+ state.tmp.easyPieChartLabel.style.fontSize = valuefontsize + 'px';
+ state.tmp.easyPieChartLabel.style.top = valuetop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.easyPieChartLabel);
+
+ let titlefontsize = Math.round(valuefontsize * 1.6 / 3);
+ let titletop = Math.round(valuetop - (titlefontsize * 2) - (size / 40));
+ state.tmp.easyPieChartTitle = document.createElement('span');
+ state.tmp.easyPieChartTitle.className = 'easyPieChartTitle';
+ state.tmp.easyPieChartTitle.innerText = state.title;
+ state.tmp.easyPieChartTitle.style.fontSize = titlefontsize + 'px';
+ state.tmp.easyPieChartTitle.style.lineHeight = titlefontsize + 'px';
+ state.tmp.easyPieChartTitle.style.top = titletop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.easyPieChartTitle);
+
+ let unitfontsize = Math.round(titlefontsize * 0.9);
+ let unittop = Math.round(valuetop + (valuefontsize + unitfontsize) + (size / 40));
+ state.tmp.easyPieChartUnits = document.createElement('span');
+ state.tmp.easyPieChartUnits.className = 'easyPieChartUnits';
+ state.tmp.easyPieChartUnits.innerText = state.units_current;
+ state.tmp.easyPieChartUnits.style.fontSize = unitfontsize + 'px';
+ state.tmp.easyPieChartUnits.style.top = unittop.toString() + 'px';
+ state.element_chart.appendChild(state.tmp.easyPieChartUnits);
+
+ let barColor = NETDATA.dataAttribute(state.element, 'easypiechart-barcolor', undefined);
+ if (typeof barColor === 'undefined' || barColor === null) {
+ barColor = state.chartCustomColors()[0];
+ } else {
+ // <div ... data-easypiechart-barcolor="(function(percent){return(percent < 50 ? '#5cb85c' : percent < 85 ? '#f0ad4e' : '#cb3935');})" ...></div>
+ let tmp = eval(barColor);
+ if (typeof tmp === 'function') {
+ barColor = tmp;
+ }
+ }
+
+ let pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+ chart.data('data-percent', pcent);
+
+ chart.easyPieChart({
+ barColor: barColor,
+ trackColor: NETDATA.dataAttribute(state.element, 'easypiechart-trackcolor', NETDATA.themes.current.easypiechart_track),
+ scaleColor: NETDATA.dataAttribute(state.element, 'easypiechart-scalecolor', NETDATA.themes.current.easypiechart_scale),
+ scaleLength: NETDATA.dataAttribute(state.element, 'easypiechart-scalelength', 5),
+ lineCap: NETDATA.dataAttribute(state.element, 'easypiechart-linecap', 'round'),
+ lineWidth: NETDATA.dataAttribute(state.element, 'easypiechart-linewidth', stroke),
+ trackWidth: NETDATA.dataAttribute(state.element, 'easypiechart-trackwidth', undefined),
+ size: NETDATA.dataAttribute(state.element, 'easypiechart-size', size),
+ rotate: NETDATA.dataAttribute(state.element, 'easypiechart-rotate', 0),
+ animate: NETDATA.dataAttribute(state.element, 'easypiechart-animate', {duration: 500, enabled: true}),
+ easing: NETDATA.dataAttribute(state.element, 'easypiechart-easing', undefined)
+ });
+
+ // when we just re-create the chart
+ // do not animate the first update
+ let animate = true;
+ if (typeof state.tmp.easyPieChart_instance !== 'undefined') {
+ animate = false;
+ }
+
+ state.tmp.easyPieChart_instance = chart.data('easyPieChart');
+ if (animate === false) {
+ state.tmp.easyPieChart_instance.disableAnimation();
+ }
+ state.tmp.easyPieChart_instance.update(pcent);
+ if (animate === false) {
+ state.tmp.easyPieChart_instance.enableAnimation();
+ }
+
+ state.legendSetUnitsString = function (units) {
+ if (typeof state.tmp.easyPieChartUnits !== 'undefined' && state.tmp.units !== units) {
+ state.tmp.easyPieChartUnits.innerText = units;
+ state.tmp.units = units;
+ }
+ };
+ state.legendShowUndefined = function () {
+ if (typeof state.tmp.easyPieChart_instance !== 'undefined') {
+ NETDATA.easypiechartClearSelection(state);
+ }
+ };
+
+ return true;
+};
+
+// d3pie
+
+NETDATA.d3pieInitialize = function (callback) {
+ if (typeof netdataNoD3pie === 'undefined' || !netdataNoD3pie) {
+
+ // d3pie requires D3
+ if (!NETDATA.chartLibraries.d3.initialized) {
+ if (NETDATA.chartLibraries.d3.enabled) {
+ NETDATA.d3Initialize(function () {
+ NETDATA.d3pieInitialize(callback);
+ });
+ } else {
+ NETDATA.chartLibraries.d3pie.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+ } else {
+ $.ajax({
+ url: NETDATA.d3pie_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('d3pie', NETDATA.d3pie_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.d3pie.enabled = false;
+ NETDATA.error(100, NETDATA.d3pie_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ }
+ } else {
+ NETDATA.chartLibraries.d3pie.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.d3pieSetContent = function (state, data, index) {
+ state.legendFormatValueDecimalsFromMinMax(
+ data.min,
+ data.max
+ );
+
+ let content = [];
+ let colors = state.chartColors();
+ let len = data.result.labels.length;
+ for (let i = 1; i < len; i++) {
+ let label = data.result.labels[i];
+ let value = data.result.data[index][label];
+ let color = colors[i - 1];
+
+ if (value !== null && value > 0) {
+ content.push({
+ label: label,
+ value: value,
+ color: color
+ });
+ }
+ }
+
+ if (content.length === 0) {
+ content.push({
+ label: 'no data',
+ value: 100,
+ color: '#666666'
+ });
+ }
+
+ state.tmp.d3pie_last_slot = index;
+ return content;
+};
+
+NETDATA.d3pieDateRange = function (state, data, index) {
+ let dt = Math.round((data.before - data.after + 1) / data.points);
+ let dt_str = NETDATA.seconds4human(dt);
+
+ let before = data.result.data[index].time;
+ let after = before - (dt * 1000);
+
+ let d1 = NETDATA.dateTime.localeDateString(after);
+ let t1 = NETDATA.dateTime.localeTimeString(after);
+ let d2 = NETDATA.dateTime.localeDateString(before);
+ let t2 = NETDATA.dateTime.localeTimeString(before);
+
+ if (d1 === d2) {
+ return d1 + ' ' + t1 + ' to ' + t2 + ', ' + dt_str;
+ }
+
+ return d1 + ' ' + t1 + ' to ' + d2 + ' ' + t2 + ', ' + dt_str;
+};
+
+NETDATA.d3pieSetSelection = function (state, t) {
+ if (state.timeIsVisible(t) !== true) {
+ return NETDATA.d3pieClearSelection(state, true);
+ }
+
+ let slot = state.calculateRowForTime(t);
+ slot = state.data.result.data.length - slot - 1;
+
+ if (slot < 0 || slot >= state.data.result.length) {
+ return NETDATA.d3pieClearSelection(state, true);
+ }
+
+ if (state.tmp.d3pie_last_slot === slot) {
+ // we already show this slot, don't do anything
+ return true;
+ }
+
+ if (state.tmp.d3pie_timer === undefined) {
+ state.tmp.d3pie_timer = NETDATA.timeout.set(function () {
+ state.tmp.d3pie_timer = undefined;
+ NETDATA.d3pieChange(state, NETDATA.d3pieSetContent(state, state.data, slot), NETDATA.d3pieDateRange(state, state.data, slot));
+ }, 0);
+ }
+
+ return true;
+};
+
+NETDATA.d3pieClearSelection = function (state, force) {
+ if (typeof state.tmp.d3pie_timer !== 'undefined') {
+ NETDATA.timeout.clear(state.tmp.d3pie_timer);
+ state.tmp.d3pie_timer = undefined;
+ }
+
+ if (state.isAutoRefreshable() && state.data !== null && force !== true) {
+ NETDATA.d3pieChartUpdate(state, state.data);
+ } else {
+ if (state.tmp.d3pie_last_slot !== -1) {
+ state.tmp.d3pie_last_slot = -1;
+ NETDATA.d3pieChange(state, [{label: 'no data', value: 1, color: '#666666'}], 'no data available');
+ }
+ }
+
+ return true;
+};
+
+NETDATA.d3pieChange = function (state, content, footer) {
+ if (state.d3pie_forced_subtitle === null) {
+ //state.d3pie_instance.updateProp("header.subtitle.text", state.units_current);
+ state.d3pie_instance.options.header.subtitle.text = state.units_current;
+ }
+
+ if (state.d3pie_forced_footer === null) {
+ //state.d3pie_instance.updateProp("footer.text", footer);
+ state.d3pie_instance.options.footer.text = footer;
+ }
+
+ //state.d3pie_instance.updateProp("data.content", content);
+ state.d3pie_instance.options.data.content = content;
+ state.d3pie_instance.destroy();
+ state.d3pie_instance.recreate();
+ return true;
+};
+
+NETDATA.d3pieChartUpdate = function (state, data) {
+ return NETDATA.d3pieChange(state, NETDATA.d3pieSetContent(state, data, 0), NETDATA.d3pieDateRange(state, data, 0));
+};
+
+NETDATA.d3pieChartCreate = function (state, data) {
+
+ state.element_chart.id = 'd3pie-' + state.uuid;
+ // console.log('id = ' + state.element_chart.id);
+
+ let content = NETDATA.d3pieSetContent(state, data, 0);
+
+ state.d3pie_forced_title = NETDATA.dataAttribute(state.element, 'd3pie-title', null);
+ state.d3pie_forced_subtitle = NETDATA.dataAttribute(state.element, 'd3pie-subtitle', null);
+ state.d3pie_forced_footer = NETDATA.dataAttribute(state.element, 'd3pie-footer', null);
+
+ state.d3pie_options = {
+ header: {
+ title: {
+ text: (state.d3pie_forced_title !== null) ? state.d3pie_forced_title : state.title,
+ color: NETDATA.dataAttribute(state.element, 'd3pie-title-color', NETDATA.themes.current.d3pie.title),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-title-fontsize', 12),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-title-fontweight', "bold"),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-title-font', "arial")
+ },
+ subtitle: {
+ text: (state.d3pie_forced_subtitle !== null) ? state.d3pie_forced_subtitle : state.units_current,
+ color: NETDATA.dataAttribute(state.element, 'd3pie-subtitle-color', NETDATA.themes.current.d3pie.subtitle),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-subtitle-fontsize', 10),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-subtitle-fontweight', "normal"),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-subtitle-font', "arial")
+ },
+ titleSubtitlePadding: 1
+ },
+ footer: {
+ text: (state.d3pie_forced_footer !== null) ? state.d3pie_forced_footer : NETDATA.d3pieDateRange(state, data, 0),
+ color: NETDATA.dataAttribute(state.element, 'd3pie-footer-color', NETDATA.themes.current.d3pie.footer),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-footer-fontsize', 9),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-footer-fontweight', "bold"),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-footer-font', "arial"),
+ location: NETDATA.dataAttribute(state.element, 'd3pie-footer-location', "bottom-center") // bottom-left, bottom-center, bottom-right
+ },
+ size: {
+ canvasHeight: state.chartHeight(),
+ canvasWidth: state.chartWidth(),
+ pieInnerRadius: NETDATA.dataAttribute(state.element, 'd3pie-pieinnerradius', "45%"),
+ pieOuterRadius: NETDATA.dataAttribute(state.element, 'd3pie-pieouterradius', "80%")
+ },
+ data: {
+ // none, random, value-asc, value-desc, label-asc, label-desc
+ sortOrder: NETDATA.dataAttribute(state.element, 'd3pie-sortorder', "value-desc"),
+ smallSegmentGrouping: {
+ enabled: NETDATA.dataAttributeBoolean(state.element, "d3pie-smallsegmentgrouping-enabled", false),
+ value: NETDATA.dataAttribute(state.element, 'd3pie-smallsegmentgrouping-value', 1),
+ // percentage, value
+ valueType: NETDATA.dataAttribute(state.element, 'd3pie-smallsegmentgrouping-valuetype', "percentage"),
+ label: NETDATA.dataAttribute(state.element, 'd3pie-smallsegmentgrouping-label', "other"),
+ color: NETDATA.dataAttribute(state.element, 'd3pie-smallsegmentgrouping-color', NETDATA.themes.current.d3pie.other)
+ },
+
+ // REQUIRED! This is where you enter your pie data; it needs to be an array of objects
+ // of this form: { label: "label", value: 1.5, color: "#000000" } - color is optional
+ content: content
+ },
+ labels: {
+ outer: {
+ // label, value, percentage, label-value1, label-value2, label-percentage1, label-percentage2
+ format: NETDATA.dataAttribute(state.element, 'd3pie-labels-outer-format', "label-value1"),
+ hideWhenLessThanPercentage: NETDATA.dataAttribute(state.element, 'd3pie-labels-outer-hidewhenlessthanpercentage', null),
+ pieDistance: NETDATA.dataAttribute(state.element, 'd3pie-labels-outer-piedistance', 15)
+ },
+ inner: {
+ // label, value, percentage, label-value1, label-value2, label-percentage1, label-percentage2
+ format: NETDATA.dataAttribute(state.element, 'd3pie-labels-inner-format', "percentage"),
+ hideWhenLessThanPercentage: NETDATA.dataAttribute(state.element, 'd3pie-labels-inner-hidewhenlessthanpercentage', 2)
+ },
+ mainLabel: {
+ color: NETDATA.dataAttribute(state.element, 'd3pie-labels-mainLabel-color', NETDATA.themes.current.d3pie.mainlabel), // or 'segment' for dynamic color
+ font: NETDATA.dataAttribute(state.element, 'd3pie-labels-mainLabel-font', "arial"),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-labels-mainLabel-fontsize', 10),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-labels-mainLabel-fontweight', "normal")
+ },
+ percentage: {
+ color: NETDATA.dataAttribute(state.element, 'd3pie-labels-percentage-color', NETDATA.themes.current.d3pie.percentage),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-labels-percentage-font', "arial"),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-labels-percentage-fontsize', 10),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-labels-percentage-fontweight', "bold"),
+ decimalPlaces: 0
+ },
+ value: {
+ color: NETDATA.dataAttribute(state.element, 'd3pie-labels-value-color', NETDATA.themes.current.d3pie.value),
+ font: NETDATA.dataAttribute(state.element, 'd3pie-labels-value-font', "arial"),
+ fontSize: NETDATA.dataAttribute(state.element, 'd3pie-labels-value-fontsize', 10),
+ fontWeight: NETDATA.dataAttribute(state.element, 'd3pie-labels-value-fontweight', "bold")
+ },
+ lines: {
+ enabled: NETDATA.dataAttributeBoolean(state.element, 'd3pie-labels-lines-enabled', true),
+ style: NETDATA.dataAttribute(state.element, 'd3pie-labels-lines-style', "curved"),
+ color: NETDATA.dataAttribute(state.element, 'd3pie-labels-lines-color', "segment") // "segment" or a hex color
+ },
+ truncation: {
+ enabled: NETDATA.dataAttributeBoolean(state.element, 'd3pie-labels-truncation-enabled', false),
+ truncateLength: NETDATA.dataAttribute(state.element, 'd3pie-labels-truncation-truncatelength', 30)
+ },
+ formatter: function (context) {
+ // console.log(context);
+ if (context.part === 'value') {
+ return state.legendFormatValue(context.value);
+ }
+ if (context.part === 'percentage') {
+ return context.label + '%';
+ }
+
+ return context.label;
+ }
+ },
+ effects: {
+ load: {
+ effect: "none", // none / default
+ speed: 0 // commented in the d3pie code to speed it up
+ },
+ pullOutSegmentOnClick: {
+ effect: "bounce", // none / linear / bounce / elastic / back
+ speed: 400,
+ size: 5
+ },
+ highlightSegmentOnMouseover: true,
+ highlightLuminosity: -0.2
+ },
+ tooltips: {
+ enabled: false,
+ type: "placeholder", // caption|placeholder
+ string: "",
+ placeholderParser: null, // function
+ styles: {
+ fadeInSpeed: 250,
+ backgroundColor: NETDATA.themes.current.d3pie.tooltip_bg,
+ backgroundOpacity: 0.5,
+ color: NETDATA.themes.current.d3pie.tooltip_fg,
+ borderRadius: 2,
+ font: "arial",
+ fontSize: 12,
+ padding: 4
+ }
+ },
+ misc: {
+ colors: {
+ background: 'transparent', // transparent or color #
+ // segments: state.chartColors(),
+ segmentStroke: NETDATA.dataAttribute(state.element, 'd3pie-misc-colors-segmentstroke', NETDATA.themes.current.d3pie.segment_stroke)
+ },
+ gradient: {
+ enabled: NETDATA.dataAttributeBoolean(state.element, 'd3pie-misc-gradient-enabled', false),
+ percentage: NETDATA.dataAttribute(state.element, 'd3pie-misc-colors-percentage', 95),
+ color: NETDATA.dataAttribute(state.element, 'd3pie-misc-gradient-color', NETDATA.themes.current.d3pie.gradient_color)
+ },
+ canvasPadding: {
+ top: 5,
+ right: 5,
+ bottom: 5,
+ left: 5
+ },
+ pieCenterOffset: {
+ x: 0,
+ y: 0
+ },
+ cssPrefix: NETDATA.dataAttribute(state.element, 'd3pie-cssprefix', null)
+ },
+ callbacks: {
+ onload: null,
+ onMouseoverSegment: null,
+ onMouseoutSegment: null,
+ onClickSegment: null
+ }
+ };
+
+ state.d3pie_instance = new d3pie(state.element_chart, state.d3pie_options);
+ return true;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// D3
+
+NETDATA.d3Initialize = function(callback) {
+ if (typeof netdataStopD3 === 'undefined' || !netdataStopD3) {
+ $.ajax({
+ url: NETDATA.d3_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: { withCredentials: true } // required for the cookie
+ })
+ .done(function() {
+ NETDATA.registerChartLibrary('d3', NETDATA.d3_js);
+ })
+ .fail(function() {
+ NETDATA.chartLibraries.d3.enabled = false;
+ NETDATA.error(100, NETDATA.d3_js);
+ })
+ .always(function() {
+ if (typeof callback === "function")
+ return callback();
+ });
+ } else {
+ NETDATA.chartLibraries.d3.enabled = false;
+ if (typeof callback === "function")
+ return callback();
+ }
+};
+
+NETDATA.d3ChartUpdate = function(state, data) {
+ void(state);
+ void(data);
+
+ return false;
+};
+
+NETDATA.d3ChartCreate = function(state, data) {
+ void(state);
+ void(data);
+
+ return false;
+};
+
+// peity
+
+NETDATA.peityInitialize = function (callback) {
+ if (typeof netdataNoPeitys === 'undefined' || !netdataNoPeitys) {
+ $.ajax({
+ url: NETDATA.peity_js,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ NETDATA.registerChartLibrary('peity', NETDATA.peity_js);
+ })
+ .fail(function () {
+ NETDATA.chartLibraries.peity.enabled = false;
+ NETDATA.error(100, NETDATA.peity_js);
+ })
+ .always(function () {
+ if (typeof callback === "function") {
+ return callback();
+ }
+ });
+ } else {
+ NETDATA.chartLibraries.peity.enabled = false;
+ if (typeof callback === "function") {
+ return callback();
+ }
+ }
+};
+
+NETDATA.peityChartUpdate = function (state, data) {
+ state.peity_instance.innerHTML = data.result;
+
+ if (state.peity_options.stroke !== state.chartCustomColors()[0]) {
+ state.peity_options.stroke = state.chartCustomColors()[0];
+ if (state.chart.chart_type === 'line') {
+ state.peity_options.fill = NETDATA.themes.current.background;
+ } else {
+ state.peity_options.fill = NETDATA.colorLuminance(state.chartCustomColors()[0], NETDATA.chartDefaults.fill_luminance);
+ }
+ }
+
+ $(state.peity_instance).peity('line', state.peity_options);
+ return true;
+};
+
+NETDATA.peityChartCreate = function (state, data) {
+ state.peity_instance = document.createElement('div');
+ state.element_chart.appendChild(state.peity_instance);
+
+ state.peity_options = {
+ stroke: NETDATA.themes.current.foreground,
+ strokeWidth: NETDATA.dataAttribute(state.element, 'peity-strokewidth', 1),
+ width: state.chartWidth(),
+ height: state.chartHeight(),
+ fill: NETDATA.themes.current.foreground
+ };
+
+ NETDATA.peityChartUpdate(state, data);
+ return true;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// "Text-only" chart - Just renders the raw value to the DOM
+
+NETDATA.textOnlyCreate = function(state, data) {
+ var decimalPlaces = NETDATA.dataAttribute(state.element, 'textonly-decimal-places', 1);
+ var prefix = NETDATA.dataAttribute(state.element, 'textonly-prefix', '');
+ var suffix = NETDATA.dataAttribute(state.element, 'textonly-suffix', '');
+
+ // Round based on number of decimal places to show
+ var precision = Math.pow(10, decimalPlaces);
+ var value = Math.round(data.result[0] * precision) / precision;
+
+ state.element.textContent = prefix + value + suffix;
+ return true;
+}
+
+NETDATA.textOnlyUpdate = NETDATA.textOnlyCreate;
+// Charts Libraries Registration
+
+NETDATA.chartLibraries = {
+ "dygraph": {
+ initialize: NETDATA.dygraphInitialize,
+ create: NETDATA.dygraphChartCreate,
+ update: NETDATA.dygraphChartUpdate,
+ resize: function (state) {
+ if (typeof state.tmp.dygraph_instance !== 'undefined' && typeof state.tmp.dygraph_instance.resize === 'function') {
+ state.tmp.dygraph_instance.resize();
+ }
+ },
+ setSelection: NETDATA.dygraphSetSelection,
+ clearSelection: NETDATA.dygraphClearSelection,
+ toolboxPanAndZoom: NETDATA.dygraphToolboxPanAndZoom,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ format: function (state) {
+ void(state);
+ return 'json';
+ },
+ options: function (state) {
+ return 'ms' + '%7C' + 'flip' + (this.isLogScale(state) ? ('%7C' + 'abs') : '').toString();
+ },
+ legend: function (state) {
+ return (this.isSparkline(state) === false && NETDATA.dataAttributeBoolean(state.element, 'legend', true) === true) ? 'right-side' : null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return true;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return true;
+ },
+ pixels_per_point: function (state) {
+ return (this.isSparkline(state) === false) ? 3 : 2;
+ },
+ isSparkline: function (state) {
+ if (typeof state.tmp.dygraph_sparkline === 'undefined') {
+ state.tmp.dygraph_sparkline = (this.theme(state) === 'sparkline');
+ }
+ return state.tmp.dygraph_sparkline;
+ },
+ isLogScale: function (state) {
+ if (typeof state.tmp.dygraph_logscale === 'undefined') {
+ state.tmp.dygraph_logscale = (this.theme(state) === 'logscale');
+ }
+ return state.tmp.dygraph_logscale;
+ },
+ theme: function (state) {
+ if (typeof state.tmp.dygraph_theme === 'undefined') {
+ state.tmp.dygraph_theme = NETDATA.dataAttribute(state.element, 'dygraph-theme', 'default');
+ }
+ return state.tmp.dygraph_theme;
+ },
+ container_class: function (state) {
+ if (this.legend(state) !== null) {
+ return 'netdata-container-with-legend';
+ }
+ return 'netdata-container';
+ }
+ },
+ "sparkline": {
+ initialize: NETDATA.sparklineInitialize,
+ create: NETDATA.sparklineChartCreate,
+ update: NETDATA.sparklineChartUpdate,
+ resize: null,
+ setSelection: undefined, // function(state, t) { void(state); return true; },
+ clearSelection: undefined, // function(state) { void(state); return true; },
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ format: function (state) {
+ void(state);
+ return 'array';
+ },
+ options: function (state) {
+ void(state);
+ return 'flip' + '%7C' + 'abs';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ "peity": {
+ initialize: NETDATA.peityInitialize,
+ create: NETDATA.peityChartCreate,
+ update: NETDATA.peityChartUpdate,
+ resize: null,
+ setSelection: undefined, // function(state, t) { void(state); return true; },
+ clearSelection: undefined, // function(state) { void(state); return true; },
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ format: function (state) {
+ void(state);
+ return 'ssvcomma';
+ },
+ options: function (state) {
+ void(state);
+ return 'null2zero' + '%7C' + 'flip' + '%7C' + 'abs';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ // "morris": {
+ // initialize: NETDATA.morrisInitialize,
+ // create: NETDATA.morrisChartCreate,
+ // update: NETDATA.morrisChartUpdate,
+ // resize: null,
+ // setSelection: undefined, // function(state, t) { void(state); return true; },
+ // clearSelection: undefined, // function(state) { void(state); return true; },
+ // toolboxPanAndZoom: null,
+ // initialized: false,
+ // enabled: true,
+ // xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ // format: function(state) { void(state); return 'json'; },
+ // options: function(state) { void(state); return 'objectrows' + '%7C' + 'ms'; },
+ // legend: function(state) { void(state); return null; },
+ // autoresize: function(state) { void(state); return false; },
+ // max_updates_to_recreate: function(state) { void(state); return 50; },
+ // track_colors: function(state) { void(state); return false; },
+ // pixels_per_point: function(state) { void(state); return 15; },
+ // container_class: function(state) { void(state); return 'netdata-container'; }
+ // },
+ "google": {
+ initialize: NETDATA.googleInitialize,
+ create: NETDATA.googleChartCreate,
+ update: NETDATA.googleChartUpdate,
+ resize: null,
+ setSelection: undefined, //function(state, t) { void(state); return true; },
+ clearSelection: undefined, //function(state) { void(state); return true; },
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result.rows$'),
+ format: function (state) {
+ void(state);
+ return 'datatable';
+ },
+ options: function (state) {
+ void(state);
+ return '';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 300;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 4;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ // "raphael": {
+ // initialize: NETDATA.raphaelInitialize,
+ // create: NETDATA.raphaelChartCreate,
+ // update: NETDATA.raphaelChartUpdate,
+ // resize: null,
+ // setSelection: undefined, // function(state, t) { void(state); return true; },
+ // clearSelection: undefined, // function(state) { void(state); return true; },
+ // toolboxPanAndZoom: null,
+ // initialized: false,
+ // enabled: true,
+ // xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ // format: function(state) { void(state); return 'json'; },
+ // options: function(state) { void(state); return ''; },
+ // legend: function(state) { void(state); return null; },
+ // autoresize: function(state) { void(state); return false; },
+ // max_updates_to_recreate: function(state) { void(state); return 5000; },
+ // track_colors: function(state) { void(state); return false; },
+ // pixels_per_point: function(state) { void(state); return 3; },
+ // container_class: function(state) { void(state); return 'netdata-container'; }
+ // },
+ // "c3": {
+ // initialize: NETDATA.c3Initialize,
+ // create: NETDATA.c3ChartCreate,
+ // update: NETDATA.c3ChartUpdate,
+ // resize: null,
+ // setSelection: undefined, // function(state, t) { void(state); return true; },
+ // clearSelection: undefined, // function(state) { void(state); return true; },
+ // toolboxPanAndZoom: null,
+ // initialized: false,
+ // enabled: true,
+ // xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ // format: function(state) { void(state); return 'csvjsonarray'; },
+ // options: function(state) { void(state); return 'milliseconds'; },
+ // legend: function(state) { void(state); return null; },
+ // autoresize: function(state) { void(state); return false; },
+ // max_updates_to_recreate: function(state) { void(state); return 5000; },
+ // track_colors: function(state) { void(state); return false; },
+ // pixels_per_point: function(state) { void(state); return 15; },
+ // container_class: function(state) { void(state); return 'netdata-container'; }
+ // },
+ "d3pie": {
+ initialize: NETDATA.d3pieInitialize,
+ create: NETDATA.d3pieChartCreate,
+ update: NETDATA.d3pieChartUpdate,
+ resize: null,
+ setSelection: NETDATA.d3pieSetSelection,
+ clearSelection: NETDATA.d3pieClearSelection,
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ format: function (state) {
+ void(state);
+ return 'json';
+ },
+ options: function (state) {
+ void(state);
+ return 'objectrows' + '%7C' + 'ms';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 15;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ "d3": {
+ initialize: NETDATA.d3Initialize,
+ create: NETDATA.d3ChartCreate,
+ update: NETDATA.d3ChartUpdate,
+ resize: null,
+ setSelection: undefined, // function(state, t) { void(state); return true; },
+ clearSelection: undefined, // function(state) { void(state); return true; },
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result.data$'),
+ format: function (state) {
+ void(state);
+ return 'json';
+ },
+ options: function (state) {
+ void(state);
+ return '';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ }
+ },
+ "easypiechart": {
+ initialize: NETDATA.easypiechartInitialize,
+ create: NETDATA.easypiechartChartCreate,
+ update: NETDATA.easypiechartChartUpdate,
+ resize: null,
+ setSelection: NETDATA.easypiechartSetSelection,
+ clearSelection: NETDATA.easypiechartClearSelection,
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ format: function (state) {
+ void(state);
+ return 'array';
+ },
+ options: function (state) {
+ void(state);
+ return 'absolute';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return true;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ aspect_ratio: 100,
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container-easypiechart';
+ }
+ },
+ "gauge": {
+ initialize: NETDATA.gaugeInitialize,
+ create: NETDATA.gaugeChartCreate,
+ update: NETDATA.gaugeChartUpdate,
+ resize: null,
+ setSelection: NETDATA.gaugeSetSelection,
+ clearSelection: NETDATA.gaugeClearSelection,
+ toolboxPanAndZoom: null,
+ initialized: false,
+ enabled: true,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ format: function (state) {
+ void(state);
+ return 'array';
+ },
+ options: function (state) {
+ void(state);
+ return 'absolute';
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ track_colors: function (state) {
+ void(state);
+ return true;
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ aspect_ratio: 60,
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container-gauge';
+ }
+ },
+ "textonly": {
+ autoresize: function (state) {
+ void(state);
+ return false;
+ },
+ container_class: function (state) {
+ void(state);
+ return 'netdata-container';
+ },
+ create: NETDATA.textOnlyCreate,
+ enabled: true,
+ format: function (state) {
+ void(state);
+ return 'array';
+ },
+ initialized: true,
+ initialize: function (callback) {
+ callback();
+ },
+ legend: function (state) {
+ void(state);
+ return null;
+ },
+ max_updates_to_recreate: function (state) {
+ void(state);
+ return 5000;
+ },
+ options: function (state) {
+ void(state);
+ return 'absolute';
+ },
+ pixels_per_point: function (state) {
+ void(state);
+ return 3;
+ },
+ track_colors: function (state) {
+ void(state);
+ return false;
+ },
+ update: NETDATA.textOnlyUpdate,
+ xssRegexIgnore: new RegExp('^/api/v1/data\.result$'),
+ }
+};
+
+NETDATA.registerChartLibrary = function (library, url) {
+ if (NETDATA.options.debug.libraries) {
+ console.log("registering chart library: " + library);
+ }
+
+ NETDATA.chartLibraries[library].url = url;
+ NETDATA.chartLibraries[library].initialized = true;
+ NETDATA.chartLibraries[library].enabled = true;
+};
+
+// *** src/dashboard.js/chart-registry.js
+
+// Chart Registry
+
+// When multiple charts need the same chart, we avoid downloading it
+// multiple times (and having it in browser memory multiple time)
+// by using this registry.
+
+// Every time we download a chart definition, we save it here with .add()
+// Then we try to get it back with .get(). If that fails, we download it.
+
+NETDATA.fixHost = function (host) {
+ while (host.slice(-1) === '/') {
+ host = host.substring(0, host.length - 1);
+ }
+
+ return host;
+};
+
+NETDATA.chartRegistry = {
+ charts: {},
+
+ globalReset: function () {
+ this.charts = {};
+ },
+
+ add: function (host, id, data) {
+ if (typeof this.charts[host] === 'undefined') {
+ this.charts[host] = {};
+ }
+
+ //console.log('added ' + host + '/' + id);
+ this.charts[host][id] = data;
+ },
+
+ get: function (host, id) {
+ if (typeof this.charts[host] === 'undefined') {
+ return null;
+ }
+
+ if (typeof this.charts[host][id] === 'undefined') {
+ return null;
+ }
+
+ //console.log('cached ' + host + '/' + id);
+ return this.charts[host][id];
+ },
+
+ downloadAll: function (host, callback) {
+ host = NETDATA.fixHost(host);
+
+ let self = this;
+
+ function got_data(h, data, callback) {
+ if (data !== null) {
+ self.charts[h] = data.charts;
+
+ // update the server timezone in our options
+ if (typeof data.timezone === 'string') {
+ NETDATA.options.server_timezone = data.timezone;
+ }
+ } else {
+ NETDATA.error(406, h + '/api/v1/charts');
+ }
+
+ if (typeof callback === 'function') {
+ callback(data);
+ }
+ }
+
+ if (netdataSnapshotData !== null) {
+ got_data(host, netdataSnapshotData.charts, callback);
+ } else {
+ $.ajax({
+ url: host + '/api/v1/charts',
+ async: true,
+ cache: false,
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkOptional('/api/v1/charts', data);
+ got_data(host, data, callback);
+ })
+ .fail(function () {
+ NETDATA.error(405, host + '/api/v1/charts');
+
+ if (typeof callback === 'function') {
+ callback(null);
+ }
+ });
+ }
+ }
+};
+
+// Compute common (joint) values over multiple charts.
+
+
+// commonMin & commonMax
+
+NETDATA.commonMin = {
+ keys: {},
+ latest: {},
+
+ globalReset: function () {
+ this.keys = {};
+ this.latest = {};
+ },
+
+ get: function (state) {
+ if (typeof state.tmp.__commonMin === 'undefined') {
+ // get the commonMin setting
+ state.tmp.__commonMin = NETDATA.dataAttribute(state.element, 'common-min', null);
+ }
+
+ let min = state.data.min;
+ let name = state.tmp.__commonMin;
+
+ if (name === null) {
+ // we don't need commonMin
+ //state.log('no need for commonMin');
+ return min;
+ }
+
+ let t = this.keys[name];
+ if (typeof t === 'undefined') {
+ // add our commonMin
+ this.keys[name] = {};
+ t = this.keys[name];
+ }
+
+ let uuid = state.uuid;
+ if (typeof t[uuid] !== 'undefined') {
+ if (t[uuid] === min) {
+ //state.log('commonMin ' + state.tmp.__commonMin + ' not changed: ' + this.latest[name]);
+ return this.latest[name];
+ } else if (min < this.latest[name]) {
+ //state.log('commonMin ' + state.tmp.__commonMin + ' increased: ' + min);
+ t[uuid] = min;
+ this.latest[name] = min;
+ return min;
+ }
+ }
+
+ // add our min
+ t[uuid] = min;
+
+ // find the common min
+ let m = min;
+ // for (let i in t) {
+ // if (t.hasOwnProperty(i) && t[i] < m) m = t[i];
+ // }
+ for (var ti of Object.values(t)) {
+ if (ti < m) {
+ m = ti;
+ }
+ }
+
+ //state.log('commonMin ' + state.tmp.__commonMin + ' updated: ' + m);
+ this.latest[name] = m;
+ return m;
+ }
+};
+
+NETDATA.commonMax = {
+ keys: {},
+ latest: {},
+
+ globalReset: function () {
+ this.keys = {};
+ this.latest = {};
+ },
+
+ get: function (state) {
+ if (typeof state.tmp.__commonMax === 'undefined') {
+ // get the commonMax setting
+ state.tmp.__commonMax = NETDATA.dataAttribute(state.element, 'common-max', null);
+ }
+
+ let max = state.data.max;
+ let name = state.tmp.__commonMax;
+
+ if (name === null) {
+ // we don't need commonMax
+ //state.log('no need for commonMax');
+ return max;
+ }
+
+ let t = this.keys[name];
+ if (typeof t === 'undefined') {
+ // add our commonMax
+ this.keys[name] = {};
+ t = this.keys[name];
+ }
+
+ let uuid = state.uuid;
+ if (typeof t[uuid] !== 'undefined') {
+ if (t[uuid] === max) {
+ //state.log('commonMax ' + state.tmp.__commonMax + ' not changed: ' + this.latest[name]);
+ return this.latest[name];
+ } else if (max > this.latest[name]) {
+ //state.log('commonMax ' + state.tmp.__commonMax + ' increased: ' + max);
+ t[uuid] = max;
+ this.latest[name] = max;
+ return max;
+ }
+ }
+
+ // add our max
+ t[uuid] = max;
+
+ // find the common max
+ let m = max;
+ // for (let i in t) {
+ // if (t.hasOwnProperty(i) && t[i] > m) m = t[i];
+ // }
+ for (var ti of Object.values(t)) {
+ if (ti > m) {
+ m = ti;
+ }
+ }
+
+ //state.log('commonMax ' + state.tmp.__commonMax + ' updated: ' + m);
+ this.latest[name] = m;
+ return m;
+ }
+};
+
+NETDATA.commonColors = {
+ keys: {},
+
+ globalReset: function () {
+ this.keys = {};
+ },
+
+ get: function (state, label) {
+ let ret = this.refill(state);
+
+ if (typeof ret.assigned[label] === 'undefined') {
+ ret.assigned[label] = ret.available.shift();
+ }
+
+ return ret.assigned[label];
+ },
+
+ refill: function (state) {
+ let ret, len;
+
+ if (typeof state.tmp.__commonColors === 'undefined') {
+ ret = this.prepare(state);
+ } else {
+ ret = this.keys[state.tmp.__commonColors];
+ if (typeof ret === 'undefined') {
+ ret = this.prepare(state);
+ }
+ }
+
+ if (ret.available.length === 0) {
+ if (ret.copy_theme || ret.custom.length === 0) {
+ // copy the theme colors
+ len = NETDATA.themes.current.colors.length;
+ while (len--) {
+ ret.available.unshift(NETDATA.themes.current.colors[len]);
+ }
+ }
+
+ // copy the custom colors
+ len = ret.custom.length;
+ while (len--) {
+ ret.available.unshift(ret.custom[len]);
+ }
+ }
+
+ state.colors_assigned = ret.assigned;
+ state.colors_available = ret.available;
+ state.colors_custom = ret.custom;
+
+ return ret;
+ },
+
+ __read_custom_colors: function (state, ret) {
+ // add the user supplied colors
+ let c = NETDATA.dataAttribute(state.element, 'colors', undefined);
+ if (typeof c === 'string' && c.length > 0) {
+ c = c.split(' ');
+ let len = c.length;
+
+ if (len > 0 && c[len - 1] === 'ONLY') {
+ len--;
+ ret.copy_theme = false;
+ }
+
+ while (len--) {
+ ret.custom.unshift(c[len]);
+ }
+ }
+ },
+
+ prepare: function (state) {
+ let has_custom_colors = false;
+
+ if (typeof state.tmp.__commonColors === 'undefined') {
+ let defname = state.chart.context;
+
+ // if this chart has data-colors=""
+ // we should use the chart uuid as the default key (private palette)
+ // (data-common-colors="NAME" will be used anyways)
+ let c = NETDATA.dataAttribute(state.element, 'colors', undefined);
+ if (typeof c === 'string' && c.length > 0) {
+ defname = state.uuid;
+ has_custom_colors = true;
+ }
+
+ // get the commonColors setting
+ state.tmp.__commonColors = NETDATA.dataAttribute(state.element, 'common-colors', defname);
+ }
+
+ let name = state.tmp.__commonColors;
+ let ret = this.keys[name];
+
+ if (typeof ret === 'undefined') {
+ // add our commonMax
+ this.keys[name] = {
+ assigned: {}, // name-value of dimensions and their colors
+ available: [], // an array of colors available to be used
+ custom: [], // the array of colors defined by the user
+ charts: {}, // the charts linked to this
+ copy_theme: true
+ };
+ ret = this.keys[name];
+ }
+
+ if (typeof ret.charts[state.uuid] === 'undefined') {
+ ret.charts[state.uuid] = state;
+
+ if (has_custom_colors) {
+ this.__read_custom_colors(state, ret);
+ }
+ }
+
+ return ret;
+ }
+};
+
+// *** src/dashboard.js/main.js
+
+// Codacy declarations
+/* global clipboard */
+/* global Ps */
+
+if (NETDATA.options.debug.main_loop) {
+ console.log('welcome to NETDATA');
+}
+
+NETDATA.onresizeCallback = null;
+NETDATA.onresize = function () {
+ NETDATA.options.last_page_resize = Date.now();
+ NETDATA.onscroll();
+
+ if (typeof NETDATA.onresizeCallback === 'function') {
+ NETDATA.onresizeCallback();
+ }
+};
+
+NETDATA.abortAllRefreshes = function () {
+ let targets = NETDATA.options.targets;
+ let len = targets.length;
+
+ while (len--) {
+ if (targets[len].fetching_data) {
+ if (typeof targets[len].xhr !== 'undefined') {
+ targets[len].xhr.abort();
+ targets[len].running = false;
+ targets[len].fetching_data = false;
+ }
+ }
+ }
+};
+
+NETDATA.onscrollStartDelay = function () {
+ NETDATA.options.last_page_scroll = Date.now();
+
+ NETDATA.options.on_scroll_refresher_stop_until =
+ NETDATA.options.last_page_scroll
+ + (NETDATA.options.current.async_on_scroll ? 1000 : 0);
+};
+
+NETDATA.onscrollEndDelay = function () {
+ NETDATA.options.on_scroll_refresher_stop_until =
+ Date.now()
+ + (NETDATA.options.current.async_on_scroll ? NETDATA.options.current.onscroll_worker_duration_threshold : 0);
+};
+
+NETDATA.onscroll_updater_timeout_id = undefined;
+NETDATA.onscrollUpdater = function () {
+ NETDATA.globalSelectionSync.stop();
+
+ if (NETDATA.options.abort_ajax_on_scroll) {
+ NETDATA.abortAllRefreshes();
+ }
+
+ // when the user scrolls he sees that we have
+ // hidden all the not-visible charts
+ // using this little function we try to switch
+ // the charts back to visible quickly
+
+ if (!NETDATA.intersectionObserver.enabled()) {
+ if (!NETDATA.options.current.parallel_refresher) {
+ let targets = NETDATA.options.targets;
+ let len = targets.length;
+
+ while (len--) {
+ if (!targets[len].running) {
+ targets[len].isVisible();
+ }
+ }
+ }
+ }
+
+ NETDATA.onscrollEndDelay();
+};
+
+NETDATA.scrollUp = false;
+NETDATA.scrollY = window.scrollY;
+NETDATA.onscroll = function () {
+ //console.log('onscroll() begin');
+
+ NETDATA.onscrollStartDelay();
+ NETDATA.chartRefresherReschedule();
+
+ NETDATA.scrollUp = (window.scrollY > NETDATA.scrollY);
+ NETDATA.scrollY = window.scrollY;
+
+ if (NETDATA.onscroll_updater_timeout_id) {
+ NETDATA.timeout.clear(NETDATA.onscroll_updater_timeout_id);
+ }
+
+ NETDATA.onscroll_updater_timeout_id = NETDATA.timeout.set(NETDATA.onscrollUpdater, 0);
+ //console.log('onscroll() end');
+};
+
+NETDATA.supportsPassiveEvents = function () {
+ if (NETDATA.options.passive_events === null) {
+ let supportsPassive = false;
+ try {
+ let opts = Object.defineProperty({}, 'passive', {
+ get: function () {
+ supportsPassive = true;
+ }
+ });
+ window.addEventListener("test", null, opts);
+ } catch (e) {
+ console.log('browser does not support passive events');
+ }
+
+ NETDATA.options.passive_events = supportsPassive;
+ }
+
+ // console.log('passive ' + NETDATA.options.passive_events);
+ return NETDATA.options.passive_events;
+};
+
+window.addEventListener('resize', NETDATA.onresize, NETDATA.supportsPassiveEvents() ? {passive: true} : false);
+window.addEventListener('scroll', NETDATA.onscroll, NETDATA.supportsPassiveEvents() ? {passive: true} : false);
+// window.onresize = NETDATA.onresize;
+// window.onscroll = NETDATA.onscroll;
+
+// ----------------------------------------------------------------------------------------------------------------
+// Global Pan and Zoom on charts
+
+// Using this structure are synchronize all the charts, so that
+// when you pan or zoom one, all others are automatically refreshed
+// to the same timespan.
+
+NETDATA.globalPanAndZoom = {
+ seq: 0, // timestamp ms
+ // every time a chart is panned or zoomed
+ // we set the timestamp here
+ // then we use it as a sequence number
+ // to find if other charts are synchronized
+ // to this time-range
+
+ master: null, // the master chart (state), to which all others
+ // are synchronized
+
+ force_before_ms: null, // the timespan to sync all other charts
+ force_after_ms: null,
+
+ callback: null,
+
+ globalReset: function () {
+ this.clearMaster();
+ this.seq = 0;
+ this.master = null;
+ this.force_after_ms = null;
+ this.force_before_ms = null;
+ this.callback = null;
+ },
+
+ delay: function () {
+ if (NETDATA.options.debug.globalPanAndZoom) {
+ console.log('globalPanAndZoom.delay()');
+ }
+
+ NETDATA.options.auto_refresher_stop_until = Date.now() + NETDATA.options.current.global_pan_sync_time;
+ },
+
+ // set a new master
+ setMaster: function (state, after, before) {
+ this.delay();
+
+ if (!NETDATA.options.current.sync_pan_and_zoom) {
+ return;
+ }
+
+ if (this.master === null) {
+ if (NETDATA.options.debug.globalPanAndZoom) {
+ console.log('globalPanAndZoom.setMaster(' + state.id + ', ' + after + ', ' + before + ') SET MASTER');
+ }
+ } else if (this.master !== state) {
+ if (NETDATA.options.debug.globalPanAndZoom) {
+ console.log('globalPanAndZoom.setMaster(' + state.id + ', ' + after + ', ' + before + ') CHANGED MASTER');
+ }
+
+ this.master.resetChart(true, true);
+ }
+
+ let now = Date.now();
+ this.master = state;
+ this.seq = now;
+ this.force_after_ms = after;
+ this.force_before_ms = before;
+
+ if (typeof this.callback === 'function') {
+ this.callback(true, after, before);
+ }
+ },
+
+ // clear the master
+ clearMaster: function () {
+ // if (NETDATA.options.debug.globalPanAndZoom === true)
+ // console.log('globalPanAndZoom.clearMaster()');
+ if (NETDATA.options.debug.globalPanAndZoom) {
+ console.log('globalPanAndZoom.clearMaster()');
+ }
+
+ if (this.master !== null) {
+ let st = this.master;
+ this.master = null;
+ st.resetChart();
+ }
+
+ this.master = null;
+ this.seq = 0;
+ this.force_after_ms = null;
+ this.force_before_ms = null;
+ NETDATA.options.auto_refresher_stop_until = 0;
+
+ if (typeof this.callback === 'function') {
+ this.callback(false, 0, 0);
+ }
+ },
+
+ // is the given state the master of the global
+ // pan and zoom sync?
+ isMaster: function (state) {
+ return (this.master === state);
+ },
+
+ // are we currently have a global pan and zoom sync?
+ isActive: function () {
+ return (this.master !== null && this.force_before_ms !== null && this.force_after_ms !== null && this.seq !== 0);
+ },
+
+ // check if a chart, other than the master
+ // needs to be refreshed, due to the global pan and zoom
+ shouldBeAutoRefreshed: function (state) {
+ if (this.master === null || this.seq === 0) {
+ return false;
+ }
+
+ //if (state.needsRecreation())
+ // return true;
+
+ return (state.tm.pan_and_zoom_seq !== this.seq);
+ }
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// global chart underlay (time-frame highlighting)
+
+NETDATA.globalChartUnderlay = {
+ callback: null, // what to call when a highlighted range is setup
+ after: null, // highlight after this time
+ before: null, // highlight before this time
+ view_after: null, // the charts after_ms viewport when the highlight was setup
+ view_before: null, // the charts before_ms viewport, when the highlight was setup
+ state: null, // the chart the highlight was setup
+
+ isActive: function () {
+ return (this.after !== null && this.before !== null);
+ },
+
+ hasViewport: function () {
+ return (this.state !== null && this.view_after !== null && this.view_before !== null);
+ },
+
+ init: function (state, after, before, view_after, view_before) {
+ this.state = (typeof state !== 'undefined') ? state : null;
+ this.after = (typeof after !== 'undefined' && after !== null && after > 0) ? after : null;
+ this.before = (typeof before !== 'undefined' && before !== null && before > 0) ? before : null;
+ this.view_after = (typeof view_after !== 'undefined' && view_after !== null && view_after > 0) ? view_after : null;
+ this.view_before = (typeof view_before !== 'undefined' && view_before !== null && view_before > 0) ? view_before : null;
+ },
+
+ setup: function () {
+ if (this.isActive()) {
+ if (this.state === null) {
+ this.state = NETDATA.options.targets[0];
+ }
+
+ if (typeof this.callback === 'function') {
+ this.callback(true, this.after, this.before);
+ }
+ } else {
+ if (typeof this.callback === 'function') {
+ this.callback(false, 0, 0);
+ }
+ }
+ },
+
+ set: function (state, after, before, view_after, view_before) {
+ if (after > before) {
+ let t = after;
+ after = before;
+ before = t;
+ }
+
+ this.init(state, after, before, view_after, view_before);
+
+ // if (this.hasViewport() === true)
+ // NETDATA.globalPanAndZoom.setMaster(this.state, this.view_after, this.view_before);
+ if (this.hasViewport()) {
+ NETDATA.globalPanAndZoom.setMaster(this.state, this.view_after, this.view_before);
+ }
+
+ this.setup();
+ },
+
+ clear: function () {
+ this.after = null;
+ this.before = null;
+ this.state = null;
+ this.view_after = null;
+ this.view_before = null;
+
+ if (typeof this.callback === 'function') {
+ this.callback(false, 0, 0);
+ }
+ },
+
+ focus: function () {
+ if (this.isActive() && this.hasViewport()) {
+ if (this.state === null) {
+ this.state = NETDATA.options.targets[0];
+ }
+
+ if (NETDATA.globalPanAndZoom.isMaster(this.state)) {
+ NETDATA.globalPanAndZoom.clearMaster();
+ }
+
+ NETDATA.globalPanAndZoom.setMaster(this.state, this.view_after, this.view_before, true);
+ }
+ }
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// dimensions selection
+
+// TODO
+// move color assignment to dimensions, here
+
+let dimensionStatus = function (parent, label, name_div, value_div, color) {
+ this.enabled = false;
+ this.parent = parent;
+ this.label = label;
+ this.name_div = null;
+ this.value_div = null;
+ this.color = NETDATA.themes.current.foreground;
+ this.selected = (parent.unselected_count === 0);
+
+ this.setOptions(name_div, value_div, color);
+};
+
+dimensionStatus.prototype.invalidate = function () {
+ this.name_div = null;
+ this.value_div = null;
+ this.enabled = false;
+};
+
+dimensionStatus.prototype.setOptions = function (name_div, value_div, color) {
+ this.color = color;
+
+ if (this.name_div !== name_div) {
+ this.name_div = name_div;
+ this.name_div.title = this.label;
+ this.name_div.style.setProperty('color', this.color, 'important');
+ if (!this.selected) {
+ this.name_div.className = 'netdata-legend-name not-selected';
+ } else {
+ this.name_div.className = 'netdata-legend-name selected';
+ }
+ }
+
+ if (this.value_div !== value_div) {
+ this.value_div = value_div;
+ this.value_div.title = this.label;
+ this.value_div.style.setProperty('color', this.color, 'important');
+ if (!this.selected) {
+ this.value_div.className = 'netdata-legend-value not-selected';
+ } else {
+ this.value_div.className = 'netdata-legend-value selected';
+ }
+ }
+
+ this.enabled = true;
+ this.setHandler();
+};
+
+dimensionStatus.prototype.setHandler = function () {
+ if (!this.enabled) {
+ return;
+ }
+
+ let ds = this;
+
+ // this.name_div.onmousedown = this.value_div.onmousedown = function(e) {
+ this.name_div.onclick = this.value_div.onclick = function (e) {
+ e.preventDefault();
+ if (ds.isSelected()) {
+ // this is selected
+ if (e.shiftKey || e.ctrlKey) {
+ // control or shift key is pressed -> unselect this (except is none will remain selected, in which case select all)
+ ds.unselect();
+
+ if (ds.parent.countSelected() === 0) {
+ ds.parent.selectAll();
+ }
+ } else {
+ // no key is pressed -> select only this (except if it is the only selected already, in which case select all)
+ if (ds.parent.countSelected() === 1) {
+ ds.parent.selectAll();
+ } else {
+ ds.parent.selectNone();
+ ds.select();
+ }
+ }
+ }
+ else {
+ // this is not selected
+ if (e.shiftKey || e.ctrlKey) {
+ // control or shift key is pressed -> select this too
+ ds.select();
+ } else {
+ // no key is pressed -> select only this
+ ds.parent.selectNone();
+ ds.select();
+ }
+ }
+
+ ds.parent.state.redrawChart();
+ }
+};
+
+dimensionStatus.prototype.select = function () {
+ if (!this.enabled) {
+ return;
+ }
+
+ this.name_div.className = 'netdata-legend-name selected';
+ this.value_div.className = 'netdata-legend-value selected';
+ this.selected = true;
+};
+
+dimensionStatus.prototype.unselect = function () {
+ if (!this.enabled) {
+ return;
+ }
+
+ this.name_div.className = 'netdata-legend-name not-selected';
+ this.value_div.className = 'netdata-legend-value hidden';
+ this.selected = false;
+};
+
+dimensionStatus.prototype.isSelected = function () {
+ // return(this.enabled === true && this.selected === true);
+ return this.enabled && this.selected;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+
+let dimensionsVisibility = function (state) {
+ this.state = state;
+ this.len = 0;
+ this.dimensions = {};
+ this.selected_count = 0;
+ this.unselected_count = 0;
+};
+
+dimensionsVisibility.prototype.dimensionAdd = function (label, name_div, value_div, color) {
+ if (typeof this.dimensions[label] === 'undefined') {
+ this.len++;
+ this.dimensions[label] = new dimensionStatus(this, label, name_div, value_div, color);
+ } else {
+ this.dimensions[label].setOptions(name_div, value_div, color);
+ }
+
+ return this.dimensions[label];
+};
+
+dimensionsVisibility.prototype.dimensionGet = function (label) {
+ return this.dimensions[label];
+};
+
+dimensionsVisibility.prototype.invalidateAll = function () {
+ let keys = Object.keys(this.dimensions);
+ let len = keys.length;
+ while (len--) {
+ this.dimensions[keys[len]].invalidate();
+ }
+};
+
+dimensionsVisibility.prototype.selectAll = function () {
+ let keys = Object.keys(this.dimensions);
+ let len = keys.length;
+ while (len--) {
+ this.dimensions[keys[len]].select();
+ }
+};
+
+dimensionsVisibility.prototype.countSelected = function () {
+ let selected = 0;
+ let keys = Object.keys(this.dimensions);
+ let len = keys.length;
+ while (len--) {
+ if (this.dimensions[keys[len]].isSelected()) {
+ selected++;
+ }
+ }
+
+ return selected;
+};
+
+dimensionsVisibility.prototype.selectNone = function () {
+ let keys = Object.keys(this.dimensions);
+ let len = keys.length;
+ while (len--) {
+ this.dimensions[keys[len]].unselect();
+ }
+};
+
+dimensionsVisibility.prototype.selected2BooleanArray = function (array) {
+ let ret = [];
+ this.selected_count = 0;
+ this.unselected_count = 0;
+
+ let len = array.length;
+ while (len--) {
+ let ds = this.dimensions[array[len]];
+ if (typeof ds === 'undefined') {
+ // console.log(array[i] + ' is not found');
+ ret.unshift(false);
+ } else if (ds.isSelected()) {
+ ret.unshift(true);
+ this.selected_count++;
+ } else {
+ ret.unshift(false);
+ this.unselected_count++;
+ }
+ }
+
+ if (this.selected_count === 0 && this.unselected_count !== 0) {
+ this.selectAll();
+ return this.selected2BooleanArray(array);
+ }
+
+ return ret;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// date/time conversion
+
+NETDATA.dateTime = {
+ using_timezone: false,
+
+ // these are the old netdata functions
+ // we fallback to these, if the new ones fail
+
+ localeDateStringNative: function (d) {
+ return d.toLocaleDateString();
+ },
+
+ localeTimeStringNative: function (d) {
+ return d.toLocaleTimeString();
+ },
+
+ xAxisTimeStringNative: function (d) {
+ return NETDATA.zeropad(d.getHours()) + ":"
+ + NETDATA.zeropad(d.getMinutes()) + ":"
+ + NETDATA.zeropad(d.getSeconds());
+ },
+
+ // initialize the new date/time conversion
+ // functions.
+ // if this fails, we fallback to the above
+ init: function (timezone) {
+ //console.log('init with timezone: ' + timezone);
+
+ // detect browser timezone
+ try {
+ NETDATA.options.browser_timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+ } catch (e) {
+ console.log('failed to detect browser timezone: ' + e.toString());
+ NETDATA.options.browser_timezone = 'cannot-detect-it';
+ }
+
+ let ret = false;
+
+ try {
+ let dateOptions = {
+ localeMatcher: 'best fit',
+ formatMatcher: 'best fit',
+ weekday: 'short',
+ year: 'numeric',
+ month: 'short',
+ day: '2-digit'
+ };
+
+ let timeOptions = {
+ localeMatcher: 'best fit',
+ hour12: false,
+ formatMatcher: 'best fit',
+ hour: '2-digit',
+ minute: '2-digit',
+ second: '2-digit'
+ };
+
+ let xAxisOptions = {
+ localeMatcher: 'best fit',
+ hour12: false,
+ formatMatcher: 'best fit',
+ hour: '2-digit',
+ minute: '2-digit',
+ second: '2-digit'
+ };
+
+ if (typeof timezone === 'string' && timezone !== '' && timezone !== 'default') {
+ dateOptions.timeZone = timezone;
+ timeOptions.timeZone = timezone;
+ timeOptions.timeZoneName = 'short';
+ xAxisOptions.timeZone = timezone;
+ this.using_timezone = true;
+ } else {
+ timezone = 'default';
+ this.using_timezone = false;
+ }
+
+ this.dateFormat = new Intl.DateTimeFormat(navigator.language, dateOptions);
+ this.timeFormat = new Intl.DateTimeFormat(navigator.language, timeOptions);
+ this.xAxisFormat = new Intl.DateTimeFormat(navigator.language, xAxisOptions);
+
+ this.localeDateString = function (d) {
+ return this.dateFormat.format(d);
+ };
+
+ this.localeTimeString = function (d) {
+ return this.timeFormat.format(d);
+ };
+
+ this.xAxisTimeString = function (d) {
+ return this.xAxisFormat.format(d);
+ };
+
+ //let d = new Date();
+ //let t = this.dateFormat.format(d) + ' ' + this.timeFormat.format(d) + ' ' + this.xAxisFormat.format(d);
+
+ ret = true;
+ } catch (e) {
+ console.log('Cannot setup Date/Time formatting: ' + e.toString());
+
+ timezone = 'default';
+ this.localeDateString = this.localeDateStringNative;
+ this.localeTimeString = this.localeTimeStringNative;
+ this.xAxisTimeString = this.xAxisTimeStringNative;
+ this.using_timezone = false;
+
+ ret = false;
+ }
+
+ // save it
+ //console.log('init setOption timezone: ' + timezone);
+ NETDATA.setOption('timezone', timezone);
+
+ return ret;
+ }
+};
+NETDATA.dateTime.init(NETDATA.options.current.timezone);
+
+// ----------------------------------------------------------------------------------------------------------------
+// global selection sync
+
+NETDATA.globalSelectionSync = {
+ state: null,
+ dontSyncBefore: 0,
+ last_t: 0,
+ slaves: [],
+ timeoutId: undefined,
+
+ globalReset: function () {
+ this.stop();
+ this.state = null;
+ this.dontSyncBefore = 0;
+ this.last_t = 0;
+ this.slaves = [];
+ this.timeoutId = undefined;
+ },
+
+ active: function () {
+ return (this.state !== null);
+ },
+
+ // return true if global selection sync can be enabled now
+ enabled: function () {
+ // console.log('enabled()');
+ // can we globally apply selection sync?
+ if (!NETDATA.options.current.sync_selection) {
+ return false;
+ }
+
+ return (this.dontSyncBefore <= Date.now());
+ },
+
+ // set the global selection sync master
+ setMaster: function (state) {
+ if (!this.enabled()) {
+ this.stop();
+ return;
+ }
+
+ if (this.state === state) {
+ return;
+ }
+
+ if (this.state !== null) {
+ this.stop();
+ }
+
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.setMaster(' + state.id + ')');
+ }
+
+ state.selected = true;
+ this.state = state;
+ this.last_t = 0;
+
+ // find all slaves
+ let targets = NETDATA.intersectionObserver.targets();
+ this.slaves = [];
+ let len = targets.length;
+ while (len--) {
+ let st = targets[len];
+ if (this.state !== st && st.globalSelectionSyncIsEligible()) {
+ this.slaves.push(st);
+ }
+ }
+
+ // this.delay(100);
+ },
+
+ // stop global selection sync
+ stop: function () {
+ if (this.state !== null) {
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.stop()');
+ }
+
+ let len = this.slaves.length;
+ while (len--) {
+ this.slaves[len].clearSelection();
+ }
+
+ this.state.clearSelection();
+
+ this.last_t = 0;
+ this.slaves = [];
+ this.state = null;
+ }
+ },
+
+ // delay global selection sync for some time
+ delay: function (ms) {
+ if (NETDATA.options.current.sync_selection) {
+ // if (NETDATA.options.debug.globalSelectionSync === true) {
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.delay()');
+ }
+
+ if (typeof ms === 'number') {
+ this.dontSyncBefore = Date.now() + ms;
+ } else {
+ this.dontSyncBefore = Date.now() + NETDATA.options.current.sync_selection_delay;
+ }
+ }
+ },
+
+ __syncSlaves: function () {
+ // if (NETDATA.globalSelectionSync.enabled() === true) {
+ if (NETDATA.globalSelectionSync.enabled()) {
+ // if (NETDATA.options.debug.globalSelectionSync === true)
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.__syncSlaves()');
+ }
+
+ let t = NETDATA.globalSelectionSync.last_t;
+ let len = NETDATA.globalSelectionSync.slaves.length;
+ while (len--) {
+ NETDATA.globalSelectionSync.slaves[len].setSelection(t);
+ }
+
+ this.timeoutId = undefined;
+ }
+ },
+
+ // sync all the visible charts to the given time
+ // this is to be called from the chart libraries
+ sync: function (state, t) {
+ // if (NETDATA.options.current.sync_selection === true) {
+ if (NETDATA.options.current.sync_selection) {
+ // if (NETDATA.options.debug.globalSelectionSync === true)
+ if (NETDATA.options.debug.globalSelectionSync) {
+ console.log('globalSelectionSync.sync(' + state.id + ', ' + t.toString() + ')');
+ }
+
+ this.setMaster(state);
+
+ if (t === this.last_t) {
+ return;
+ }
+
+ this.last_t = t;
+
+ if (state.foreignElementSelection !== null) {
+ state.foreignElementSelection.innerText = NETDATA.dateTime.localeDateString(t) + ' ' + NETDATA.dateTime.localeTimeString(t);
+ }
+
+ if (this.timeoutId) {
+ NETDATA.timeout.clear(this.timeoutId);
+ }
+
+ this.timeoutId = NETDATA.timeout.set(this.__syncSlaves, 0);
+ }
+ }
+};
+
+NETDATA.intersectionObserver = {
+ observer: null,
+ visible_targets: [],
+
+ options: {
+ root: null,
+ rootMargin: "0px",
+ threshold: null
+ },
+
+ enabled: function () {
+ return this.observer !== null;
+ },
+
+ globalReset: function () {
+ if (this.observer !== null) {
+ this.visible_targets = [];
+ this.observer.disconnect();
+ this.init();
+ }
+ },
+
+ targets: function () {
+ if (this.enabled() && this.visible_targets.length > 0) {
+ return this.visible_targets;
+ } else {
+ return NETDATA.options.targets;
+ }
+ },
+
+ switchChartVisibility: function () {
+ let old = this.__visibilityRatioOld;
+
+ if (old !== this.__visibilityRatio) {
+ if (old === 0 && this.__visibilityRatio > 0) {
+ this.unhideChart();
+ } else if (old > 0 && this.__visibilityRatio === 0) {
+ this.hideChart();
+ }
+
+ this.__visibilityRatioOld = this.__visibilityRatio;
+ }
+ },
+
+ handler: function (entries, observer) {
+ entries.forEach(function (entry) {
+ let state = NETDATA.chartState(entry.target);
+
+ let idx;
+ if (entry.intersectionRatio > 0) {
+ idx = NETDATA.intersectionObserver.visible_targets.indexOf(state);
+ if (idx === -1) {
+ if (NETDATA.scrollUp) {
+ NETDATA.intersectionObserver.visible_targets.push(state);
+ } else {
+ NETDATA.intersectionObserver.visible_targets.unshift(state);
+ }
+ }
+ else if (state.__visibilityRatio === 0) {
+ state.log("was not visible until now, but was already in visible_targets");
+ }
+ } else {
+ idx = NETDATA.intersectionObserver.visible_targets.indexOf(state);
+ if (idx !== -1) {
+ NETDATA.intersectionObserver.visible_targets.splice(idx, 1);
+ } else if (state.__visibilityRatio > 0) {
+ state.log("was visible, but not found in visible_targets");
+ }
+ }
+
+ state.__visibilityRatio = entry.intersectionRatio;
+
+ if (!NETDATA.options.current.async_on_scroll) {
+ if (window.requestIdleCallback) {
+ window.requestIdleCallback(function () {
+ NETDATA.intersectionObserver.switchChartVisibility.call(state);
+ }, {timeout: 100});
+ } else {
+ NETDATA.intersectionObserver.switchChartVisibility.call(state);
+ }
+ }
+ });
+ },
+
+ observe: function (state) {
+ if (this.enabled()) {
+ state.__visibilityRatioOld = 0;
+ state.__visibilityRatio = 0;
+ this.observer.observe(state.element);
+
+ state.isVisible = function () {
+ if (!NETDATA.options.current.update_only_visible) {
+ return true;
+ }
+
+ NETDATA.intersectionObserver.switchChartVisibility.call(this);
+
+ return this.__visibilityRatio > 0;
+ }
+ }
+ },
+
+ init: function () {
+ if (typeof netdataIntersectionObserver === 'undefined' || netdataIntersectionObserver) {
+ try {
+ this.observer = new IntersectionObserver(this.handler, this.options);
+ } catch (e) {
+ console.log("IntersectionObserver is not supported on this browser");
+ this.observer = null;
+ }
+ }
+ //else {
+ // console.log("IntersectionObserver is disabled");
+ //}
+ }
+};
+NETDATA.intersectionObserver.init();
+
+// ----------------------------------------------------------------------------------------------------------------
+// Our state object, where all per-chart values are stored
+
+let chartState = function (element) {
+ this.element = element;
+
+ // IMPORTANT:
+ // all private functions should use 'that', instead of 'this'
+ // Alternatively, you can use arrow functions (related issue #4514)
+ let that = this;
+
+ // ============================================================================================================
+ // ERROR HANDLING
+
+ /* error() - private
+ * show an error instead of the chart
+ */
+ let error = (msg) => {
+ let ret = true;
+
+ if (typeof netdataErrorCallback === 'function') {
+ ret = netdataErrorCallback('chart', this.id, msg);
+ }
+
+ if (ret) {
+ this.element.innerHTML = this.id + ': ' + msg;
+ this.enabled = false;
+ this.current = this.pan;
+ }
+ };
+
+ // console logging
+ this.log = function (msg) {
+ console.log(this.id + ' (' + this.library_name + ' ' + this.uuid + '): ' + msg);
+ };
+
+ this.debugLog = function (msg) {
+ if (this.debug) {
+ this.log(msg);
+ }
+ };
+
+ // ============================================================================================================
+ // EARLY INITIALIZATION
+
+ // These are variables that should exist even if the chart is never to be rendered.
+ // Be careful what you add here - there may be thousands of charts on the page.
+
+ // GUID - a unique identifier for the chart
+ this.uuid = NETDATA.guid();
+
+ // string - the name of chart
+ this.id = NETDATA.dataAttribute(this.element, 'netdata', undefined);
+ if (typeof this.id === 'undefined') {
+ error("netdata elements need data-netdata");
+ return;
+ }
+
+ // string - the key for localStorage settings
+ this.settings_id = NETDATA.dataAttribute(this.element, 'id', null);
+
+ // the user given dimensions of the element
+ this.width = NETDATA.dataAttribute(this.element, 'width', NETDATA.chartDefaults.width);
+ this.height = NETDATA.dataAttribute(this.element, 'height', NETDATA.chartDefaults.height);
+ this.height_original = this.height;
+
+ if (this.settings_id !== null) {
+ this.height = NETDATA.localStorageGet('chart_heights.' + this.settings_id, this.height, function (height) {
+ // this is the callback that will be called
+ // if and when the user resets all localStorage variables
+ // to their defaults
+
+ resizeChartToHeight(height);
+ });
+ }
+
+ // the chart library requested by the user
+ this.library_name = NETDATA.dataAttribute(this.element, 'chart-library', NETDATA.chartDefaults.library);
+
+ // check the requested library is available
+ // we don't initialize it here - it will be initialized when
+ // this chart will be first used
+ if (typeof NETDATA.chartLibraries[this.library_name] === 'undefined') {
+ NETDATA.error(402, this.library_name);
+ error('chart library "' + this.library_name + '" is not found');
+ this.enabled = false;
+ } else if (!NETDATA.chartLibraries[this.library_name].enabled) {
+ NETDATA.error(403, this.library_name);
+ error('chart library "' + this.library_name + '" is not enabled');
+ this.enabled = false;
+ } else {
+ this.library = NETDATA.chartLibraries[this.library_name];
+ }
+
+ this.auto = {
+ name: 'auto',
+ autorefresh: true,
+ force_update_at: 0, // the timestamp to force the update at
+ force_before_ms: null,
+ force_after_ms: null
+ };
+ this.pan = {
+ name: 'pan',
+ autorefresh: false,
+ force_update_at: 0, // the timestamp to force the update at
+ force_before_ms: null,
+ force_after_ms: null
+ };
+ this.zoom = {
+ name: 'zoom',
+ autorefresh: false,
+ force_update_at: 0, // the timestamp to force the update at
+ force_before_ms: null,
+ force_after_ms: null
+ };
+
+ // this is a pointer to one of the sub-classes below
+ // auto, pan, zoom
+ this.current = this.auto;
+
+ this.running = false; // boolean - true when the chart is being refreshed now
+ this.enabled = true; // boolean - is the chart enabled for refresh?
+
+ this.force_update_every = null; // number - overwrite the visualization update frequency of the chart
+
+ this.tmp = {};
+
+ this.foreignElementBefore = null;
+ this.foreignElementAfter = null;
+ this.foreignElementDuration = null;
+ this.foreignElementUpdateEvery = null;
+ this.foreignElementSelection = null;
+
+ // ============================================================================================================
+ // PRIVATE FUNCTIONS
+
+ // reset the runtime status variables to their defaults
+ const runtimeInit = () => {
+ this.paused = false; // boolean - is the chart paused for any reason?
+ this.selected = false; // boolean - is the chart shown a selection?
+
+ this.chart_created = false; // boolean - is the library.create() been called?
+ this.dom_created = false; // boolean - is the chart DOM been created?
+ this.fetching_data = false; // boolean - true while we fetch data via ajax
+
+ this.updates_counter = 0; // numeric - the number of refreshes made so far
+ this.updates_since_last_unhide = 0; // numeric - the number of refreshes made since the last time the chart was unhidden
+ this.updates_since_last_creation = 0; // numeric - the number of refreshes made since the last time the chart was created
+
+ this.tm = {
+ last_initialized: 0, // milliseconds - the timestamp it was last initialized
+ last_dom_created: 0, // milliseconds - the timestamp its DOM was last created
+ last_mode_switch: 0, // milliseconds - the timestamp it switched modes
+
+ last_info_downloaded: 0, // milliseconds - the timestamp we downloaded the chart
+ last_updated: 0, // the timestamp the chart last updated with data
+ pan_and_zoom_seq: 0, // the sequence number of the global synchronization
+ // between chart.
+ // Used with NETDATA.globalPanAndZoom.seq
+ last_visible_check: 0, // the time we last checked if it is visible
+ last_resized: 0, // the time the chart was resized
+ last_hidden: 0, // the time the chart was hidden
+ last_unhidden: 0, // the time the chart was unhidden
+ last_autorefreshed: 0 // the time the chart was last refreshed
+ };
+
+ this.data = null; // the last data as downloaded from the netdata server
+ this.data_url = 'invalid://'; // string - the last url used to update the chart
+ this.data_points = 0; // number - the number of points returned from netdata
+ this.data_after = 0; // milliseconds - the first timestamp of the data
+ this.data_before = 0; // milliseconds - the last timestamp of the data
+ this.data_update_every = 0; // milliseconds - the frequency to update the data
+
+ this.tmp = {}; // members that can be destroyed to save memory
+ };
+
+ // initialize all the variables that are required for the chart to be rendered
+ const lateInitialization = () => {
+ if (typeof this.host !== 'undefined') {
+ return;
+ }
+
+ // string - the netdata server URL, without any path
+ this.host = NETDATA.dataAttribute(this.element, 'host', NETDATA.serverDefault);
+
+ // make sure the host does not end with /
+ // all netdata API requests use absolute paths
+ while (this.host.slice(-1) === '/') {
+ this.host = this.host.substring(0, this.host.length - 1);
+ }
+
+ // string - the grouping method requested by the user
+ this.method = NETDATA.dataAttribute(this.element, 'method', NETDATA.chartDefaults.method);
+ this.gtime = NETDATA.dataAttribute(this.element, 'gtime', 0);
+
+ // the time-range requested by the user
+ this.after = NETDATA.dataAttribute(this.element, 'after', NETDATA.chartDefaults.after);
+ this.before = NETDATA.dataAttribute(this.element, 'before', NETDATA.chartDefaults.before);
+
+ // the pixels per point requested by the user
+ this.pixels_per_point = NETDATA.dataAttribute(this.element, 'pixels-per-point', 1);
+ this.points = NETDATA.dataAttribute(this.element, 'points', null);
+
+ // the forced update_every
+ this.force_update_every = NETDATA.dataAttribute(this.element, 'update-every', null);
+ if (typeof this.force_update_every !== 'number' || this.force_update_every <= 1) {
+ if (this.force_update_every !== null) {
+ this.log('ignoring invalid value of property data-update-every');
+ }
+
+ this.force_update_every = null;
+ } else {
+ this.force_update_every *= 1000;
+ }
+
+ // the dimensions requested by the user
+ this.dimensions = NETDATA.encodeURIComponent(NETDATA.dataAttribute(this.element, 'dimensions', null));
+
+ this.title = NETDATA.dataAttribute(this.element, 'title', null); // the title of the chart
+ this.units = NETDATA.dataAttribute(this.element, 'units', null); // the units of the chart dimensions
+ this.units_desired = NETDATA.dataAttribute(this.element, 'desired-units', NETDATA.options.current.units); // the units of the chart dimensions
+ this.units_current = this.units;
+ this.units_common = NETDATA.dataAttribute(this.element, 'common-units', null);
+
+ // additional options to pass to netdata
+ this.append_options = NETDATA.encodeURIComponent(NETDATA.dataAttribute(this.element, 'append-options', null));
+
+ // override options to pass to netdata
+ this.override_options = NETDATA.encodeURIComponent(NETDATA.dataAttribute(this.element, 'override-options', null));
+
+ this.debug = NETDATA.dataAttributeBoolean(this.element, 'debug', false);
+
+ this.value_decimal_detail = -1;
+ let d = NETDATA.dataAttribute(this.element, 'decimal-digits', -1);
+ if (typeof d === 'number') {
+ this.value_decimal_detail = d;
+ } else if (typeof d !== 'undefined') {
+ this.log('ignoring decimal-digits value: ' + d.toString());
+ }
+
+ // if we need to report the rendering speed
+ // find the element that needs to be updated
+ let refresh_dt_element_name = NETDATA.dataAttribute(this.element, 'dt-element-name', null); // string - the element to print refresh_dt_ms
+
+ if (refresh_dt_element_name !== null) {
+ this.refresh_dt_element = document.getElementById(refresh_dt_element_name) || null;
+ }
+ else {
+ this.refresh_dt_element = null;
+ }
+
+ this.dimensions_visibility = new dimensionsVisibility(that);
+
+ this.netdata_first = 0; // milliseconds - the first timestamp in netdata
+ this.netdata_last = 0; // milliseconds - the last timestamp in netdata
+ this.requested_after = null; // milliseconds - the timestamp of the request after param
+ this.requested_before = null; // milliseconds - the timestamp of the request before param
+ this.requested_padding = null;
+ this.view_after = 0;
+ this.view_before = 0;
+
+ this.refresh_dt_ms = 0; // milliseconds - the time the last refresh took
+
+ // how many retries we have made to load chart data from the server
+ this.retries_on_data_failures = 0;
+
+ // color management
+ this.colors = null;
+ this.colors_assigned = null;
+ this.colors_available = null;
+ this.colors_custom = null;
+
+ this.element_message = null; // the element already created by the user
+ this.element_chart = null; // the element with the chart
+ this.element_legend = null; // the element with the legend of the chart (if created by us)
+ this.element_legend_childs = {
+ content: null,
+ hidden: null,
+ title_date: null,
+ title_time: null,
+ title_units: null,
+ perfect_scroller: null, // the container to apply perfect scroller to
+ series: null
+ };
+
+ this.chart_url = null; // string - the url to download chart info
+ this.chart = null; // object - the chart as downloaded from the server
+
+ const getForeignElementById = (opt) => {
+ let id = NETDATA.dataAttribute(this.element, opt, null);
+ if (id === null) {
+ //this.log('option "' + opt + '" is undefined');
+ return null;
+ }
+
+ let el = document.getElementById(id);
+ if (typeof el === 'undefined') {
+ this.log('cannot find an element with name "' + id.toString() + '"');
+ return null;
+ }
+
+ return el;
+ };
+
+ this.foreignElementBefore = getForeignElementById('show-before-at');
+ this.foreignElementAfter = getForeignElementById('show-after-at');
+ this.foreignElementDuration = getForeignElementById('show-duration-at');
+ this.foreignElementUpdateEvery = getForeignElementById('show-update-every-at');
+ this.foreignElementSelection = getForeignElementById('show-selection-at');
+ };
+
+ const destroyDOM = () => {
+ if (!this.enabled) {
+ return;
+ }
+
+ if (this.debug) {
+ this.log('destroyDOM()');
+ }
+
+ // this.element.className = 'netdata-message icon';
+ // this.element.innerHTML = '<i class="fas fa-sync"></i> netdata';
+ this.element.innerHTML = '';
+ this.element_message = null;
+ this.element_legend = null;
+ this.element_chart = null;
+ this.element_legend_childs.series = null;
+
+ this.chart_created = false;
+ this.dom_created = false;
+
+ this.tm.last_resized = 0;
+ 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;
+ }
+ lateInitialization();
+
+ destroyDOM();
+
+ if (this.debug) {
+ this.log('createDOM()');
+ }
+
+ this.element_message = document.createElement('div');
+ this.element_message.className = 'netdata-message icon hidden';
+ this.element.appendChild(this.element_message);
+
+ this.dom_created = true;
+ this.chart_created = false;
+
+ this.tm.last_dom_created = this.tm.last_resized = Date.now();
+
+ showLoading();
+ };
+
+ const initDOM = () => {
+ this.element.className = this.library.container_class(that);
+
+ if (typeof(this.width) === 'string') {
+ this.element.style.width = this.width;
+ } else if (typeof(this.width) === 'number') {
+ this.element.style.width = this.width.toString() + 'px';
+ }
+
+ if (typeof(this.library.aspect_ratio) === 'undefined') {
+ if (typeof(this.height) === 'string') {
+ this.element.style.height = this.height;
+ } else if (typeof(this.height) === 'number') {
+ this.element.style.height = this.height.toString() + 'px';
+ }
+ }
+
+ if (NETDATA.chartDefaults.min_width !== null) {
+ this.element.style.min_width = NETDATA.chartDefaults.min_width;
+ }
+ };
+
+ const invisibleSearchableText = () => {
+ return '<span style="position:absolute; opacity: 0; width: 0px;">' + this.id + '</span>';
+ };
+
+ /* init() private
+ * initialize state variables
+ * destroy all (possibly) created state elements
+ * create the basic DOM for a chart
+ */
+ const init = (opt) => {
+ if (!this.enabled) {
+ return;
+ }
+
+ runtimeInit();
+ this.element.innerHTML = invisibleSearchableText();
+
+ this.tm.last_initialized = Date.now();
+ this.setMode('auto');
+
+ if (opt !== 'fast') {
+ if (this.isVisible(true) || opt === 'force') {
+ createDOM();
+ }
+ }
+ };
+
+ const hideMessage = () => {
+ if (typeof this.tmp.___messageHidden___ === 'undefined') {
+ this.tmp.___messageHidden___ = true;
+ $(this.element_message).addClass('hidden');
+ }
+ };
+
+ const showRendering = () => {
+ let icon;
+ if (this.chart !== null) {
+ if (this.chart.chart_type === 'line') {
+ icon = NETDATA.icons.lineChart;
+ } else {
+ icon = NETDATA.icons.areaChart;
+ }
+ }
+ else {
+ icon = NETDATA.icons.noChart;
+ }
+
+ showMessageIcon(icon + ' netdata' + invisibleSearchableText());
+ };
+
+ const isHidden = () => {
+ return (typeof this.tmp.___chartIsHidden___ !== 'undefined');
+ };
+
+ // hide the chart, when it is not visible - called from isVisible()
+ this.hideChart = function () {
+ // hide it, if it is not already hidden
+ if (isHidden()) {
+ return;
+ }
+
+ if (this.chart_created) {
+ if (NETDATA.options.current.show_help) {
+ if (this.element_legend_childs.toolbox !== null) {
+ if (this.debug) {
+ this.log('hideChart(): hidding legend popovers');
+ }
+
+ $(this.element_legend_childs.toolbox_left).popover('hide');
+ $(this.element_legend_childs.toolbox_reset).popover('hide');
+ $(this.element_legend_childs.toolbox_right).popover('hide');
+ $(this.element_legend_childs.toolbox_zoomin).popover('hide');
+ $(this.element_legend_childs.toolbox_zoomout).popover('hide');
+ }
+
+ if (this.element_legend_childs.resize_handler !== null) {
+ $(this.element_legend_childs.resize_handler).popover('hide');
+ }
+
+ if (this.element_legend_childs.content !== null) {
+ $(this.element_legend_childs.content).popover('hide');
+ }
+ }
+
+ if (NETDATA.options.current.destroy_on_hide) {
+ if (this.debug) {
+ this.log('hideChart(): initializing chart');
+ }
+
+ // we should destroy it
+ init('force');
+ } else {
+ if (this.debug) {
+ this.log('hideChart(): hiding chart');
+ }
+
+ showRendering();
+ this.element_chart.style.display = 'none';
+ this.element.style.willChange = 'auto';
+ if (this.element_legend !== null) {
+ this.element_legend.style.display = 'none';
+ }
+ if (this.element_legend_childs.toolbox !== null) {
+ this.element_legend_childs.toolbox.style.display = 'none';
+ }
+ if (this.element_legend_childs.resize_handler !== null) {
+ this.element_legend_childs.resize_handler.style.display = 'none';
+ }
+
+ this.tm.last_hidden = Date.now();
+
+ // de-allocate data
+ // This works, but I not sure there are no corner cases somewhere
+ // so it is commented - if the user has memory issues he can
+ // set Destroy on Hide for all charts
+ // this.data = null;
+ }
+ }
+
+ this.tmp.___chartIsHidden___ = true;
+ };
+
+ // unhide the chart, when it is visible - called from isVisible()
+ this.unhideChart = function () {
+ if (!isHidden()) {
+ return;
+ }
+
+ this.tmp.___chartIsHidden___ = undefined;
+ this.updates_since_last_unhide = 0;
+
+ if (!this.chart_created) {
+ if (this.debug) {
+ this.log('unhideChart(): initializing chart');
+ }
+
+ // we need to re-initialize it, to show our background
+ // logo in bootstrap tabs, until the chart loads
+ init('force');
+ } else {
+ if (this.debug) {
+ this.log('unhideChart(): unhiding chart');
+ }
+
+ this.element.style.willChange = 'transform';
+ this.tm.last_unhidden = Date.now();
+ this.element_chart.style.display = '';
+ if (this.element_legend !== null) {
+ this.element_legend.style.display = '';
+ }
+ if (this.element_legend_childs.toolbox !== null) {
+ this.element_legend_childs.toolbox.style.display = '';
+ }
+ if (this.element_legend_childs.resize_handler !== null) {
+ this.element_legend_childs.resize_handler.style.display = '';
+ }
+ resizeChart();
+ hideMessage();
+ }
+
+ if (this.__redraw_on_unhide) {
+ if (this.debug) {
+ this.log("redrawing chart on unhide");
+ }
+
+ this.__redraw_on_unhide = undefined;
+ this.redrawChart();
+ }
+ };
+
+ const canBeRendered = (uncached_visibility) => {
+ if (this.debug) {
+ this.log('canBeRendered() called');
+ }
+
+ if (!NETDATA.options.current.update_only_visible) {
+ return true;
+ }
+
+ let ret = (
+ (
+ NETDATA.options.page_is_visible ||
+ NETDATA.options.current.stop_updates_when_focus_is_lost === false ||
+ this.updates_since_last_unhide === 0
+ )
+ && isHidden() === false && this.isVisible(uncached_visibility)
+ );
+
+ if (this.debug) {
+ this.log('canBeRendered(): ' + ret);
+ }
+
+ return ret;
+ };
+
+ // https://github.com/petkaantonov/bluebird/wiki/Optimization-killers
+ const callChartLibraryUpdateSafely = (data) => {
+ let status;
+
+ // we should not do this here
+ // if we prevent rendering the chart then:
+ // 1. globalSelectionSync will be wrong
+ // 2. globalPanAndZoom will be wrong
+ //if (canBeRendered(true) === false)
+ // return false;
+
+ if (NETDATA.options.fake_chart_rendering) {
+ return true;
+ }
+
+ this.updates_counter++;
+ this.updates_since_last_unhide++;
+ this.updates_since_last_creation++;
+
+ if (NETDATA.options.debug.chart_errors) {
+ status = this.library.update(that, data);
+ } else {
+ try {
+ status = this.library.update(that, data);
+ } catch (err) {
+ status = false;
+ }
+ }
+
+ if (!status) {
+ error('chart failed to be updated as ' + this.library_name);
+ return false;
+ }
+
+ return true;
+ };
+
+ // https://github.com/petkaantonov/bluebird/wiki/Optimization-killers
+ const callChartLibraryCreateSafely = (data) => {
+ let status;
+
+ // we should not do this here
+ // if we prevent rendering the chart then:
+ // 1. globalSelectionSync will be wrong
+ // 2. globalPanAndZoom will be wrong
+ //if (canBeRendered(true) === false)
+ // return false;
+
+ if (NETDATA.options.fake_chart_rendering) {
+ return true;
+ }
+
+ this.updates_counter++;
+ this.updates_since_last_unhide++;
+ this.updates_since_last_creation++;
+
+ if (NETDATA.options.debug.chart_errors) {
+ status = this.library.create(that, data);
+ } else {
+ try {
+ status = this.library.create(that, data);
+ } catch (err) {
+ status = false;
+ }
+ }
+
+ if (!status) {
+ error('chart failed to be created as ' + this.library_name);
+ return false;
+ }
+
+ this.chart_created = true;
+ this.updates_since_last_creation = 0;
+ return true;
+ };
+
+ // ----------------------------------------------------------------------------------------------------------------
+ // Chart Resize
+
+ // resizeChart() - private
+ // to be called just before the chart library to make sure that
+ // a properly sized dom is available
+ const resizeChart = () => {
+ if (this.tm.last_resized < NETDATA.options.last_page_resize) {
+ if (!this.chart_created) {
+ return;
+ }
+
+ if (this.needsRecreation()) {
+ if (this.debug) {
+ this.log('resizeChart(): initializing chart');
+ }
+
+ init('force');
+ } else if (typeof this.library.resize === 'function') {
+ if (this.debug) {
+ this.log('resizeChart(): resizing chart');
+ }
+
+ this.library.resize(that);
+
+ if (this.element_legend_childs.perfect_scroller !== null) {
+ Ps.update(this.element_legend_childs.perfect_scroller);
+ }
+
+ maxMessageFontSize();
+ }
+
+ this.tm.last_resized = Date.now();
+ }
+ };
+
+ // this is the actual chart resize algorithm
+ // it will:
+ // - resize the entire container
+ // - update the internal states
+ // - resize the chart as the div changes height
+ // - update the scrollbar of the legend
+ const resizeChartToHeight = (h) => {
+ // console.log(h);
+ this.element.style.height = h;
+
+ if (this.settings_id !== null) {
+ NETDATA.localStorageSet('chart_heights.' + this.settings_id, h);
+ }
+
+ let now = Date.now();
+ NETDATA.options.last_page_scroll = now;
+ NETDATA.options.auto_refresher_stop_until = now + NETDATA.options.current.stop_updates_while_resizing;
+
+ // force a resize
+ this.tm.last_resized = 0;
+ resizeChart();
+ };
+
+ this.resizeForPrint = function () {
+ if (typeof this.element_legend_childs !== 'undefined' && this.element_legend_childs.perfect_scroller !== null) {
+ let current = this.element.clientHeight;
+ let optimal = current
+ + this.element_legend_childs.perfect_scroller.scrollHeight
+ - this.element_legend_childs.perfect_scroller.clientHeight;
+
+ if (optimal > current) {
+ // this.log('resized');
+ this.element.style.height = optimal + 'px';
+ this.library.resize(this);
+ }
+ }
+ };
+
+ this.resizeHandler = function (e) {
+ e.preventDefault();
+
+ if (typeof this.event_resize === 'undefined'
+ || this.event_resize.chart_original_w === 'undefined'
+ || this.event_resize.chart_original_h === 'undefined') {
+ this.event_resize = {
+ chart_original_w: this.element.clientWidth,
+ chart_original_h: this.element.clientHeight,
+ last: 0
+ };
+ }
+
+ if (e.type === 'touchstart') {
+ this.event_resize.mouse_start_x = e.touches.item(0).pageX;
+ this.event_resize.mouse_start_y = e.touches.item(0).pageY;
+ } else {
+ this.event_resize.mouse_start_x = e.clientX;
+ this.event_resize.mouse_start_y = e.clientY;
+ }
+
+ this.event_resize.chart_start_w = this.element.clientWidth;
+ this.event_resize.chart_start_h = this.element.clientHeight;
+ this.event_resize.chart_last_w = this.element.clientWidth;
+ this.event_resize.chart_last_h = this.element.clientHeight;
+
+ let now = Date.now();
+ if (now - this.event_resize.last <= NETDATA.options.current.double_click_speed && this.element_legend_childs.perfect_scroller !== null) {
+ // double click / double tap event
+
+ // console.dir(this.element_legend_childs.content);
+ // console.dir(this.element_legend_childs.perfect_scroller);
+
+ // the optimal height of the chart
+ // showing the entire legend
+ let optimal = this.event_resize.chart_last_h
+ + this.element_legend_childs.perfect_scroller.scrollHeight
+ - this.element_legend_childs.perfect_scroller.clientHeight;
+
+ // if we are not optimal, be optimal
+ if (this.event_resize.chart_last_h !== optimal) {
+ // this.log('resize to optimal, current = ' + this.event_resize.chart_last_h.toString() + 'px, original = ' + this.event_resize.chart_original_h.toString() + 'px, optimal = ' + optimal.toString() + 'px, internal = ' + this.height_original.toString());
+ resizeChartToHeight(optimal.toString() + 'px');
+ }
+
+ // else if the current height is not the original/saved height
+ // reset to the original/saved height
+ else if (this.event_resize.chart_last_h !== this.event_resize.chart_original_h) {
+ // this.log('resize to original, current = ' + this.event_resize.chart_last_h.toString() + 'px, original = ' + this.event_resize.chart_original_h.toString() + 'px, optimal = ' + optimal.toString() + 'px, internal = ' + this.height_original.toString());
+ resizeChartToHeight(this.event_resize.chart_original_h.toString() + 'px');
+ }
+
+ // else if the current height is not the internal default height
+ // reset to the internal default height
+ else if ((this.event_resize.chart_last_h.toString() + 'px') !== this.height_original) {
+ // this.log('resize to internal default, current = ' + this.event_resize.chart_last_h.toString() + 'px, original = ' + this.event_resize.chart_original_h.toString() + 'px, optimal = ' + optimal.toString() + 'px, internal = ' + this.height_original.toString());
+ resizeChartToHeight(this.height_original.toString());
+ }
+
+ // else if the current height is not the firstchild's clientheight
+ // resize to it
+ else if (typeof this.element_legend_childs.perfect_scroller.firstChild !== 'undefined') {
+ let parent_rect = this.element.getBoundingClientRect();
+ let content_rect = this.element_legend_childs.perfect_scroller.firstElementChild.getBoundingClientRect();
+ let wanted = content_rect.top - parent_rect.top + this.element_legend_childs.perfect_scroller.firstChild.clientHeight + 18; // 15 = toolbox + 3 space
+
+ // console.log(parent_rect);
+ // console.log(content_rect);
+ // console.log(wanted);
+
+ // this.log('resize to firstChild, current = ' + this.event_resize.chart_last_h.toString() + 'px, original = ' + this.event_resize.chart_original_h.toString() + 'px, optimal = ' + optimal.toString() + 'px, internal = ' + this.height_original.toString() + 'px, firstChild = ' + wanted.toString() + 'px' );
+ if (this.event_resize.chart_last_h !== wanted) {
+ resizeChartToHeight(wanted.toString() + 'px');
+ }
+ }
+ } else {
+ this.event_resize.last = now;
+
+ // process movement event
+ document.onmousemove =
+ document.ontouchmove =
+ this.element_legend_childs.resize_handler.onmousemove =
+ this.element_legend_childs.resize_handler.ontouchmove =
+ function (e) {
+ let y = null;
+
+ switch (e.type) {
+ case 'mousemove':
+ y = e.clientY;
+ break;
+ case 'touchmove':
+ y = e.touches.item(e.touches - 1).pageY;
+ break;
+ }
+
+ if (y !== null) {
+ let newH = that.event_resize.chart_start_h + y - that.event_resize.mouse_start_y;
+
+ if (newH >= 70 && newH !== that.event_resize.chart_last_h) {
+ resizeChartToHeight(newH.toString() + 'px');
+ that.event_resize.chart_last_h = newH;
+ }
+ }
+ };
+
+ // process end event
+ document.onmouseup =
+ document.ontouchend =
+ this.element_legend_childs.resize_handler.onmouseup =
+ this.element_legend_childs.resize_handler.ontouchend =
+ function (e) {
+ void(e);
+
+ // remove all the hooks
+ document.onmouseup =
+ document.onmousemove =
+ document.ontouchmove =
+ document.ontouchend =
+ that.element_legend_childs.resize_handler.onmousemove =
+ that.element_legend_childs.resize_handler.ontouchmove =
+ that.element_legend_childs.resize_handler.onmouseout =
+ that.element_legend_childs.resize_handler.onmouseup =
+ that.element_legend_childs.resize_handler.ontouchend =
+ null;
+
+ // allow auto-refreshes
+ NETDATA.options.auto_refresher_stop_until = 0;
+ };
+ }
+ };
+
+ const noDataToShow = () => {
+ showMessageIcon(NETDATA.icons.noData + ' empty');
+ this.legendUpdateDOM();
+ this.tm.last_autorefreshed = Date.now();
+ // this.data_update_every = 30 * 1000;
+ //this.element_chart.style.display = 'none';
+ //if (this.element_legend !== null) this.element_legend.style.display = 'none';
+ //this.tmp.___chartIsHidden___ = true;
+ };
+
+ // ============================================================================================================
+ // PUBLIC FUNCTIONS
+
+ this.error = function (msg) {
+ error(msg);
+ };
+
+ this.setMode = function (m) {
+ if (this.current !== null && this.current.name === m) {
+ return;
+ }
+
+ if (m === 'auto') {
+ this.current = this.auto;
+ } else if (m === 'pan') {
+ this.current = this.pan;
+ } else if (m === 'zoom') {
+ this.current = this.zoom;
+ } else {
+ this.current = this.auto;
+ }
+
+ this.current.force_update_at = 0;
+ this.current.force_before_ms = null;
+ this.current.force_after_ms = null;
+
+ this.tm.last_mode_switch = Date.now();
+ };
+
+ // ----------------------------------------------------------------------------------------------------------------
+ // global selection sync for slaves
+
+ // can the chart participate to the global selection sync as a slave?
+ this.globalSelectionSyncIsEligible = function () {
+ return (
+ this.enabled &&
+ this.library !== null &&
+ typeof this.library.setSelection === 'function' &&
+ this.isVisible() &&
+ this.chart_created
+ );
+ };
+
+ this.setSelection = function (t) {
+ if (typeof this.library.setSelection === 'function') {
+ // this.selected = this.library.setSelection(this, t) === true;
+ this.selected = this.library.setSelection(this, t);
+ } else {
+ this.selected = true;
+ }
+
+ if (this.selected && this.debug) {
+ this.log('selection set to ' + t.toString());
+ }
+
+ if (this.foreignElementSelection !== null) {
+ this.foreignElementSelection.innerText = NETDATA.dateTime.localeDateString(t) + ' ' + NETDATA.dateTime.localeTimeString(t);
+ }
+
+ return this.selected;
+ };
+
+ this.clearSelection = function () {
+ if (this.selected) {
+ if (typeof this.library.clearSelection === 'function') {
+ this.selected = (this.library.clearSelection(this) !== true);
+ } else {
+ this.selected = false;
+ }
+
+ if (this.selected === false && this.debug) {
+ this.log('selection cleared');
+ }
+
+ if (this.foreignElementSelection !== null) {
+ this.foreignElementSelection.innerText = '';
+ }
+
+ this.legendReset();
+ }
+
+ return this.selected;
+ };
+
+ // ----------------------------------------------------------------------------------------------------------------
+
+ // find if a timestamp (ms) is shown in the current chart
+ this.timeIsVisible = function (t) {
+ return (t >= this.data_after && t <= this.data_before);
+ };
+
+ this.calculateRowForTime = function (t) {
+ if (!this.timeIsVisible(t)) {
+ return -1;
+ }
+ return Math.floor((t - this.data_after) / this.data_update_every);
+ };
+
+ // ----------------------------------------------------------------------------------------------------------------
+
+ this.pauseChart = function () {
+ if (!this.paused) {
+ if (this.debug) {
+ this.log('pauseChart()');
+ }
+
+ this.paused = true;
+ }
+ };
+
+ this.unpauseChart = function () {
+ if (this.paused) {
+ if (this.debug) {
+ this.log('unpauseChart()');
+ }
+
+ this.paused = false;
+ }
+ };
+
+ this.resetChart = function (dontClearMaster, dontUpdate) {
+ if (this.debug) {
+ this.log('resetChart(' + dontClearMaster + ', ' + dontUpdate + ') called');
+ }
+
+ if (typeof dontClearMaster === 'undefined') {
+ dontClearMaster = false;
+ }
+
+ if (typeof dontUpdate === 'undefined') {
+ dontUpdate = false;
+ }
+
+ if (dontClearMaster !== true && NETDATA.globalPanAndZoom.isMaster(this)) {
+ if (this.debug) {
+ this.log('resetChart() diverting to clearMaster().');
+ }
+ // this will call us back with master === true
+ NETDATA.globalPanAndZoom.clearMaster();
+ return;
+ }
+
+ this.clearSelection();
+
+ this.tm.pan_and_zoom_seq = 0;
+
+ this.setMode('auto');
+ this.current.force_update_at = 0;
+ this.current.force_before_ms = null;
+ this.current.force_after_ms = null;
+ this.tm.last_autorefreshed = 0;
+ this.paused = false;
+ this.selected = false;
+ this.enabled = true;
+ // this.debug = false;
+
+ // do not update the chart here
+ // or the chart will flip-flop when it is the master
+ // of a selection sync and another chart becomes
+ // the new master
+
+ if (dontUpdate !== true && this.isVisible()) {
+ this.updateChart();
+ }
+ };
+
+ this.updateChartPanOrZoom = function (after, before, callback) {
+ let logme = 'updateChartPanOrZoom(' + after + ', ' + before + '): ';
+ let ret = true;
+
+ NETDATA.globalPanAndZoom.delay();
+ NETDATA.globalSelectionSync.delay();
+
+ if (this.debug) {
+ this.log(logme);
+ }
+
+ if (before < after) {
+ if (this.debug) {
+ this.log(logme + 'flipped parameters, rejecting it.');
+ }
+ return false;
+ }
+
+ if (typeof this.fixed_min_duration === 'undefined') {
+ this.fixed_min_duration = Math.round((this.chartWidth() / 30) * this.chart.update_every * 1000);
+ }
+
+ let min_duration = this.fixed_min_duration;
+ let current_duration = Math.round(this.view_before - this.view_after);
+
+ // round the numbers
+ after = Math.round(after);
+ before = Math.round(before);
+
+ // align them to update_every
+ // stretching them further away
+ after -= after % this.data_update_every;
+ before += this.data_update_every - (before % this.data_update_every);
+
+ // the final wanted duration
+ let wanted_duration = before - after;
+
+ // to allow panning, accept just a point below our minimum
+ if ((current_duration - this.data_update_every) < min_duration) {
+ min_duration = current_duration - this.data_update_every;
+ }
+
+ // we do it, but we adjust to minimum size and return false
+ // when the wanted size is below the current and the minimum
+ // and we zoom
+ if (wanted_duration < current_duration && wanted_duration < min_duration) {
+ if (this.debug) {
+ this.log(logme + 'too small: min_duration: ' + (min_duration / 1000).toString() + ', wanted: ' + (wanted_duration / 1000).toString());
+ }
+
+ min_duration = this.fixed_min_duration;
+
+ let dt = (min_duration - wanted_duration) / 2;
+ before += dt;
+ after -= dt;
+ wanted_duration = before - after;
+ ret = false;
+ }
+
+ let tolerance = this.data_update_every * 2;
+ let movement = Math.abs(before - this.view_before);
+
+ if (Math.abs(current_duration - wanted_duration) <= tolerance && movement <= tolerance && ret) {
+ if (this.debug) {
+ this.log(logme + 'REJECTING UPDATE: current/min duration: ' + (current_duration / 1000).toString() + '/' + (this.fixed_min_duration / 1000).toString() + ', wanted duration: ' + (wanted_duration / 1000).toString() + ', duration diff: ' + (Math.round(Math.abs(current_duration - wanted_duration) / 1000)).toString() + ', movement: ' + (movement / 1000).toString() + ', tolerance: ' + (tolerance / 1000).toString() + ', returning: ' + false);
+ }
+ return false;
+ }
+
+ if (this.current.name === 'auto') {
+ this.log(logme + 'caller called me with mode: ' + this.current.name);
+ this.setMode('pan');
+ }
+
+ if (this.debug) {
+ this.log(logme + 'ACCEPTING UPDATE: current/min duration: ' + (current_duration / 1000).toString() + '/' + (this.fixed_min_duration / 1000).toString() + ', wanted duration: ' + (wanted_duration / 1000).toString() + ', duration diff: ' + (Math.round(Math.abs(current_duration - wanted_duration) / 1000)).toString() + ', movement: ' + (movement / 1000).toString() + ', tolerance: ' + (tolerance / 1000).toString() + ', returning: ' + ret);
+ }
+
+ this.current.force_update_at = Date.now() + NETDATA.options.current.pan_and_zoom_delay;
+ this.current.force_after_ms = after;
+ this.current.force_before_ms = before;
+ NETDATA.globalPanAndZoom.setMaster(this, after, before);
+
+ if (ret && typeof callback === 'function') {
+ callback();
+ }
+
+ return ret;
+ };
+
+ this.updateChartPanOrZoomAsyncTimeOutId = undefined;
+ this.updateChartPanOrZoomAsync = function (after, before, callback) {
+ NETDATA.globalPanAndZoom.delay();
+ NETDATA.globalSelectionSync.delay();
+
+ if (!NETDATA.globalPanAndZoom.isMaster(this)) {
+ this.pauseChart();
+ NETDATA.globalPanAndZoom.setMaster(this, after, before);
+ // NETDATA.globalSelectionSync.stop();
+ NETDATA.globalSelectionSync.setMaster(this);
+ }
+
+ if (this.updateChartPanOrZoomAsyncTimeOutId) {
+ NETDATA.timeout.clear(this.updateChartPanOrZoomAsyncTimeOutId);
+ }
+
+ NETDATA.timeout.set(function () {
+ that.updateChartPanOrZoomAsyncTimeOutId = undefined;
+ that.updateChartPanOrZoom(after, before, callback);
+ }, 0);
+ };
+
+ let _unitsConversionLastUnits = undefined;
+ let _unitsConversionLastUnitsDesired = undefined;
+ let _unitsConversionLastMin = undefined;
+ let _unitsConversionLastMax = undefined;
+ let _unitsConversion = function (value) {
+ return value;
+ };
+ this.unitsConversionSetup = function (min, max) {
+ if (this.units !== _unitsConversionLastUnits
+ || this.units_desired !== _unitsConversionLastUnitsDesired
+ || min !== _unitsConversionLastMin
+ || max !== _unitsConversionLastMax) {
+
+ _unitsConversionLastUnits = this.units;
+ _unitsConversionLastUnitsDesired = this.units_desired;
+ _unitsConversionLastMin = min;
+ _unitsConversionLastMax = max;
+
+ _unitsConversion = NETDATA.unitsConversion.get(this.uuid, min, max, this.units, this.units_desired, this.units_common, function (units) {
+ // console.log('switching units from ' + that.units.toString() + ' to ' + units.toString());
+ that.units_current = units;
+ that.legendSetUnitsString(that.units_current);
+ });
+ }
+ };
+
+ let _legendFormatValueChartDecimalsLastMin = undefined;
+ let _legendFormatValueChartDecimalsLastMax = undefined;
+ let _legendFormatValueChartDecimals = -1;
+ let _intlNumberFormat = null;
+ this.legendFormatValueDecimalsFromMinMax = function (min, max) {
+ if (min === _legendFormatValueChartDecimalsLastMin && max === _legendFormatValueChartDecimalsLastMax) {
+ return;
+ }
+
+ this.unitsConversionSetup(min, max);
+ if (_unitsConversion !== null) {
+ min = _unitsConversion(min);
+ max = _unitsConversion(max);
+
+ if (typeof min !== 'number' || typeof max !== 'number') {
+ return;
+ }
+ }
+
+ _legendFormatValueChartDecimalsLastMin = min;
+ _legendFormatValueChartDecimalsLastMax = max;
+
+ let old = _legendFormatValueChartDecimals;
+
+ if (this.data !== null && this.data.min === this.data.max)
+ // it is a fixed number, let the visualizer decide based on the value
+ {
+ _legendFormatValueChartDecimals = -1;
+ } else if (this.value_decimal_detail !== -1)
+ // there is an override
+ {
+ _legendFormatValueChartDecimals = this.value_decimal_detail;
+ } else {
+ // ok, let's calculate the proper number of decimal points
+ let delta;
+
+ if (min === max) {
+ delta = Math.abs(min);
+ } else {
+ delta = Math.abs(max - min);
+ }
+
+ if (delta > 1000) {
+ _legendFormatValueChartDecimals = 0;
+ } else if (delta > 10) {
+ _legendFormatValueChartDecimals = 1;
+ } else if (delta > 1) {
+ _legendFormatValueChartDecimals = 2;
+ } else if (delta > 0.1) {
+ _legendFormatValueChartDecimals = 2;
+ } else if (delta > 0.01) {
+ _legendFormatValueChartDecimals = 4;
+ } else if (delta > 0.001) {
+ _legendFormatValueChartDecimals = 5;
+ } else if (delta > 0.0001) {
+ _legendFormatValueChartDecimals = 6;
+ } else {
+ _legendFormatValueChartDecimals = 7;
+ }
+ }
+
+ if (_legendFormatValueChartDecimals !== old) {
+ if (_legendFormatValueChartDecimals < 0) {
+ _intlNumberFormat = null;
+ } else {
+ _intlNumberFormat = NETDATA.fastNumberFormat.get(
+ _legendFormatValueChartDecimals,
+ _legendFormatValueChartDecimals
+ );
+ }
+ }
+ };
+
+ this.legendFormatValue = function (value) {
+ if (typeof value !== 'number') {
+ return '-';
+ }
+
+ value = _unitsConversion(value);
+
+ if (typeof value !== 'number') {
+ return value;
+ }
+
+ if (_intlNumberFormat !== null) {
+ return _intlNumberFormat.format(value);
+ }
+
+ let dmin, dmax;
+ if (this.value_decimal_detail !== -1) {
+ dmin = dmax = this.value_decimal_detail;
+ } else {
+ dmin = 0;
+ let abs = (value < 0) ? -value : value;
+ if (abs > 1000) {
+ dmax = 0;
+ } else if (abs > 10) {
+ dmax = 1;
+ } else if (abs > 1) {
+ dmax = 2;
+ } else if (abs > 0.1) {
+ dmax = 2;
+ } else if (abs > 0.01) {
+ dmax = 4;
+ } else if (abs > 0.001) {
+ dmax = 5;
+ } else if (abs > 0.0001) {
+ dmax = 6;
+ } else {
+ dmax = 7;
+ }
+ }
+
+ return NETDATA.fastNumberFormat.get(dmin, dmax).format(value);
+ };
+
+ this.legendSetLabelValue = function (label, value) {
+ let series = this.element_legend_childs.series[label];
+ if (typeof series === 'undefined') {
+ return;
+ }
+ if (series.value === null && series.user === null) {
+ return;
+ }
+
+ /*
+ // this slows down firefox and edge significantly
+ // since it requires to use innerHTML(), instead of innerText()
+
+ // if the value has not changed, skip DOM update
+ //if (series.last === value) return;
+
+ let s, r;
+ if (typeof value === 'number') {
+ let v = Math.abs(value);
+ s = r = this.legendFormatValue(value);
+
+ if (typeof series.last === 'number') {
+ if (v > series.last) s += '<i class="fas fa-angle-up" style="width: 8px; text-align: center; overflow: hidden; vertical-align: middle;"></i>';
+ else if (v < series.last) s += '<i class="fas fa-angle-down" style="width: 8px; text-align: center; overflow: hidden; vertical-align: middle;"></i>';
+ else s += '<i class="fas fa-angle-left" style="width: 8px; text-align: center; overflow: hidden; vertical-align: middle;"></i>';
+ }
+ else s += '<i class="fas fa-angle-right" style="width: 8px; text-align: center; overflow: hidden; vertical-align: middle;"></i>';
+
+ series.last = v;
+ }
+ else {
+ if (value === null)
+ s = r = '';
+ else
+ s = r = value;
+
+ series.last = value;
+ }
+ */
+
+ let s = this.legendFormatValue(value);
+
+ // caching: do not update the update to show the same value again
+ if (s === series.last_shown_value) {
+ return;
+ }
+ series.last_shown_value = s;
+
+ if (series.value !== null) {
+ series.value.innerText = s;
+ }
+ if (series.user !== null) {
+ series.user.innerText = s;
+ }
+ };
+
+ this.legendSetDateString = function (date) {
+ if (this.element_legend_childs.title_date !== null && date !== this.tmp.__last_shown_legend_date) {
+ this.element_legend_childs.title_date.innerText = date;
+ this.tmp.__last_shown_legend_date = date;
+ }
+ };
+
+ this.legendSetTimeString = function (time) {
+ if (this.element_legend_childs.title_time !== null && time !== this.tmp.__last_shown_legend_time) {
+ this.element_legend_childs.title_time.innerText = time;
+ this.tmp.__last_shown_legend_time = time;
+ }
+ };
+
+ this.legendSetUnitsString = function (units) {
+ if (this.element_legend_childs.title_units !== null && units !== this.tmp.__last_shown_legend_units) {
+ this.element_legend_childs.title_units.innerText = units;
+ this.tmp.__last_shown_legend_units = units;
+ }
+ };
+
+ this.legendSetDateLast = {
+ ms: 0,
+ date: undefined,
+ time: undefined
+ };
+
+ this.legendSetDate = function (ms) {
+ if (typeof ms !== 'number') {
+ this.legendShowUndefined();
+ return;
+ }
+
+ if (this.legendSetDateLast.ms !== ms) {
+ let d = new Date(ms);
+ this.legendSetDateLast.ms = ms;
+ this.legendSetDateLast.date = NETDATA.dateTime.localeDateString(d);
+ this.legendSetDateLast.time = NETDATA.dateTime.localeTimeString(d);
+ }
+
+ this.legendSetDateString(this.legendSetDateLast.date);
+ this.legendSetTimeString(this.legendSetDateLast.time);
+ this.legendSetUnitsString(this.units_current)
+ };
+
+ this.legendShowUndefined = function () {
+ this.legendSetDateString(this.legendPluginModuleString(false));
+ this.legendSetTimeString(this.chart.context.toString());
+ // this.legendSetUnitsString(' ');
+
+ if (this.data && this.element_legend_childs.series !== null) {
+ let labels = this.data.dimension_names;
+ let i = labels.length;
+ while (i--) {
+ let label = labels[i];
+
+ if (typeof label === 'undefined' || typeof this.element_legend_childs.series[label] === 'undefined') {
+ continue;
+ }
+ this.legendSetLabelValue(label, null);
+ }
+ }
+ };
+
+ this.legendShowLatestValues = function () {
+ if (this.chart === null) {
+ return;
+ }
+ if (this.selected) {
+ return;
+ }
+
+ if (this.data === null || this.element_legend_childs.series === null) {
+ this.legendShowUndefined();
+ return;
+ }
+
+ let show_undefined = true;
+ if (Math.abs(this.netdata_last - this.view_before) <= this.data_update_every) {
+ show_undefined = false;
+ }
+
+ if (show_undefined) {
+ this.legendShowUndefined();
+ return;
+ }
+
+ this.legendSetDate(this.view_before);
+
+ let labels = this.data.dimension_names;
+ let i = labels.length;
+ while (i--) {
+ let label = labels[i];
+
+ if (typeof label === 'undefined') {
+ continue;
+ }
+ if (typeof this.element_legend_childs.series[label] === 'undefined') {
+ continue;
+ }
+
+ this.legendSetLabelValue(label, this.data.view_latest_values[i]);
+ }
+ };
+
+ this.legendReset = function () {
+ this.legendShowLatestValues();
+ };
+
+ // this should be called just ONCE per dimension per chart
+ this.__chartDimensionColor = function (label) {
+ let c = NETDATA.commonColors.get(this, label);
+
+ // it is important to maintain a list of colors
+ // for this chart only, since the chart library
+ // uses this to assign colors to dimensions in the same
+ // order the dimension are given to it
+ this.colors.push(c);
+
+ return c;
+ };
+
+ this.chartPrepareColorPalette = function () {
+ NETDATA.commonColors.refill(this);
+ };
+
+ // get the ordered list of chart colors
+ // this includes user defined colors
+ this.chartCustomColors = function () {
+ this.chartPrepareColorPalette();
+
+ let colors;
+ if (this.colors_custom.length) {
+ colors = this.colors_custom;
+ } else {
+ colors = this.colors;
+ }
+
+ if (this.debug) {
+ this.log("chartCustomColors() returns:");
+ this.log(colors);
+ }
+
+ return colors;
+ };
+
+ // get the ordered list of chart ASSIGNED colors
+ // (this returns only the colors that have been
+ // assigned to dimensions, prepended with any
+ // custom colors defined)
+ this.chartColors = function () {
+ this.chartPrepareColorPalette();
+
+ if (this.debug) {
+ this.log("chartColors() returns:");
+ this.log(this.colors);
+ }
+
+ return this.colors;
+ };
+
+ this.legendPluginModuleString = function (withContext) {
+ let str = ' ';
+ let context = '';
+
+ if (typeof this.chart !== 'undefined') {
+ if (withContext && typeof this.chart.context === 'string') {
+ context = this.chart.context;
+ }
+
+ if (typeof this.chart.plugin === 'string' && this.chart.plugin !== '') {
+ str = this.chart.plugin;
+
+ if (str.endsWith(".plugin")) {
+ str = str.substring(0, str.length - 7);
+ }
+
+ if (typeof this.chart.module === 'string' && this.chart.module !== '') {
+ str += ':' + this.chart.module;
+ }
+
+ if (withContext && context !== '') {
+ str += ', ' + context;
+ }
+ }
+ else if (withContext && context !== '') {
+ str = context;
+ }
+ }
+
+ return str;
+ };
+
+ this.legendResolutionTooltip = function () {
+ if (!this.chart) {
+ return '';
+ }
+
+ let collected = this.chart.update_every;
+ let viewed = (this.data) ? this.data.view_update_every : collected;
+
+ if (collected === viewed) {
+ return "resolution " + NETDATA.seconds4human(collected);
+ }
+
+ return "resolution " + NETDATA.seconds4human(viewed) + ", collected every " + NETDATA.seconds4human(collected);
+ };
+
+ this.legendUpdateDOM = function () {
+ let needed = false, dim, keys, len;
+
+ // check that the legend DOM is up to date for the downloaded dimensions
+ if (typeof this.element_legend_childs.series !== 'object' || this.element_legend_childs.series === null) {
+ // this.log('the legend does not have any series - requesting legend update');
+ needed = true;
+ } else if (this.data === null) {
+ // this.log('the chart does not have any data - requesting legend update');
+ needed = true;
+ } else if (typeof this.element_legend_childs.series.labels_key === 'undefined') {
+ needed = true;
+ } else {
+ let labels = this.data.dimension_names.toString();
+ if (labels !== this.element_legend_childs.series.labels_key) {
+ needed = true;
+
+ if (this.debug) {
+ this.log('NEW LABELS: "' + labels + '" NOT EQUAL OLD LABELS: "' + this.element_legend_childs.series.labels_key + '"');
+ }
+ }
+ }
+
+ if (!needed) {
+ // make sure colors available
+ this.chartPrepareColorPalette();
+
+ // do we have to update the current values?
+ // we do this, only when the visible chart is current
+ if (Math.abs(this.netdata_last - this.view_before) <= this.data_update_every) {
+ if (this.debug) {
+ this.log('chart is in latest position... updating values on legend...');
+ }
+
+ //let labels = this.data.dimension_names;
+ //let i = labels.length;
+ //while (i--)
+ // this.legendSetLabelValue(labels[i], this.data.view_latest_values[i]);
+ }
+ return;
+ }
+
+ if (this.colors === null) {
+ // this is the first time we update the chart
+ // let's assign colors to all dimensions
+ if (this.library.track_colors()) {
+ this.colors = [];
+ keys = Object.keys(this.chart.dimensions);
+ len = keys.length;
+ for (let i = 0; i < len; i++) {
+ NETDATA.commonColors.get(this, this.chart.dimensions[keys[i]].name);
+ }
+ }
+ }
+
+ // we will re-generate the colors for the chart
+ // based on the dimensions this result has data for
+ this.colors = [];
+
+ if (this.debug) {
+ this.log('updating Legend DOM');
+ }
+
+ // mark all dimensions as invalid
+ this.dimensions_visibility.invalidateAll();
+
+ const genLabel = function (state, parent, dim, name, count) {
+ let color = state.__chartDimensionColor(name);
+
+ let user_element = null;
+ let user_id = NETDATA.dataAttribute(state.element, 'show-value-of-' + name.toLowerCase() + '-at', null);
+ if (user_id === null) {
+ user_id = NETDATA.dataAttribute(state.element, 'show-value-of-' + dim.toLowerCase() + '-at', null);
+ }
+ if (user_id !== null) {
+ user_element = document.getElementById(user_id) || null;
+ if (user_element === null) {
+ state.log('Cannot find element with id: ' + user_id);
+ }
+ }
+
+ state.element_legend_childs.series[name] = {
+ name: document.createElement('span'),
+ value: document.createElement('span'),
+ user: user_element,
+ last: null,
+ last_shown_value: null
+ };
+
+ let label = state.element_legend_childs.series[name];
+
+ // create the dimension visibility tracking for this label
+ state.dimensions_visibility.dimensionAdd(name, label.name, label.value, color);
+
+ let rgb = NETDATA.colorHex2Rgb(color);
+ label.name.innerHTML = '<table class="netdata-legend-name-table-'
+ + state.chart.chart_type
+ + '" style="background-color: '
+ + 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + NETDATA.options.current['color_fill_opacity_' + state.chart.chart_type] + ') !important'
+ + '"><tr class="netdata-legend-name-tr"><td class="netdata-legend-name-td"></td></tr></table>';
+
+ let text = document.createTextNode(' ' + name);
+ label.name.appendChild(text);
+
+ if (count > 0) {
+ parent.appendChild(document.createElement('br'));
+ }
+
+ parent.appendChild(label.name);
+ parent.appendChild(label.value);
+ };
+
+ let content = document.createElement('div');
+
+ if (this.element_chart === null) {
+ this.element_chart = document.createElement('div');
+ this.element_chart.id = this.library_name + '-' + this.uuid + '-chart';
+ this.element.appendChild(this.element_chart);
+
+ if (this.hasLegend()) {
+ this.element_chart.className = 'netdata-chart-with-legend-right netdata-' + this.library_name + '-chart-with-legend-right';
+ } else {
+ this.element_chart.className = ' netdata-chart netdata-' + this.library_name + '-chart';
+ }
+ }
+
+ if (this.hasLegend()) {
+ if (this.element_legend === null) {
+ this.element_legend = document.createElement('div');
+ this.element_legend.className = 'netdata-chart-legend netdata-' + this.library_name + '-legend';
+ this.element.appendChild(this.element_legend);
+ } else {
+ this.element_legend.innerHTML = '';
+ }
+
+ this.element_legend_childs = {
+ content: content,
+ resize_handler: null,
+ toolbox: null,
+ toolbox_left: null,
+ toolbox_right: null,
+ toolbox_reset: null,
+ toolbox_zoomin: null,
+ toolbox_zoomout: null,
+ toolbox_volume: null,
+ title_date: document.createElement('span'),
+ title_time: document.createElement('span'),
+ title_units: document.createElement('span'),
+ perfect_scroller: document.createElement('div'),
+ series: {}
+ };
+
+ if (NETDATA.options.current.legend_toolbox && this.library.toolboxPanAndZoom !== null) {
+ this.element_legend_childs.toolbox = document.createElement('div');
+ this.element_legend_childs.toolbox_left = document.createElement('div');
+ this.element_legend_childs.toolbox_right = document.createElement('div');
+ this.element_legend_childs.toolbox_reset = document.createElement('div');
+ this.element_legend_childs.toolbox_zoomin = document.createElement('div');
+ this.element_legend_childs.toolbox_zoomout = document.createElement('div');
+ this.element_legend_childs.toolbox_volume = document.createElement('div');
+
+ const getPanAndZoomStep = function (event) {
+ if (event.ctrlKey) {
+ return NETDATA.options.current.pan_and_zoom_factor * NETDATA.options.current.pan_and_zoom_factor_multiplier_control;
+ } else if (event.shiftKey) {
+ return NETDATA.options.current.pan_and_zoom_factor * NETDATA.options.current.pan_and_zoom_factor_multiplier_shift;
+ } else if (event.altKey) {
+ return NETDATA.options.current.pan_and_zoom_factor * NETDATA.options.current.pan_and_zoom_factor_multiplier_alt;
+ } else {
+ return NETDATA.options.current.pan_and_zoom_factor;
+ }
+ };
+
+ this.element_legend_childs.toolbox.className += ' netdata-legend-toolbox';
+ this.element.appendChild(this.element_legend_childs.toolbox);
+
+ this.element_legend_childs.toolbox_left.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_left.innerHTML = NETDATA.icons.left;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_left);
+ this.element_legend_childs.toolbox_left.onclick = function (e) {
+ e.preventDefault();
+
+ let step = (that.view_before - that.view_after) * getPanAndZoomStep(e);
+ let before = that.view_before - step;
+ let after = that.view_after - step;
+ if (after >= that.netdata_first) {
+ that.library.toolboxPanAndZoom(that, after, before);
+ }
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_left).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Pan Left',
+ content: 'Pan the chart to the left. You can also <b>drag it</b> with your mouse or your finger (on touch devices).<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ this.element_legend_childs.toolbox_reset.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_reset.innerHTML = NETDATA.icons.reset;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_reset);
+ this.element_legend_childs.toolbox_reset.onclick = function (e) {
+ e.preventDefault();
+ NETDATA.resetAllCharts(that);
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_reset).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Chart Reset',
+ content: 'Reset all the charts to their default auto-refreshing state. You can also <b>double click</b> the chart contents with your mouse or your finger (on touch devices).<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ this.element_legend_childs.toolbox_right.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_right.innerHTML = NETDATA.icons.right;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_right);
+ this.element_legend_childs.toolbox_right.onclick = function (e) {
+ e.preventDefault();
+ let step = (that.view_before - that.view_after) * getPanAndZoomStep(e);
+ let before = that.view_before + step;
+ let after = that.view_after + step;
+ if (before <= that.netdata_last) {
+ that.library.toolboxPanAndZoom(that, after, before);
+ }
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_right).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Pan Right',
+ content: 'Pan the chart to the right. You can also <b>drag it</b> with your mouse or your finger (on touch devices).<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ this.element_legend_childs.toolbox_zoomin.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_zoomin.innerHTML = NETDATA.icons.zoomIn;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_zoomin);
+ this.element_legend_childs.toolbox_zoomin.onclick = function (e) {
+ e.preventDefault();
+ let dt = ((that.view_before - that.view_after) * (getPanAndZoomStep(e) * 0.8) / 2);
+ let before = that.view_before - dt;
+ let after = that.view_after + dt;
+ that.library.toolboxPanAndZoom(that, after, before);
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_zoomin).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Chart Zoom In',
+ content: 'Zoom in the chart. You can also press SHIFT and select an area of the chart, or press SHIFT or ALT and use the mouse wheel or 2-finger touchpad scroll to zoom in or out.<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ this.element_legend_childs.toolbox_zoomout.className += ' netdata-legend-toolbox-button';
+ this.element_legend_childs.toolbox_zoomout.innerHTML = NETDATA.icons.zoomOut;
+ this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_zoomout);
+ this.element_legend_childs.toolbox_zoomout.onclick = function (e) {
+ e.preventDefault();
+ let dt = (((that.view_before - that.view_after) / (1.0 - (getPanAndZoomStep(e) * 0.8)) - (that.view_before - that.view_after)) / 2);
+ let before = that.view_before + dt;
+ let after = that.view_after - dt;
+
+ that.library.toolboxPanAndZoom(that, after, before);
+ };
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.toolbox_zoomout).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Chart Zoom Out',
+ content: 'Zoom out the chart. You can also press SHIFT or ALT and use the mouse wheel, or 2-finger touchpad scroll to zoom in or out.<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ //this.element_legend_childs.toolbox_volume.className += ' netdata-legend-toolbox-button';
+ //this.element_legend_childs.toolbox_volume.innerHTML = '<i class="fas fa-sort-amount-down"></i>';
+ //this.element_legend_childs.toolbox_volume.title = 'Visible Volume';
+ //this.element_legend_childs.toolbox.appendChild(this.element_legend_childs.toolbox_volume);
+ //this.element_legend_childs.toolbox_volume.onclick = function(e) {
+ //e.preventDefault();
+ //alert('clicked toolbox_volume on ' + that.id);
+ //}
+ }
+
+ if (NETDATA.options.current.resize_charts) {
+ this.element_legend_childs.resize_handler = document.createElement('div');
+
+ this.element_legend_childs.resize_handler.className += " netdata-legend-resize-handler";
+ this.element_legend_childs.resize_handler.innerHTML = NETDATA.icons.resize;
+ this.element.appendChild(this.element_legend_childs.resize_handler);
+ if (NETDATA.options.current.show_help) {
+ $(this.element_legend_childs.resize_handler).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ title: 'Chart Resize',
+ content: 'Drag this point with your mouse or your finger (on touch devices), to resize the chart vertically. You can also <b>double click it</b> or <b>double tap it</b> to reset between 2 states: the default and the one that fits all the values.<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+
+ // mousedown event
+ this.element_legend_childs.resize_handler.onmousedown =
+ function (e) {
+ that.resizeHandler(e);
+ };
+
+ // touchstart event
+ this.element_legend_childs.resize_handler.addEventListener('touchstart', function (e) {
+ that.resizeHandler(e);
+ }, false);
+ }
+
+ if (this.chart) {
+ this.element_legend_childs.title_date.title = this.legendPluginModuleString(true);
+ this.element_legend_childs.title_time.title = this.legendResolutionTooltip();
+ }
+
+ this.element_legend_childs.title_date.className += " netdata-legend-title-date";
+ this.element_legend.appendChild(this.element_legend_childs.title_date);
+ this.tmp.__last_shown_legend_date = undefined;
+
+ this.element_legend.appendChild(document.createElement('br'));
+
+ this.element_legend_childs.title_time.className += " netdata-legend-title-time";
+ this.element_legend.appendChild(this.element_legend_childs.title_time);
+ this.tmp.__last_shown_legend_time = undefined;
+
+ this.element_legend.appendChild(document.createElement('br'));
+
+ this.element_legend_childs.title_units.className += " netdata-legend-title-units";
+ this.element_legend_childs.title_units.innerText = this.units_current;
+ this.element_legend.appendChild(this.element_legend_childs.title_units);
+ this.tmp.__last_shown_legend_units = undefined;
+
+ this.element_legend.appendChild(document.createElement('br'));
+
+ this.element_legend_childs.perfect_scroller.className = 'netdata-legend-series';
+ this.element_legend.appendChild(this.element_legend_childs.perfect_scroller);
+
+ content.className = 'netdata-legend-series-content';
+ this.element_legend_childs.perfect_scroller.appendChild(content);
+
+ this.element_legend_childs.content = content;
+
+ if (NETDATA.options.current.show_help) {
+ $(content).popover({
+ container: "body",
+ animation: false,
+ html: true,
+ trigger: 'hover',
+ placement: 'bottom',
+ title: 'Chart Legend',
+ delay: {
+ show: NETDATA.options.current.show_help_delay_show_ms,
+ hide: NETDATA.options.current.show_help_delay_hide_ms
+ },
+ content: 'You can click or tap on the values or the labels to select dimensions. By pressing SHIFT or CONTROL, you can enable or disable multiple dimensions.<br/><small>Help can be disabled from the settings.</small>'
+ });
+ }
+ } else {
+ this.element_legend_childs = {
+ content: content,
+ resize_handler: null,
+ toolbox: null,
+ toolbox_left: null,
+ toolbox_right: null,
+ toolbox_reset: null,
+ toolbox_zoomin: null,
+ toolbox_zoomout: null,
+ toolbox_volume: null,
+ title_date: null,
+ title_time: null,
+ title_units: null,
+ perfect_scroller: null,
+ series: {}
+ };
+ }
+
+ if (this.data) {
+ this.element_legend_childs.series.labels_key = this.data.dimension_names.toString();
+ if (this.debug) {
+ this.log('labels from data: "' + this.element_legend_childs.series.labels_key + '"');
+ }
+
+ for (let i = 0, len = this.data.dimension_names.length; i < len; i++) {
+ genLabel(this, content, this.data.dimension_ids[i], this.data.dimension_names[i], i);
+ }
+ } else {
+ let tmp = [];
+ keys = Object.keys(this.chart.dimensions);
+ for (let i = 0, len = keys.length; i < len; i++) {
+ dim = keys[i];
+ tmp.push(this.chart.dimensions[dim].name);
+ genLabel(this, content, dim, this.chart.dimensions[dim].name, i);
+ }
+ this.element_legend_childs.series.labels_key = tmp.toString();
+ if (this.debug) {
+ this.log('labels from chart: "' + this.element_legend_childs.series.labels_key + '"');
+ }
+ }
+
+ // create a hidden div to be used for hidding
+ // the original legend of the chart library
+ let el = document.createElement('div');
+ if (this.element_legend !== null) {
+ this.element_legend.appendChild(el);
+ }
+ el.style.display = 'none';
+
+ this.element_legend_childs.hidden = document.createElement('div');
+ el.appendChild(this.element_legend_childs.hidden);
+
+ if (this.element_legend_childs.perfect_scroller !== null) {
+ Ps.initialize(this.element_legend_childs.perfect_scroller, {
+ wheelSpeed: 0.2,
+ wheelPropagation: true,
+ swipePropagation: true,
+ minScrollbarLength: null,
+ maxScrollbarLength: null,
+ useBothWheelAxes: false,
+ suppressScrollX: true,
+ suppressScrollY: false,
+ scrollXMarginOffset: 0,
+ scrollYMarginOffset: 0,
+ theme: 'default'
+ });
+ Ps.update(this.element_legend_childs.perfect_scroller);
+ }
+
+ this.legendShowLatestValues();
+ };
+
+ this.hasLegend = function () {
+ if (typeof this.tmp.___hasLegendCache___ !== 'undefined') {
+ return this.tmp.___hasLegendCache___;
+ }
+
+ let leg = false;
+ if (this.library && this.library.legend(this) === 'right-side') {
+ leg = true;
+ }
+
+ this.tmp.___hasLegendCache___ = leg;
+ return leg;
+ };
+
+ this.legendWidth = function () {
+ return (this.hasLegend()) ? 140 : 0;
+ };
+
+ this.legendHeight = function () {
+ return $(this.element).height();
+ };
+
+ this.chartWidth = function () {
+ return $(this.element).width() - this.legendWidth();
+ };
+
+ this.chartHeight = function () {
+ return $(this.element).height();
+ };
+
+ this.chartPixelsPerPoint = function () {
+ // force an options provided detail
+ let px = this.pixels_per_point;
+
+ if (this.library && px < this.library.pixels_per_point(this)) {
+ px = this.library.pixels_per_point(this);
+ }
+
+ if (px < NETDATA.options.current.pixels_per_point) {
+ px = NETDATA.options.current.pixels_per_point;
+ }
+
+ return px;
+ };
+
+ this.needsRecreation = function () {
+ let ret = (
+ this.chart_created &&
+ this.library &&
+ this.library.autoresize() === false &&
+ this.tm.last_resized < NETDATA.options.last_page_resize
+ );
+
+ if (this.debug) {
+ this.log('needsRecreation(): ' + ret.toString() + ', chart_created = ' + this.chart_created.toString());
+ }
+
+ return ret;
+ };
+
+ this.chartDataUniqueID = function () {
+ return this.id + ',' + this.library_name + ',' + this.dimensions + ',' + this.chartURLOptions(true);
+ };
+
+ this.chartURLOptions = function (isForUniqueId) {
+ let ret = '';
+
+ if (this.override_options !== null) {
+ ret = this.override_options.toString();
+ } else {
+ ret = this.library.options(this);
+ }
+
+ if (this.append_options !== null) {
+ ret += '%7C' + this.append_options.toString();
+ }
+
+ ret += '%7C' + 'jsonwrap';
+
+ // always add `nonzero` when it's used to create a chartDataUniqueID
+ // we cannot just remove `nonzero` because of backwards compatibility with old snapshots
+ if (isForUniqueId || NETDATA.options.current.eliminate_zero_dimensions) {
+ ret += '%7C' + 'nonzero';
+ }
+
+ return ret;
+ };
+
+ this.chartURL = function () {
+ let after, before, points_multiplier = 1;
+ if (NETDATA.globalPanAndZoom.isActive()) {
+ if (this.current.force_before_ms !== null && this.current.force_after_ms !== null) {
+ this.tm.pan_and_zoom_seq = 0;
+
+ before = Math.round(this.current.force_before_ms / 1000);
+ after = Math.round(this.current.force_after_ms / 1000);
+ this.view_after = after * 1000;
+ this.view_before = before * 1000;
+
+ if (NETDATA.options.current.pan_and_zoom_data_padding) {
+ this.requested_padding = Math.round((before - after) / 2);
+ after -= this.requested_padding;
+ before += this.requested_padding;
+ this.requested_padding *= 1000;
+ points_multiplier = 2;
+ }
+
+ this.current.force_before_ms = null;
+ this.current.force_after_ms = null;
+ } else {
+ this.tm.pan_and_zoom_seq = NETDATA.globalPanAndZoom.seq;
+
+ after = Math.round(NETDATA.globalPanAndZoom.force_after_ms / 1000);
+ before = Math.round(NETDATA.globalPanAndZoom.force_before_ms / 1000);
+ this.view_after = after * 1000;
+ this.view_before = before * 1000;
+
+ this.requested_padding = null;
+ points_multiplier = 1;
+ }
+ } else {
+ this.tm.pan_and_zoom_seq = 0;
+
+ before = this.before;
+ after = this.after;
+ this.view_after = after * 1000;
+ this.view_before = before * 1000;
+
+ this.requested_padding = null;
+ points_multiplier = 1;
+ }
+
+ this.requested_after = after * 1000;
+ this.requested_before = before * 1000;
+
+ let data_points;
+ if (NETDATA.options.force_data_points !== 0) {
+ data_points = NETDATA.options.force_data_points;
+ this.data_points = data_points;
+ } else {
+ this.data_points = this.points || Math.round(this.chartWidth() / this.chartPixelsPerPoint());
+ data_points = this.data_points * points_multiplier;
+ }
+
+ // build the data URL
+ this.data_url = this.host + this.chart.data_url;
+ this.data_url += "&format=" + this.library.format();
+ this.data_url += "&points=" + (data_points).toString();
+ this.data_url += "&group=" + this.method;
+ this.data_url += ">ime=" + this.gtime;
+ this.data_url += "&options=" + this.chartURLOptions();
+
+ if (after) {
+ this.data_url += "&after=" + after.toString();
+ }
+
+ if (before) {
+ this.data_url += "&before=" + before.toString();
+ }
+
+ if (this.dimensions) {
+ this.data_url += "&dimensions=" + this.dimensions;
+ }
+
+ if (NETDATA.options.debug.chart_data_url || this.debug) {
+ this.log('chartURL(): ' + this.data_url + ' WxH:' + this.chartWidth() + 'x' + this.chartHeight() + ' points: ' + data_points.toString() + ' library: ' + this.library_name);
+ }
+ };
+
+ this.redrawChart = function () {
+ if (this.data !== null) {
+ this.updateChartWithData(this.data);
+ }
+ };
+
+ this.updateChartWithData = function (data) {
+ if (this.debug) {
+ this.log('updateChartWithData() called.');
+ }
+
+ // this may force the chart to be re-created
+ resizeChart();
+
+ this.data = data;
+
+ let started = Date.now();
+ let view_update_every = data.view_update_every * 1000;
+
+ if (this.data_update_every !== view_update_every) {
+ if (this.element_legend_childs.title_time) {
+ this.element_legend_childs.title_time.title = this.legendResolutionTooltip();
+ }
+ }
+
+ // if the result is JSON, find the latest update-every
+ this.data_update_every = view_update_every;
+ this.data_after = data.after * 1000;
+ this.data_before = data.before * 1000;
+ this.netdata_first = data.first_entry * 1000;
+ this.netdata_last = data.last_entry * 1000;
+ this.data_points = data.points;
+
+ data.state = this;
+
+ if (NETDATA.options.current.pan_and_zoom_data_padding && this.requested_padding !== null) {
+ if (this.view_after < this.data_after) {
+ // console.log('adjusting view_after from ' + this.view_after + ' to ' + this.data_after);
+ this.view_after = this.data_after;
+ }
+
+ if (this.view_before > this.data_before) {
+ // console.log('adjusting view_before from ' + this.view_before + ' to ' + this.data_before);
+ this.view_before = this.data_before;
+ }
+ } else {
+ this.view_after = this.data_after;
+ this.view_before = this.data_before;
+ }
+
+ if (this.debug) {
+ this.log('UPDATE No ' + this.updates_counter + ' COMPLETED');
+
+ if (this.current.force_after_ms) {
+ this.log('STATUS: forced : ' + (this.current.force_after_ms / 1000).toString() + ' - ' + (this.current.force_before_ms / 1000).toString());
+ } else {
+ this.log('STATUS: forced : unset');
+ }
+
+ this.log('STATUS: requested : ' + (this.requested_after / 1000).toString() + ' - ' + (this.requested_before / 1000).toString());
+ this.log('STATUS: downloaded: ' + (this.data_after / 1000).toString() + ' - ' + (this.data_before / 1000).toString());
+ this.log('STATUS: rendered : ' + (this.view_after / 1000).toString() + ' - ' + (this.view_before / 1000).toString());
+ this.log('STATUS: points : ' + (this.data_points).toString());
+ }
+
+ if (this.data_points === 0) {
+ noDataToShow();
+ return;
+ }
+
+ if (this.updates_since_last_creation >= this.library.max_updates_to_recreate()) {
+ if (this.debug) {
+ this.log('max updates of ' + this.updates_since_last_creation.toString() + ' reached. Forcing re-generation.');
+ }
+
+ init('force');
+ return;
+ }
+
+ // check and update the legend
+ this.legendUpdateDOM();
+
+ if (this.chart_created && typeof this.library.update === 'function') {
+ if (this.debug) {
+ this.log('updating chart...');
+ }
+
+ if (!callChartLibraryUpdateSafely(data)) {
+ return;
+ }
+ } else {
+ if (this.debug) {
+ this.log('creating chart...');
+ }
+
+ if (!callChartLibraryCreateSafely(data)) {
+ return;
+ }
+ }
+
+ if (this.isVisible()) {
+ hideMessage();
+ this.legendShowLatestValues();
+ } else {
+ this.__redraw_on_unhide = true;
+
+ if (this.debug) {
+ this.log("drawn while not visible");
+ }
+ }
+
+ if (this.selected) {
+ NETDATA.globalSelectionSync.stop();
+ }
+
+ // update the performance counters
+ let now = Date.now();
+ this.tm.last_updated = now;
+
+ // don't update last_autorefreshed if this chart is
+ // forced to be updated with global PanAndZoom
+ if (NETDATA.globalPanAndZoom.isActive()) {
+ this.tm.last_autorefreshed = 0;
+ } else {
+ if (NETDATA.options.current.parallel_refresher && NETDATA.options.current.concurrent_refreshes && typeof this.force_update_every !== 'number') {
+ this.tm.last_autorefreshed = now - (now % this.data_update_every);
+ } else {
+ this.tm.last_autorefreshed = now;
+ }
+ }
+
+ this.refresh_dt_ms = now - started;
+ NETDATA.options.auto_refresher_fast_weight += this.refresh_dt_ms;
+
+ if (this.refresh_dt_element !== null) {
+ this.refresh_dt_element.innerText = this.refresh_dt_ms.toString();
+ }
+
+ if (this.foreignElementBefore !== null) {
+ this.foreignElementBefore.innerText = NETDATA.dateTime.localeDateString(this.view_before) + ' ' + NETDATA.dateTime.localeTimeString(this.view_before);
+ }
+
+ if (this.foreignElementAfter !== null) {
+ this.foreignElementAfter.innerText = NETDATA.dateTime.localeDateString(this.view_after) + ' ' + NETDATA.dateTime.localeTimeString(this.view_after);
+ }
+
+ if (this.foreignElementDuration !== null) {
+ this.foreignElementDuration.innerText = NETDATA.seconds4human(Math.floor((this.view_before - this.view_after) / 1000) + 1);
+ }
+
+ if (this.foreignElementUpdateEvery !== null) {
+ this.foreignElementUpdateEvery.innerText = NETDATA.seconds4human(Math.floor(this.data_update_every / 1000));
+ }
+ };
+
+ this.getSnapshotData = function (key) {
+ if (this.debug) {
+ this.log('updating from snapshot: ' + key);
+ }
+
+ if (typeof netdataSnapshotData.data[key] === 'undefined') {
+ this.log('snapshot does not include data for key "' + key + '"');
+ return null;
+ }
+
+ if (typeof netdataSnapshotData.data[key] !== 'string') {
+ this.log('snapshot data for key "' + key + '" is not string');
+ return null;
+ }
+
+ let uncompressed;
+ try {
+ uncompressed = netdataSnapshotData.uncompress(netdataSnapshotData.data[key]);
+
+ if (uncompressed === null) {
+ this.log('uncompressed snapshot data for key ' + key + ' is null');
+ return null;
+ }
+
+ if (typeof uncompressed === 'undefined') {
+ this.log('uncompressed snapshot data for key ' + key + ' is undefined');
+ return null;
+ }
+ } catch (e) {
+ this.log('decompression of snapshot data for key ' + key + ' failed');
+ console.log(e);
+ uncompressed = null;
+ }
+
+ if (typeof uncompressed !== 'string') {
+ this.log('uncompressed snapshot data for key ' + key + ' is not string');
+ return null;
+ }
+
+ let data;
+ try {
+ data = JSON.parse(uncompressed);
+ } catch (e) {
+ this.log('parsing snapshot data for key ' + key + ' failed');
+ console.log(e);
+ data = null;
+ }
+
+ return data;
+ };
+
+ this.updateChart = function (callback) {
+ if (this.debug) {
+ this.log('updateChart()');
+ }
+
+ if (this.fetching_data) {
+ if (this.debug) {
+ this.log('updateChart(): I am already updating...');
+ }
+
+ if (typeof callback === 'function') {
+ return callback(false, 'already running');
+ }
+
+ return;
+ }
+
+ // due to late initialization of charts and libraries
+ // we need to check this too
+ if (!this.enabled) {
+ if (this.debug) {
+ this.log('updateChart(): I am not enabled');
+ }
+
+ if (typeof callback === 'function') {
+ return callback(false, 'not enabled');
+ }
+
+ return;
+ }
+
+ if (!canBeRendered()) {
+ if (this.debug) {
+ this.log('updateChart(): cannot be rendered');
+ }
+
+ if (typeof callback === 'function') {
+ return callback(false, 'cannot be rendered');
+ }
+
+ return;
+ }
+
+ if (that.dom_created !== true) {
+ if (this.debug) {
+ this.log('updateChart(): creating DOM');
+ }
+
+ createDOM();
+ }
+
+ if (this.chart === null) {
+ if (this.debug) {
+ this.log('updateChart(): getting chart');
+ }
+
+ return this.getChart(function () {
+ return that.updateChart(callback);
+ });
+ }
+
+ if (!this.library.initialized) {
+ if (this.library.enabled) {
+ if (this.debug) {
+ this.log('updateChart(): initializing chart library');
+ }
+
+ return this.library.initialize(function () {
+ return that.updateChart(callback);
+ });
+ } else {
+ error('chart library "' + this.library_name + '" is not available.');
+
+ if (typeof callback === 'function') {
+ return callback(false, 'library not available');
+ }
+
+ return;
+ }
+ }
+
+ this.clearSelection();
+ this.chartURL();
+
+ NETDATA.statistics.refreshes_total++;
+ NETDATA.statistics.refreshes_active++;
+
+ if (NETDATA.statistics.refreshes_active > NETDATA.statistics.refreshes_active_max) {
+ NETDATA.statistics.refreshes_active_max = NETDATA.statistics.refreshes_active;
+ }
+
+ let ok = false;
+ this.fetching_data = true;
+
+ if (netdataSnapshotData !== null) {
+ let key = this.chartDataUniqueID();
+ let data = this.getSnapshotData(key);
+ if (data !== null) {
+ ok = true;
+ data = NETDATA.xss.checkData('/api/v1/data', data, this.library.xssRegexIgnore);
+ this.updateChartWithData(data);
+ } else {
+ ok = false;
+ error('cannot get data from snapshot for key: "' + key + '"');
+ that.tm.last_autorefreshed = Date.now();
+ }
+
+ NETDATA.statistics.refreshes_active--;
+ this.fetching_data = false;
+
+ if (typeof callback === 'function') {
+ callback(ok, 'snapshot');
+ }
+
+ return;
+ }
+
+ if (this.debug) {
+ this.log('updating from ' + this.data_url);
+ }
+
+ this.xhr = $.ajax({
+ url: this.data_url,
+ cache: false,
+ async: true,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkData('/api/v1/data', data, that.library.xssRegexIgnore);
+
+ that.xhr = undefined;
+ that.retries_on_data_failures = 0;
+ ok = true;
+
+ if (that.debug) {
+ that.log('data received. updating chart.');
+ }
+
+ that.updateChartWithData(data);
+ })
+ .fail(function (msg) {
+ that.xhr = undefined;
+
+ if (msg.statusText !== 'abort') {
+ that.retries_on_data_failures++;
+ if (that.retries_on_data_failures > NETDATA.options.current.retries_on_data_failures) {
+ // that.log('failed ' + that.retries_on_data_failures.toString() + ' times - giving up');
+ that.retries_on_data_failures = 0;
+ error('data download failed for url: ' + that.data_url);
+ }
+ else {
+ that.tm.last_autorefreshed = Date.now();
+ // that.log('failed ' + that.retries_on_data_failures.toString() + ' times, but I will retry');
+ }
+ }
+ })
+ .always(function () {
+ that.xhr = undefined;
+
+ NETDATA.statistics.refreshes_active--;
+ that.fetching_data = false;
+
+ if (typeof callback === 'function') {
+ return callback(ok, 'download');
+ }
+ });
+ };
+
+ const __isVisible = function () {
+ let ret = true;
+
+ if (NETDATA.options.current.update_only_visible !== false) {
+ // tolerance is the number of pixels a chart can be off-screen
+ // to consider it as visible and refresh it as if was visible
+ let tolerance = 0;
+
+ that.tm.last_visible_check = Date.now();
+
+ let rect = that.element.getBoundingClientRect();
+
+ let screenTop = window.scrollY;
+ let screenBottom = screenTop + window.innerHeight;
+
+ let chartTop = rect.top + screenTop;
+ let chartBottom = chartTop + rect.height;
+
+ ret = !(rect.width === 0 || rect.height === 0 || chartBottom + tolerance < screenTop || chartTop - tolerance > screenBottom);
+ }
+
+ if (that.debug) {
+ that.log('__isVisible(): ' + ret);
+ }
+
+ return ret;
+ };
+
+ this.isVisible = function (nocache) {
+ // this.log('last_visible_check: ' + this.tm.last_visible_check + ', last_page_scroll: ' + NETDATA.options.last_page_scroll);
+
+ // caching - we do not evaluate the charts visibility
+ // if the page has not been scrolled since the last check
+ if ((typeof nocache !== 'undefined' && nocache)
+ || typeof this.tmp.___isVisible___ === 'undefined'
+ || this.tm.last_visible_check <= NETDATA.options.last_page_scroll) {
+ this.tmp.___isVisible___ = __isVisible();
+ if (this.tmp.___isVisible___) {
+ this.unhideChart();
+ } else {
+ this.hideChart();
+ }
+ }
+
+ if (this.debug) {
+ this.log('isVisible(' + nocache + '): ' + this.tmp.___isVisible___);
+ }
+
+ return this.tmp.___isVisible___;
+ };
+
+ this.isAutoRefreshable = function () {
+ return (this.current.autorefresh);
+ };
+
+ this.canBeAutoRefreshed = function () {
+ if (!this.enabled) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> not enabled');
+ }
+
+ return false;
+ }
+
+ if (this.running) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> already running');
+ }
+
+ return false;
+ }
+
+ if (this.library === null || this.library.enabled === false) {
+ error('charting library "' + this.library_name + '" is not available');
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> chart library ' + this.library_name + ' is not available');
+ }
+
+ return false;
+ }
+
+ if (!this.isVisible()) {
+ if (NETDATA.options.debug.visibility || this.debug) {
+ this.log('canBeAutoRefreshed() -> not visible');
+ }
+
+ return false;
+ }
+
+ let now = Date.now();
+
+ if (this.current.force_update_at !== 0 && this.current.force_update_at < now) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> timed force update - allowing this update');
+ }
+
+ this.current.force_update_at = 0;
+ return true;
+ }
+
+ if (!this.isAutoRefreshable()) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> not auto-refreshable');
+ }
+
+ return false;
+ }
+
+ // allow the first update, even if the page is not visible
+ if (NETDATA.options.page_is_visible === false && this.updates_counter && this.updates_since_last_unhide) {
+ if (NETDATA.options.debug.focus || this.debug) {
+ this.log('canBeAutoRefreshed() -> not the first update, and page does not have focus');
+ }
+
+ return false;
+ }
+
+ if (this.needsRecreation()) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> needs re-creation.');
+ }
+
+ return true;
+ }
+
+ if (NETDATA.options.auto_refresher_stop_until >= now) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed() -> stopped until is in future.');
+ }
+
+ return false;
+ }
+
+ // options valid only for autoRefresh()
+ if (NETDATA.globalPanAndZoom.isActive()) {
+ if (NETDATA.globalPanAndZoom.shouldBeAutoRefreshed(this)) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): global panning: I need an update.');
+ }
+
+ return true;
+ }
+ else {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): global panning: I am already up to date.');
+ }
+
+ return false;
+ }
+ }
+
+ if (this.selected) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): I have a selection in place.');
+ }
+
+ return false;
+ }
+
+ if (this.paused) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): I am paused.');
+ }
+
+ return false;
+ }
+
+ let data_update_every = this.data_update_every;
+ if (typeof this.force_update_every === 'number') {
+ data_update_every = this.force_update_every;
+ }
+
+ if (now - this.tm.last_autorefreshed >= data_update_every) {
+ if (this.debug) {
+ this.log('canBeAutoRefreshed(): It is time to update me. Now: ' + now.toString() + ', last_autorefreshed: ' + this.tm.last_autorefreshed + ', data_update_every: ' + data_update_every + ', delta: ' + (now - this.tm.last_autorefreshed).toString());
+ }
+
+ return true;
+ }
+
+ return false;
+ };
+
+ this.autoRefresh = function (callback) {
+ let state = that;
+
+ if (state.canBeAutoRefreshed() && state.running === false) {
+ state.running = true;
+ state.updateChart(function () {
+ state.running = false;
+
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ });
+ } else {
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ }
+ };
+
+ this.__defaultsFromDownloadedChart = function (chart) {
+ this.chart = chart;
+ this.chart_url = chart.url;
+ this.data_update_every = chart.update_every * 1000;
+ this.data_points = Math.round(this.chartWidth() / this.chartPixelsPerPoint());
+ this.tm.last_info_downloaded = Date.now();
+
+ if (this.title === null) {
+ this.title = chart.title;
+ }
+
+ if (this.units === null) {
+ this.units = chart.units;
+ this.units_current = this.units;
+ }
+ };
+
+ // fetch the chart description from the netdata server
+ this.getChart = function (callback) {
+ this.chart = NETDATA.chartRegistry.get(this.host, this.id);
+ if (this.chart) {
+ this.__defaultsFromDownloadedChart(this.chart);
+
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ } else if (netdataSnapshotData !== null) {
+ // console.log(this);
+ // console.log(NETDATA.chartRegistry);
+ NETDATA.error(404, 'host: ' + this.host + ', chart: ' + this.id);
+ error('chart not found in snapshot');
+
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ } else {
+ this.chart_url = "/api/v1/chart?chart=" + this.id;
+
+ if (this.debug) {
+ this.log('downloading ' + this.chart_url);
+ }
+
+ $.ajax({
+ url: this.host + this.chart_url,
+ cache: false,
+ async: true,
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (chart) {
+ chart = NETDATA.xss.checkOptional('/api/v1/chart', chart);
+
+ chart.url = that.chart_url;
+ that.__defaultsFromDownloadedChart(chart);
+ NETDATA.chartRegistry.add(that.host, that.id, chart);
+ })
+ .fail(function () {
+ NETDATA.error(404, that.chart_url);
+ error('chart not found on url "' + that.chart_url + '"');
+ })
+ .always(function () {
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ });
+ }
+ };
+
+ // ============================================================================================================
+ // INITIALIZATION
+
+ initDOM();
+ init('fast');
+};
+
+NETDATA.resetAllCharts = function (state) {
+ // first clear the global selection sync
+ // to make sure no chart is in selected state
+ NETDATA.globalSelectionSync.stop();
+
+ // there are 2 possibilities here
+ // a. state is the global Pan and Zoom master
+ // b. state is not the global Pan and Zoom master
+
+ // let master = true;
+ // if (NETDATA.globalPanAndZoom.isMaster(state) === false) {
+ // master = false;
+ // }
+ const master = NETDATA.globalPanAndZoom.isMaster(state);
+
+ // clear the global Pan and Zoom
+ // this will also refresh the master
+ // and unblock any charts currently mirroring the master
+ NETDATA.globalPanAndZoom.clearMaster();
+
+ // if we were not the master, reset our status too
+ // this is required because most probably the mouse
+ // is over this chart, blocking it from auto-refreshing
+ if (master === false && (state.paused || state.selected)) {
+ state.resetChart();
+ }
+};
+
+// get or create a chart state, given a DOM element
+NETDATA.chartState = function (element) {
+ let self = $(element);
+
+ let state = self.data('netdata-state-object') || null;
+ if (state === null) {
+ state = new chartState(element);
+ self.data('netdata-state-object', state);
+ }
+ return state;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// Library functions
+
+// Load a script without jquery
+// This is used to load jquery - after it is loaded, we use jquery
+NETDATA._loadjQuery = function (callback) {
+ if (typeof jQuery === 'undefined') {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('loading ' + NETDATA.jQuery);
+ }
+
+ let script = document.createElement('script');
+ script.type = 'text/javascript';
+ script.async = true;
+ script.src = NETDATA.jQuery;
+
+ // script.onabort = onError;
+ script.onerror = function () {
+ NETDATA.error(101, NETDATA.jQuery);
+ };
+ if (typeof callback === "function") {
+ script.onload = function () {
+ $ = jQuery;
+ return callback();
+ };
+ }
+
+ let s = document.getElementsByTagName('script')[0];
+ s.parentNode.insertBefore(script, s);
+ }
+ else if (typeof callback === "function") {
+ $ = jQuery;
+ return callback();
+ }
+};
+
+NETDATA._loadCSS = function (filename) {
+ // don't use jQuery here
+ // styles are loaded before jQuery
+ // to eliminate showing an unstyled page to the user
+
+ let fileref = document.createElement("link");
+ fileref.setAttribute("rel", "stylesheet");
+ fileref.setAttribute("type", "text/css");
+ fileref.setAttribute("href", filename);
+
+ if (typeof fileref !== 'undefined') {
+ document.getElementsByTagName("head")[0].appendChild(fileref);
+ }
+};
+
+// user function to signal us the DOM has been
+// updated.
+NETDATA.updatedDom = function () {
+ NETDATA.options.updated_dom = true;
+};
+
+NETDATA.ready = function (callback) {
+ NETDATA.options.pauseCallback = callback;
+};
+
+NETDATA.pause = function (callback) {
+ if (typeof callback === 'function') {
+ if (NETDATA.options.pause) {
+ return callback();
+ } else {
+ NETDATA.options.pauseCallback = callback;
+ }
+ }
+};
+
+NETDATA.unpause = function () {
+ NETDATA.options.pauseCallback = null;
+ NETDATA.options.updated_dom = true;
+ NETDATA.options.pause = false;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+
+// this is purely sequential charts refresher
+// it is meant to be autonomous
+NETDATA.chartRefresherNoParallel = function (index, callback) {
+ let targets = NETDATA.intersectionObserver.targets();
+
+ if (NETDATA.options.debug.main_loop) {
+ console.log('NETDATA.chartRefresherNoParallel(' + index + ')');
+ }
+
+ if (NETDATA.options.updated_dom) {
+ // the dom has been updated
+ // get the dom parts again
+ NETDATA.parseDom(callback);
+ return;
+ }
+ if (index >= targets.length) {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('waiting to restart main loop...');
+ }
+
+ NETDATA.options.auto_refresher_fast_weight = 0;
+ callback();
+ } else {
+ let state = targets[index];
+
+ if (NETDATA.options.auto_refresher_fast_weight < NETDATA.options.current.fast_render_timeframe) {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('fast rendering...');
+ }
+
+ if (state.isVisible()) {
+ NETDATA.timeout.set(function () {
+ state.autoRefresh(function () {
+ NETDATA.chartRefresherNoParallel(++index, callback);
+ });
+ }, 0);
+ } else {
+ NETDATA.chartRefresherNoParallel(++index, callback);
+ }
+ } else {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('waiting for next refresh...');
+ }
+ NETDATA.options.auto_refresher_fast_weight = 0;
+
+ NETDATA.timeout.set(function () {
+ state.autoRefresh(function () {
+ NETDATA.chartRefresherNoParallel(++index, callback);
+ });
+ }, NETDATA.options.current.idle_between_charts);
+ }
+ }
+};
+
+NETDATA.chartRefresherWaitTime = function () {
+ return NETDATA.options.current.idle_parallel_loops;
+};
+
+// the default refresher
+NETDATA.chartRefresherLastRun = 0;
+NETDATA.chartRefresherRunsAfterParseDom = 0;
+NETDATA.chartRefresherTimeoutId = undefined;
+
+NETDATA.chartRefresherReschedule = function () {
+ if (NETDATA.options.current.async_on_scroll) {
+ if (NETDATA.chartRefresherTimeoutId) {
+ NETDATA.timeout.clear(NETDATA.chartRefresherTimeoutId);
+ }
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(NETDATA.chartRefresher, NETDATA.options.current.onscroll_worker_duration_threshold);
+ //console.log('chartRefresherReschedule()');
+ }
+};
+
+NETDATA.chartRefresher = function () {
+ // console.log('chartRefresher() begin ' + (Date.now() - NETDATA.chartRefresherLastRun).toString() + ' ms since last run');
+
+ if (NETDATA.options.page_is_visible === false
+ && NETDATA.options.current.stop_updates_when_focus_is_lost
+ && NETDATA.chartRefresherLastRun > NETDATA.options.last_page_resize
+ && NETDATA.chartRefresherLastRun > NETDATA.options.last_page_scroll
+ && NETDATA.chartRefresherRunsAfterParseDom > 10
+ ) {
+ setTimeout(
+ NETDATA.chartRefresher,
+ NETDATA.options.current.idle_lost_focus
+ );
+
+ // console.log('chartRefresher() page without focus, will run in ' + NETDATA.options.current.idle_lost_focus.toString() + ' ms, ' + NETDATA.chartRefresherRunsAfterParseDom.toString());
+ return;
+ }
+ NETDATA.chartRefresherRunsAfterParseDom++;
+
+ let now = Date.now();
+ NETDATA.chartRefresherLastRun = now;
+
+ if (now < NETDATA.options.on_scroll_refresher_stop_until) {
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.chartRefresherWaitTime()
+ );
+
+ // console.log('chartRefresher() end1 will run in ' + NETDATA.chartRefresherWaitTime().toString() + ' ms');
+ return;
+ }
+
+ if (now < NETDATA.options.auto_refresher_stop_until) {
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.chartRefresherWaitTime()
+ );
+
+ // console.log('chartRefresher() end2 will run in ' + NETDATA.chartRefresherWaitTime().toString() + ' ms');
+ return;
+ }
+
+ if (NETDATA.options.pause) {
+ // console.log('auto-refresher is paused');
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.chartRefresherWaitTime()
+ );
+
+ // console.log('chartRefresher() end3 will run in ' + NETDATA.chartRefresherWaitTime().toString() + ' ms');
+ return;
+ }
+
+ if (typeof NETDATA.options.pauseCallback === 'function') {
+ // console.log('auto-refresher is calling pauseCallback');
+
+ NETDATA.options.pause = true;
+ NETDATA.options.pauseCallback();
+ NETDATA.chartRefresher();
+
+ // console.log('chartRefresher() end4 (nested)');
+ return;
+ }
+
+ if (!NETDATA.options.current.parallel_refresher) {
+ // console.log('auto-refresher is calling chartRefresherNoParallel(0)');
+ NETDATA.chartRefresherNoParallel(0, function () {
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.options.current.idle_between_loops
+ );
+ });
+ // console.log('chartRefresher() end5 (no parallel, nested)');
+ return;
+ }
+
+ if (NETDATA.options.updated_dom) {
+ // the dom has been updated
+ // get the dom parts again
+ // console.log('auto-refresher is calling parseDom()');
+ NETDATA.parseDom(NETDATA.chartRefresher);
+ // console.log('chartRefresher() end6 (parseDom)');
+ return;
+ }
+
+ if (!NETDATA.globalSelectionSync.active()) {
+ let parallel = [];
+ let targets = NETDATA.intersectionObserver.targets();
+ let len = targets.length;
+ let state;
+ while (len--) {
+ state = targets[len];
+ if (state.running || state.isVisible() === false) {
+ continue;
+ }
+
+ if (!state.library.initialized) {
+ if (state.library.enabled) {
+ state.library.initialize(NETDATA.chartRefresher);
+ //console.log('chartRefresher() end6 (library init)');
+ return;
+ }
+ else {
+ state.error('chart library "' + state.library_name + '" is not enabled.');
+ }
+ }
+
+ if (NETDATA.scrollUp) {
+ parallel.unshift(state);
+ } else {
+ parallel.push(state);
+ }
+ }
+
+ len = parallel.length;
+ while (len--) {
+ state = parallel[len];
+ // console.log('auto-refresher executing in parallel for ' + parallel.length.toString() + ' charts');
+ // this will execute the jobs in parallel
+
+ if (!state.running) {
+ NETDATA.timeout.set(state.autoRefresh, 0);
+ }
+ }
+ //else {
+ // console.log('auto-refresher nothing to do');
+ //}
+ }
+
+ // run the next refresh iteration
+ NETDATA.chartRefresherTimeoutId = NETDATA.timeout.set(
+ NETDATA.chartRefresher,
+ NETDATA.chartRefresherWaitTime()
+ );
+
+ //console.log('chartRefresher() completed in ' + (Date.now() - now).toString() + ' ms');
+};
+
+NETDATA.parseDom = function (callback) {
+ //console.log('parseDom()');
+
+ NETDATA.options.last_page_scroll = Date.now();
+ NETDATA.options.updated_dom = false;
+ NETDATA.chartRefresherRunsAfterParseDom = 0;
+
+ let targets = $('div[data-netdata]'); //.filter(':visible');
+
+ if (NETDATA.options.debug.main_loop) {
+ console.log('DOM updated - there are ' + targets.length + ' charts on page.');
+ }
+
+ NETDATA.intersectionObserver.globalReset();
+ NETDATA.options.targets = [];
+ let len = targets.length;
+ while (len--) {
+ // the initialization will take care of sizing
+ // and the "loading..." message
+ let state = NETDATA.chartState(targets[len]);
+ NETDATA.options.targets.push(state);
+ NETDATA.intersectionObserver.observe(state);
+ }
+
+ if (NETDATA.globalChartUnderlay.isActive()) {
+ NETDATA.globalChartUnderlay.setup();
+ } else {
+ NETDATA.globalChartUnderlay.clear();
+ }
+
+ if (typeof callback === 'function') {
+ return callback();
+ }
+};
+
+// this is the main function - where everything starts
+NETDATA.started = false;
+NETDATA.start = function () {
+ // this should be called only once
+
+ if (NETDATA.started) {
+ console.log('netdata is already started');
+ return;
+ }
+
+ NETDATA.started = true;
+ NETDATA.options.page_is_visible = true;
+
+ $(window).blur(function () {
+ if (NETDATA.options.current.stop_updates_when_focus_is_lost) {
+ NETDATA.options.page_is_visible = false;
+ if (NETDATA.options.debug.focus) {
+ console.log('Lost Focus!');
+ }
+ }
+ });
+
+ $(window).focus(function () {
+ if (NETDATA.options.current.stop_updates_when_focus_is_lost) {
+ NETDATA.options.page_is_visible = true;
+ if (NETDATA.options.debug.focus) {
+ console.log('Focus restored!');
+ }
+ }
+ });
+
+ if (typeof document.hasFocus === 'function' && !document.hasFocus()) {
+ if (NETDATA.options.current.stop_updates_when_focus_is_lost) {
+ NETDATA.options.page_is_visible = false;
+ if (NETDATA.options.debug.focus) {
+ console.log('Document has no focus!');
+ }
+ }
+ }
+
+ // bootstrap tab switching
+ $('a[data-toggle="tab"]').on('shown.bs.tab', NETDATA.onscroll);
+
+ // bootstrap modal switching
+ let $modal = $('.modal');
+ $modal.on('hidden.bs.modal', NETDATA.onscroll);
+ $modal.on('shown.bs.modal', NETDATA.onscroll);
+
+ // bootstrap collapse switching
+ let $collapse = $('.collapse');
+ $collapse.on('hidden.bs.collapse', NETDATA.onscroll);
+ $collapse.on('shown.bs.collapse', NETDATA.onscroll);
+
+ NETDATA.parseDom(NETDATA.chartRefresher);
+
+ // Alarms initialization
+ setTimeout(NETDATA.alarms.init, 1000);
+
+ // Registry initialization
+ setTimeout(NETDATA.registry.init, netdataRegistryAfterMs);
+
+ if (typeof netdataCallback === 'function') {
+ netdataCallback();
+ }
+};
+
+NETDATA.globalReset = function () {
+ NETDATA.intersectionObserver.globalReset();
+ NETDATA.globalSelectionSync.globalReset();
+ NETDATA.globalPanAndZoom.globalReset();
+ NETDATA.chartRegistry.globalReset();
+ NETDATA.commonMin.globalReset();
+ NETDATA.commonMax.globalReset();
+ NETDATA.commonColors.globalReset();
+ NETDATA.unitsConversion.globalReset();
+ NETDATA.options.targets = [];
+ NETDATA.parseDom();
+ NETDATA.unpause();
+};
+
+// Registry of netdata hosts
+
+NETDATA.alarms = {
+ onclick: null, // the callback to handle the click - it will be called with the alarm log entry
+ chart_div_offset: -50, // give that space above the chart when scrolling to it
+ chart_div_id_prefix: 'chart_', // the chart DIV IDs have this prefix (they should be NETDATA.name2id(chart.id))
+ chart_div_animation_duration: 0,// the duration of the animation while scrolling to a chart
+
+ ms_penalty: 0, // the time penalty of the next alarm
+ ms_between_notifications: 500, // firefox moves the alarms off-screen (above, outside the top of the screen)
+ // if alarms are shown faster than: one per 500ms
+
+ update_every: 10000, // the time in ms between alarm checks
+
+ notifications: false, // when true, the browser supports notifications (may not be granted though)
+ last_notification_id: 0, // the id of the last alarm_log we have raised an alarm for
+ first_notification_id: 0, // the id of the first alarm_log entry for this session
+ // this is used to prevent CLEAR notifications for past events
+ // notifications_shown: [],
+
+ server: null, // the server to connect to for fetching alarms
+ current: null, // the list of raised alarms - updated in the background
+
+ // a callback function to call every time the list of raised alarms is refreshed
+ callback: (typeof netdataAlarmsActiveCallback === 'function') ? netdataAlarmsActiveCallback : null,
+
+ // a callback function to call every time a notification is shown
+ // the return value is used to decide if the notification will be shown
+ notificationCallback: (typeof netdataAlarmsNotifCallback === 'function') ? netdataAlarmsNotifCallback : null,
+
+ recipients: null, // the list (array) of recipients to show alarms for, or null
+
+ recipientMatches: function (to_string, wanted_array) {
+ if (typeof wanted_array === 'undefined' || wanted_array === null || Array.isArray(wanted_array) === false) {
+ return true;
+ }
+
+ let r = ' ' + to_string.toString() + ' ';
+ let len = wanted_array.length;
+ while (len--) {
+ if (r.indexOf(' ' + wanted_array[len] + ' ') >= 0) {
+ return true;
+ }
+ }
+
+ return false;
+ },
+
+ activeForRecipients: function () {
+ let active = {};
+ let data = NETDATA.alarms.current;
+
+ if (typeof data === 'undefined' || data === null) {
+ return active;
+ }
+
+ for (let x in data.alarms) {
+ if (!data.alarms.hasOwnProperty(x)) {
+ continue;
+ }
+
+ let alarm = data.alarms[x];
+ if ((alarm.status === 'WARNING' || alarm.status === 'CRITICAL') && NETDATA.alarms.recipientMatches(alarm.recipient, NETDATA.alarms.recipients)) {
+ active[x] = alarm;
+ }
+ }
+
+ return active;
+ },
+
+ notify: function (entry) {
+ // console.log('alarm ' + entry.unique_id);
+
+ if (entry.updated) {
+ // console.log('alarm ' + entry.unique_id + ' has been updated by another alarm');
+ return;
+ }
+
+ let value_string = entry.value_string;
+
+ if (NETDATA.alarms.current !== null) {
+ // get the current value_string
+ let t = NETDATA.alarms.current.alarms[entry.chart + '.' + entry.name];
+ if (typeof t !== 'undefined' && entry.status === t.status && typeof t.value_string !== 'undefined') {
+ value_string = t.value_string;
+ }
+ }
+
+ let name = entry.name.replace(/_/g, ' ');
+ let status = entry.status.toLowerCase();
+ let title = name + ' = ' + value_string.toString();
+ let tag = entry.alarm_id;
+ let icon = 'images/banner-icon-144x144.png';
+ let interaction = false;
+ let data = entry;
+ let show = true;
+
+ // console.log('alarm ' + entry.unique_id + ' ' + entry.chart + '.' + entry.name + ' is ' + entry.status);
+
+ switch (entry.status) {
+ case 'REMOVED':
+ show = false;
+ break;
+
+ case 'UNDEFINED':
+ return;
+
+ case 'UNINITIALIZED':
+ return;
+
+ case 'CLEAR':
+ if (entry.unique_id < NETDATA.alarms.first_notification_id) {
+ // console.log('alarm ' + entry.unique_id + ' is not current');
+ return;
+ }
+ if (entry.old_status === 'UNINITIALIZED' || entry.old_status === 'UNDEFINED') {
+ // console.log('alarm' + entry.unique_id + ' switch to CLEAR from ' + entry.old_status);
+ return;
+ }
+ if (entry.no_clear_notification) {
+ // console.log('alarm' + entry.unique_id + ' is CLEAR but has no_clear_notification flag');
+ return;
+ }
+ title = name + ' back to normal (' + value_string.toString() + ')';
+ icon = 'images/check-mark-2-128-green.png';
+ interaction = false;
+ break;
+
+ case 'WARNING':
+ if (entry.old_status === 'CRITICAL') {
+ status = 'demoted to ' + entry.status.toLowerCase();
+ }
+
+ icon = 'images/alert-128-orange.png';
+ interaction = false;
+ break;
+
+ case 'CRITICAL':
+ if (entry.old_status === 'WARNING') {
+ status = 'escalated to ' + entry.status.toLowerCase();
+ }
+
+ icon = 'images/alert-128-red.png';
+ interaction = true;
+ break;
+
+ default:
+ console.log('invalid alarm status ' + entry.status);
+ return;
+ }
+
+ // filter recipients
+ if (show) {
+ show = NETDATA.alarms.recipientMatches(entry.recipient, NETDATA.alarms.recipients);
+ }
+
+ /*
+ // cleanup old notifications with the same alarm_id as this one
+ // it does not seem to work on any web browser - so notifications cannot be removed
+
+ let len = NETDATA.alarms.notifications_shown.length;
+ while (len--) {
+ let n = NETDATA.alarms.notifications_shown[len];
+ if (n.data.alarm_id === entry.alarm_id) {
+ console.log('removing old alarm ' + n.data.unique_id);
+
+ // close the notification
+ n.close.bind(n);
+
+ // remove it from the array
+ NETDATA.alarms.notifications_shown.splice(len, 1);
+ len = NETDATA.alarms.notifications_shown.length;
+ }
+ }
+ */
+
+ if (show) {
+ if (typeof NETDATA.alarms.notificationCallback === 'function') {
+ show = NETDATA.alarms.notificationCallback(entry);
+ }
+
+ if (show) {
+ setTimeout(function () {
+ // show this notification
+ // console.log('new notification: ' + title);
+ let n = new Notification(title, {
+ body: entry.hostname + ' - ' + entry.chart + ' (' + entry.family + ') - ' + status + ': ' + entry.info,
+ tag: tag,
+ requireInteraction: interaction,
+ icon: NETDATA.serverStatic + icon,
+ data: data
+ });
+
+ n.onclick = function (event) {
+ event.preventDefault();
+ NETDATA.alarms.onclick(event.target.data);
+ };
+
+ // console.log(n);
+ // NETDATA.alarms.notifications_shown.push(n);
+ // console.log(entry);
+ }, NETDATA.alarms.ms_penalty);
+
+ NETDATA.alarms.ms_penalty += NETDATA.alarms.ms_between_notifications;
+ }
+ }
+ },
+
+ scrollToChart: function (chart_id) {
+ if (typeof chart_id === 'string') {
+ let offset = $('#' + NETDATA.alarms.chart_div_id_prefix + NETDATA.name2id(chart_id)).offset();
+ if (typeof offset !== 'undefined') {
+ $('html, body').animate({scrollTop: offset.top + NETDATA.alarms.chart_div_offset}, NETDATA.alarms.chart_div_animation_duration);
+ return true;
+ }
+ }
+ return false;
+ },
+
+ scrollToAlarm: function (alarm) {
+ if (typeof alarm === 'object') {
+ let ret = NETDATA.alarms.scrollToChart(alarm.chart);
+
+ if (ret && NETDATA.options.page_is_visible === false) {
+ window.focus();
+ }
+ // alert('netdata dashboard will now scroll to chart: ' + alarm.chart + '\n\nThis alarm opened to bring the browser window in front of the screen. Click on the dashboard to prevent it from appearing again.');
+ }
+
+ },
+
+ notifyAll: function () {
+ // console.log('FETCHING ALARM LOG');
+ NETDATA.alarms.get_log(NETDATA.alarms.last_notification_id, function (data) {
+ // console.log('ALARM LOG FETCHED');
+
+ if (data === null || typeof data !== 'object') {
+ console.log('invalid alarms log response');
+ return;
+ }
+
+ if (data.length === 0) {
+ console.log('received empty alarm log');
+ return;
+ }
+
+ // console.log('received alarm log of ' + data.length + ' entries, from ' + data[data.length - 1].unique_id.toString() + ' to ' + data[0].unique_id.toString());
+
+ data.sort(function (a, b) {
+ if (a.unique_id > b.unique_id) {
+ return -1;
+ }
+ if (a.unique_id < b.unique_id) {
+ return 1;
+ }
+ return 0;
+ });
+
+ NETDATA.alarms.ms_penalty = 0;
+
+ let len = data.length;
+ while (len--) {
+ if (data[len].unique_id > NETDATA.alarms.last_notification_id) {
+ NETDATA.alarms.notify(data[len]);
+ }
+ //else
+ // console.log('ignoring alarm (older) with id ' + data[len].unique_id.toString());
+ }
+
+ NETDATA.alarms.last_notification_id = data[0].unique_id;
+
+ if (typeof netdataAlarmsRemember === 'undefined' || netdataAlarmsRemember) {
+ NETDATA.localStorageSet('last_notification_id', NETDATA.alarms.last_notification_id, null);
+ }
+ // console.log('last notification id = ' + NETDATA.alarms.last_notification_id);
+ })
+ },
+
+ check_notifications: function () {
+ // returns true if we should fire 1+ notifications
+
+ if (NETDATA.alarms.notifications !== true) {
+ // console.log('web notifications are not available');
+ return false;
+ }
+
+ if (Notification.permission !== 'granted') {
+ // console.log('web notifications are not granted');
+ return false;
+ }
+
+ if (typeof NETDATA.alarms.current !== 'undefined' && typeof NETDATA.alarms.current.alarms === 'object') {
+ // console.log('can do alarms: old id = ' + NETDATA.alarms.last_notification_id + ' new id = ' + NETDATA.alarms.current.latest_alarm_log_unique_id);
+
+ if (NETDATA.alarms.current.latest_alarm_log_unique_id > NETDATA.alarms.last_notification_id) {
+ // console.log('new alarms detected');
+ return true;
+ }
+ //else console.log('no new alarms');
+ }
+ // else console.log('cannot process alarms');
+
+ return false;
+ },
+
+ get: function (what, callback) {
+ $.ajax({
+ url: NETDATA.alarms.server + '/api/v1/alarms?' + what.toString(),
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkOptional('/api/v1/alarms', data /*, '.*\.(calc|calc_parsed|warn|warn_parsed|crit|crit_parsed)$' */);
+
+ if (NETDATA.alarms.first_notification_id === 0 && typeof data.latest_alarm_log_unique_id === 'number') {
+ NETDATA.alarms.first_notification_id = data.latest_alarm_log_unique_id;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(415, NETDATA.alarms.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ update_forever: function () {
+ if (netdataShowAlarms !== true || netdataSnapshotData !== null) {
+ return;
+ }
+
+ NETDATA.alarms.get('active', function (data) {
+ if (data !== null) {
+ NETDATA.alarms.current = data;
+
+ if (NETDATA.alarms.check_notifications()) {
+ NETDATA.alarms.notifyAll();
+ }
+
+ if (typeof NETDATA.alarms.callback === 'function') {
+ NETDATA.alarms.callback(data);
+ }
+
+ // Health monitoring is disabled on this netdata
+ if (data.status === false) {
+ return;
+ }
+ }
+
+ setTimeout(NETDATA.alarms.update_forever, NETDATA.alarms.update_every);
+ });
+ },
+
+ get_log: function (last_id, callback) {
+ // console.log('fetching all log after ' + last_id.toString());
+ $.ajax({
+ url: NETDATA.alarms.server + '/api/v1/alarm_log?after=' + last_id.toString(),
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkOptional('/api/v1/alarm_log', data);
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(416, NETDATA.alarms.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ init: function () {
+ NETDATA.alarms.server = NETDATA.fixHost(NETDATA.serverDefault);
+
+ if (typeof netdataAlarmsRemember === 'undefined' || netdataAlarmsRemember) {
+ NETDATA.alarms.last_notification_id =
+ NETDATA.localStorageGet('last_notification_id', NETDATA.alarms.last_notification_id, null);
+ }
+
+ if (NETDATA.alarms.onclick === null) {
+ NETDATA.alarms.onclick = NETDATA.alarms.scrollToAlarm;
+ }
+
+ if (typeof netdataAlarmsRecipients !== 'undefined' && Array.isArray(netdataAlarmsRecipients)) {
+ NETDATA.alarms.recipients = netdataAlarmsRecipients;
+ }
+
+ if (netdataShowAlarms) {
+ NETDATA.alarms.update_forever();
+
+ if ('Notification' in window) {
+ // console.log('notifications available');
+ NETDATA.alarms.notifications = true;
+
+ if (Notification.permission === 'default') {
+ Notification.requestPermission();
+ }
+ }
+ }
+ }
+};
+
+// Registry of netdata hosts
+
+NETDATA.registry = {
+ server: null, // the netdata registry server
+ isCloudEnabled: false,// is netdata.cloud functionality enabled?
+ cloudBaseURL: null, // the netdata cloud base url
+ person_guid: null, // the unique ID of this browser / user
+ machine_guid: null, // the unique ID the netdata server that served dashboard.js
+ hostname: 'unknown', // the hostname of the netdata server that served dashboard.js
+ machines: null, // the user's other URLs
+ machines_array: null, // the user's other URLs in an array
+ person_urls: null,
+ anonymous_statistics_checked: false,
+ MASKED_DATA: "***",
+
+ isUsingGlobalRegistry: function() {
+ return NETDATA.registry.server == "https://registry.my-netdata.io";
+ },
+
+ isRegistryEnabled: function() {
+ return !(NETDATA.registry.isUsingGlobalRegistry() || isSignedIn())
+ },
+
+ parsePersonUrls: function (person_urls) {
+ NETDATA.registry.person_urls = person_urls;
+
+ if (person_urls) {
+ NETDATA.registry.machines = {};
+ NETDATA.registry.machines_array = [];
+
+ let apu = person_urls;
+ let i = apu.length;
+ while (i--) {
+ if (typeof NETDATA.registry.machines[apu[i][0]] === 'undefined') {
+ // console.log('adding: ' + apu[i][4] + ', ' + ((now - apu[i][2]) / 1000).toString());
+
+ let obj = {
+ guid: apu[i][0],
+ url: apu[i][1],
+ last_t: apu[i][2],
+ accesses: apu[i][3],
+ name: apu[i][4],
+ alternate_urls: []
+ };
+ obj.alternate_urls.push(apu[i][1]);
+
+ NETDATA.registry.machines[apu[i][0]] = obj;
+ NETDATA.registry.machines_array.push(obj);
+ } else {
+ // console.log('appending: ' + apu[i][4] + ', ' + ((now - apu[i][2]) / 1000).toString());
+
+ let pu = NETDATA.registry.machines[apu[i][0]];
+ if (pu.last_t < apu[i][2]) {
+ pu.url = apu[i][1];
+ pu.last_t = apu[i][2];
+ pu.name = apu[i][4];
+ }
+ pu.accesses += apu[i][3];
+ pu.alternate_urls.push(apu[i][1]);
+ }
+ }
+ }
+
+ if (typeof netdataRegistryCallback === 'function') {
+ netdataRegistryCallback(NETDATA.registry.machines_array);
+ }
+ },
+
+ init: function () {
+ if (netdataRegistry !== true) {
+ return;
+ }
+
+ NETDATA.registry.hello(NETDATA.serverDefault, function (data) {
+ if (data) {
+ NETDATA.registry.server = data.registry;
+ if (data.cloud_base_url !== "") {
+ NETDATA.registry.isCloudEnabled = true;
+ NETDATA.registry.cloudBaseURL = data.cloud_base_url;
+ } else {
+ NETDATA.registry.isCloudEnabled = false;
+ NETDATA.registry.cloudBaseURL = "";
+ }
+ NETDATA.registry.machine_guid = data.machine_guid;
+ NETDATA.registry.hostname = data.hostname;
+ if (!NETDATA.registry.anonymous_statistics_checked) {
+ NETDATA.registry.anonymous_statistics_checked=true;
+ if (data.anonymous_statistics) {
+ (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+ new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+ j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=false;j.src=
+ 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+ })(window,document,'script','dataLayer','GTM-N6CBMJD');
+ dataLayer.push({"anonymous_statistics" : "true", "machine_guid" : data.machine_guid});
+ }
+ }
+ NETDATA.registry.access(2, function (person_urls) {
+ NETDATA.registry.parsePersonUrls(person_urls);
+ });
+ }
+ });
+ },
+
+ hello: function (host, callback) {
+ host = NETDATA.fixHost(host);
+
+ // send HELLO to a netdata server:
+ // 1. verifies the server is reachable
+ // 2. responds with the registry URL, the machine GUID of this netdata server and its hostname
+ $.ajax({
+ url: host + '/api/v1/registry?action=hello',
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkOptional('/api/v1/registry?action=hello', data);
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(408, host + ' response: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(407, host);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ access: function (max_redirects, callback) {
+ let name = NETDATA.registry.MASKED_DATA;
+ let url = NETDATA.registry.MASKED_DATA;
+
+ if (!NETDATA.registry.isUsingGlobalRegistry()) {
+ // If the user is using a private registry keep sending identifiable
+ // data.
+ name = NETDATA.registry.hostname;
+ url = NETDATA.serverDefault;
+ }
+
+ console.log("ACCESS", name, url);
+
+ // send ACCESS to a netdata registry:
+ // 1. it lets it know we are accessing a netdata server (its machine GUID and its URL)
+ // 2. it responds with a list of netdata servers we know
+ // the registry identifies us using a cookie it sets the first time we access it
+ // the registry may respond with a redirect URL to send us to another registry
+ $.ajax({
+ url: NETDATA.registry.server + '/api/v1/registry?action=access&machine=' + NETDATA.registry.machine_guid + '&name=' + encodeURIComponent(name) + '&url=' + encodeURIComponent(url), // + '&visible_url=' + encodeURIComponent(document.location),
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkAlways('/api/v1/registry?action=access', data);
+
+ let redirect = null;
+ if (typeof data.registry === 'string') {
+ redirect = data.registry;
+ }
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(409, NETDATA.registry.server + ' responded with: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (data === null) {
+ if (redirect !== null && max_redirects > 0) {
+ NETDATA.registry.server = redirect;
+ NETDATA.registry.access(max_redirects - 1, callback);
+ }
+ else {
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ }
+ } else {
+ if (typeof data.person_guid === 'string') {
+ NETDATA.registry.person_guid = data.person_guid;
+ }
+
+ if (typeof callback === 'function') {
+ const urls = data.urls.filter((u) => u[1] !== NETDATA.registry.MASKED_DATA);
+ return callback(urls);
+ }
+ }
+ })
+ .fail(function () {
+ NETDATA.error(410, NETDATA.registry.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ delete: function (delete_url, callback) {
+ // send DELETE to a netdata registry:
+ $.ajax({
+ url: NETDATA.registry.server + '/api/v1/registry?action=delete&machine=' + NETDATA.registry.machine_guid + '&name=' + encodeURIComponent(NETDATA.registry.hostname) + '&url=' + encodeURIComponent(NETDATA.serverDefault) + '&delete_url=' + encodeURIComponent(delete_url),
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkAlways('/api/v1/registry?action=delete', data);
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(411, NETDATA.registry.server + ' responded with: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(412, NETDATA.registry.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ search: function (machine_guid, callback) {
+ // SEARCH for the URLs of a machine:
+ $.ajax({
+ url: NETDATA.registry.server + '/api/v1/registry?action=search&machine=' + NETDATA.registry.machine_guid + '&name=' + encodeURIComponent(NETDATA.registry.hostname) + '&url=' + encodeURIComponent(NETDATA.serverDefault) + '&for=' + machine_guid,
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkAlways('/api/v1/registry?action=search', data);
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(417, NETDATA.registry.server + ' responded with: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(418, NETDATA.registry.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ },
+
+ switch: function (new_person_guid, callback) {
+ // impersonate
+ $.ajax({
+ url: NETDATA.registry.server + '/api/v1/registry?action=switch&machine=' + NETDATA.registry.machine_guid + '&name=' + encodeURIComponent(NETDATA.registry.hostname) + '&url=' + encodeURIComponent(NETDATA.serverDefault) + '&to=' + new_person_guid,
+ async: true,
+ cache: false,
+ headers: {
+ 'Cache-Control': 'no-cache, no-store',
+ 'Pragma': 'no-cache'
+ },
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function (data) {
+ data = NETDATA.xss.checkAlways('/api/v1/registry?action=switch', data);
+
+ if (typeof data.status !== 'string' || data.status !== 'ok') {
+ NETDATA.error(413, NETDATA.registry.server + ' responded with: ' + JSON.stringify(data));
+ data = null;
+ }
+
+ if (typeof callback === 'function') {
+ return callback(data);
+ }
+ })
+ .fail(function () {
+ NETDATA.error(414, NETDATA.registry.server);
+
+ if (typeof callback === 'function') {
+ return callback(null);
+ }
+ });
+ }
+};
+
+// Load required JS libraries and CSS
+
+NETDATA.requiredJs = [
+ {
+ url: NETDATA.serverStatic + 'lib/bootstrap-3.3.7.min.js',
+ async: false,
+ isAlreadyLoaded: function () {
+ // check if bootstrap is loaded
+ if (typeof $().emulateTransitionEnd === 'function') {
+ return true;
+ } else {
+ return typeof netdataNoBootstrap !== 'undefined' && netdataNoBootstrap;
+ }
+ }
+ },
+ {
+ url: NETDATA.serverStatic + 'lib/fontawesome-all-5.0.1.min.js',
+ async: true,
+ isAlreadyLoaded: function () {
+ return typeof netdataNoFontAwesome !== 'undefined' && netdataNoFontAwesome;
+ }
+ },
+ {
+ url: NETDATA.serverStatic + 'lib/perfect-scrollbar-0.6.15.min.js',
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ }
+];
+
+NETDATA.requiredCSS = [
+ {
+ url: NETDATA.themes.current.bootstrap_css,
+ isAlreadyLoaded: function () {
+ return typeof netdataNoBootstrap !== 'undefined' && netdataNoBootstrap;
+ }
+ },
+ {
+ url: NETDATA.themes.current.dashboard_css,
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ }
+];
+
+NETDATA.loadedRequiredJs = 0;
+NETDATA.loadRequiredJs = function (index, callback) {
+ if (index >= NETDATA.requiredJs.length) {
+ if (typeof callback === 'function') {
+ return callback();
+ }
+ return;
+ }
+
+ if (NETDATA.requiredJs[index].isAlreadyLoaded()) {
+ NETDATA.loadedRequiredJs++;
+ NETDATA.loadRequiredJs(++index, callback);
+ return;
+ }
+
+ if (NETDATA.options.debug.main_loop) {
+ console.log('loading ' + NETDATA.requiredJs[index].url);
+ }
+
+ let async = true;
+ if (typeof NETDATA.requiredJs[index].async !== 'undefined' && NETDATA.requiredJs[index].async === false) {
+ async = false;
+ }
+
+ $.ajax({
+ url: NETDATA.requiredJs[index].url,
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .done(function () {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('loaded ' + NETDATA.requiredJs[index].url);
+ }
+ })
+ .fail(function () {
+ alert('Cannot load required JS library: ' + NETDATA.requiredJs[index].url);
+ })
+ .always(function () {
+ NETDATA.loadedRequiredJs++;
+
+ // if (async === false)
+ if (!async) {
+ NETDATA.loadRequiredJs(++index, callback);
+ }
+ });
+
+ // if (async === true)
+ if (async) {
+ NETDATA.loadRequiredJs(++index, callback);
+ }
+};
+
+NETDATA.loadRequiredCSS = function (index) {
+ if (index >= NETDATA.requiredCSS.length) {
+ return;
+ }
+
+ if (NETDATA.requiredCSS[index].isAlreadyLoaded()) {
+ NETDATA.loadRequiredCSS(++index);
+ return;
+ }
+
+ if (NETDATA.options.debug.main_loop) {
+ console.log('loading ' + NETDATA.requiredCSS[index].url);
+ }
+
+ NETDATA._loadCSS(NETDATA.requiredCSS[index].url);
+ NETDATA.loadRequiredCSS(++index);
+};
+
+// Boot it!
+
+if (typeof netdataPrepCallback === 'function') {
+ netdataPrepCallback();
+}
+
+NETDATA.errorReset();
+NETDATA.loadRequiredCSS(0);
+
+NETDATA._loadjQuery(function () {
+ NETDATA.loadRequiredJs(0, function () {
+ if (typeof $().emulateTransitionEnd !== 'function') {
+ // bootstrap is not available
+ NETDATA.options.current.show_help = false;
+ }
+
+ if (typeof netdataDontStart === 'undefined' || !netdataDontStart) {
+ if (NETDATA.options.debug.main_loop) {
+ console.log('starting chart refresh thread');
+ }
+
+ NETDATA.start();
+ }
+ });
+});
+})(window, document, (typeof jQuery === 'function')?jQuery:undefined);
diff --git a/applications/luci-app-netdata/web/dashboard_info.js b/applications/luci-app-netdata/web/dashboard_info.js
new file mode 100755
index 0000000..72bbfa2
--- /dev/null
+++ b/applications/luci-app-netdata/web/dashboard_info.js
@@ -0,0 +1,3844 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// Codacy declarations
+/* global NETDATA */
+
+var netdataDashboard = window.netdataDashboard || {};
+
+// Informational content for the various sections of the GUI (menus, sections, charts, etc.)
+
+// ----------------------------------------------------------------------------
+// Menus
+
+netdataDashboard.menu = {
+ 'system': {
+ title: '系统概观',
+ icon: '<i class="fas fa-bookmark"></i>',
+ info: '一眼掌握系统效能关键指标。'
+ },
+
+ 'services': {
+ title: '系统服务',
+ icon: '<i class="fas fa-cogs"></i>',
+ info: '系统服务的使用情况。netdata 以 CGROUPS 监视所有系统服务。'
+ },
+
+ 'ap': {
+ title: 'Access Points',
+ icon: '<i class="fas fa-wifi"></i>',
+ info: 'Performance metrics for the access points (i.e. wireless interfaces in AP mode) found on the system.'
+ },
+
+ 'tc': {
+ title: 'Quality of Service',
+ icon: '<i class="fas fa-globe"></i>',
+ info: 'Netdata collects and visualizes <code>tc</code> class utilization using its ' +
+ '<a href="https://github.com/netdata/netdata/blob/master/collectors/tc.plugin/tc-qos-helper.sh.in" target="_blank">tc-helper plugin</a>. ' +
+ 'If you also use <a href="http://firehol.org/#fireqos" target="_blank">FireQOS</a> for setting up QoS, ' +
+ 'netdata automatically collects interface and class names. If your QoS configuration includes overheads ' +
+ 'calculation, the values shown here will include these overheads (the total bandwidth for the same ' +
+ 'interface as reported in the Network Interfaces section, will be lower than the total bandwidth ' +
+ 'reported here). QoS data collection may have a slight time difference compared to the interface ' +
+ '(QoS data collection uses a BASH script, so a shift in data collection of a few milliseconds ' +
+ 'should be justified).'
+ },
+
+ 'net': {
+ title: '网络接口',
+ icon: '<i class="fas fa-sitemap"></i>',
+ info: '网路介面的效能指标。'
+ },
+
+ 'wireless': {
+ title: '无线接口',
+ icon: '<i class="fas fa-wifi"></i>',
+ info: '无线接口的性能指标。'
+ },
+
+ 'ip': {
+ title: '网络堆栈',
+ icon: '<i class="fas fa-cloud"></i>',
+ info: function (os) {
+ if(os === "linux")
+ return 'Metrics for the networking stack of the system. These metrics are collected from <code>/proc/net/netstat</code>, apply to both IPv4 and IPv6 traffic and are related to operation of the kernel networking stack.';
+ else
+ return 'Metrics for the networking stack of the system.';
+ }
+ },
+
+ 'ipv4': {
+ title: 'IPv4网路',
+ icon: '<i class="fas fa-cloud"></i>',
+ info: 'IPv4效能指标。' +
+ '<a href="https://en.wikipedia.org/wiki/IPv4" target="_blank">Internet Protocol version 4 (IPv4)</a> is ' +
+ 'the fourth version of the Internet Protocol (IP). It is one of the core protocols of standards-based ' +
+ 'internetworking methods in the Internet. IPv4 is a connectionless protocol for use on packet-switched ' +
+ 'networks. It operates on a best effort delivery model, in that it does not guarantee delivery, nor does ' +
+ 'it assure proper sequencing or avoidance of duplicate delivery. These aspects, including data integrity, ' +
+ 'are addressed by an upper layer transport protocol, such as the Transmission Control Protocol (TCP).'
+ },
+
+ 'ipv6': {
+ title: 'IPv6网路',
+ icon: '<i class="fas fa-cloud"></i>',
+ info: 'IPv6效能指标。 <a href="https://en.wikipedia.org/wiki/IPv6" target="_blank">Internet Protocol version 6 (IPv6)</a> is the most recent version of the Internet Protocol (IP), the communications protocol that provides an identification and location system for computers on networks and routes traffic across the Internet. IPv6 was developed by the Internet Engineering Task Force (IETF) to deal with the long-anticipated problem of IPv4 address exhaustion. IPv6 is intended to replace IPv4.'
+ },
+
+ 'sctp': {
+ title: 'SCTP 网路',
+ icon: '<i class="fas fa-cloud"></i>',
+ info: '<a href="https://en.wikipedia.org/wiki/Stream_Control_Transmission_Protocol" target="_blank">Stream Control Transmission Protocol (SCTP)</a> is a computer network protocol which operates at the transport layer and serves a role similar to the popular protocols TCP and UDP. SCTP provides some of the features of both UDP and TCP: it is message-oriented like UDP and ensures reliable, in-sequence transport of messages with congestion control like TCP. It differs from those protocols by providing multi-homing and redundant paths to increase resilience and reliability.'
+ },
+
+ 'ipvs': {
+ title: 'IP 虚拟服务器',
+ icon: '<i class="fas fa-eye"></i>',
+ info: '<a href="http://www.linuxvirtualserver.org/software/ipvs.html" target="_blank">IPVS (IP Virtual Server)</a> implements transport-layer load balancing inside the Linux kernel, so called Layer-4 switching. IPVS running on a host acts as a load balancer at the front of a cluster of real servers, it can direct requests for TCP/UDP based services to the real servers, and makes services of the real servers to appear as a virtual service on a single IP address.'
+ },
+
+ 'netfilter': {
+ title: '防火墙 (netfilter)',
+ icon: '<i class="fas fa-shield-alt"></i>',
+ info: 'netfilter组件的性能指标。'
+ },
+
+ 'ipfw': {
+ title: '防火墙(ipfw)',
+ icon: '<i class="fas fa-shield-alt"></i>',
+ info: 'ipfw规则的计数器和内存使用情况。'
+ },
+
+ 'cpu': {
+ title: 'CPUs',
+ icon: '<i class="fas fa-bolt"></i>',
+ info: '系统中每一个 CPU 的详细资讯。全部 CPU 的总量可以到 <a href="#menu_system">系统概观</a> 区段查看。'
+ },
+
+ 'mem': {
+ title: '记忆体',
+ icon: '<i class="fas fa-microchip"></i>',
+ info: '系统记忆体管理的详细资讯。'
+ },
+
+ 'disk': {
+ title: '磁碟',
+ icon: '<i class="fas fa-hdd"></i>',
+ info: '系统中所有磁碟效能资讯图表。特别留意：这是以 <code>iostat -x</code> 所取得的效能数据做为呈现。在预设情况下，netdata 不会显示单一分割区与未挂载的虚拟磁碟效能图表。若仍想要显示，可以修改 netdata 设定档中的相关设定。'
+ },
+
+ 'sensors': {
+ title: '感测器',
+ icon: '<i class="fas fa-leaf"></i>',
+ info: '系统已配置相关感测器的读数'
+ },
+
+ 'ipmi': {
+ title: 'IPMI',
+ icon: '<i class="fas fa-leaf"></i>',
+ info: 'The Intelligent Platform Management Interface (IPMI) is a set of computer interface specifications for an autonomous computer subsystem that provides management and monitoring capabilities independently of the host system\'s CPU, firmware (BIOS or UEFI) and operating system.'
+ },
+
+ 'samba': {
+ title: 'Samba',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'Performance metrics of the Samba file share operations of this system. Samba is a implementation of Windows services, including Windows SMB protocol file shares.'
+ },
+
+ 'nfsd': {
+ title: 'NFS服器器',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'Performance metrics of the Network File Server. NFS is a distributed file system protocol, allowing a user on a client computer to access files over a network, much like local storage is accessed. NFS, like many other protocols, builds on the Open Network Computing Remote Procedure Call (ONC RPC) system. The NFS is an open standard defined in Request for Comments (RFC).'
+ },
+
+ 'nfs': {
+ title: 'NFS客户端',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: '显示本机做为 NFS 客户端的效能指标。'
+ },
+
+ 'zfs': {
+ title: 'ZFS文件系统',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'ZFS档案系统的效能指标。以下图表呈现来自 <a href="https://github.com/zfsonlinux/zfs/blob/master/cmd/arcstat/arcstat.py" target="_blank">arcstat.py</a> 与 <a href="https://github.com/zfsonlinux/zfs/blob/master/cmd/arc_summary/arc_summary.py" target="_blank">arc_summary.py</a> 的效能数据。'
+ },
+
+ 'btrfs': {
+ title: 'BTRFS文件系统',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'BTRFS 档案系统磁碟空间使用指标。'
+ },
+
+ 'apps': {
+ title: '应用程序',
+ icon: '<i class="fas fa-heartbeat"></i>',
+ info: 'Per application statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through all processes and aggregates statistics for applications of interest, defined in <code>/etc/netdata/apps_groups.conf</code>, which can be edited by running <code>$ /etc/netdata/edit-config apps_groups.conf</code> (the default is <a href="https://github.com/netdata/netdata/blob/master/collectors/apps.plugin/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: '用户',
+ icon: '<i class="fas fa-user"></i>',
+ info: 'Per user statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through all processes 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: '用户组',
+ icon: '<i class="fas fa-users"></i>',
+ info: 'Per user group statistics are collected using netdata\'s <code>apps.plugin</code>. This plugin walks through all processes 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
+ },
+
+ 'netdata': {
+ title: 'Netdata监视',
+ icon: '<i class="fas fa-chart-bar"></i>',
+ info: 'netdata本身与外挂程式的效能数据。'
+ },
+
+ 'aclk_test': {
+ title: 'ACLK试验发报',
+ info: '用于内部执行集成测试。'
+ },
+
+ 'example': {
+ title: '范例图表',
+ info: '范例图表，展示外挂程式的架构之用。'
+ },
+
+ 'cgroup': {
+ title: '',
+ icon: '<i class="fas fa-th"></i>',
+ info: '容器资源使用率指标。netdata 从 <b>cgroups</b> (<b>control groups</b> 的缩写) 中读取这些资讯，cgroups 是 Linux 核心的一个功能，做限制与计算程序集中的资源使用率 (CPU、记忆体、磁碟 I/O、网路...等等)。<b>cgroups</b> 与 <b>namespaces</b> (程序之间的隔离) 结合提供了我们所说的：<b>容器</b>。'
+ },
+
+ 'cgqemu': {
+ title: '',
+ icon: '<i class="fas fa-th-large"></i>',
+ info: 'QEMU 虚拟机资源使用率效能指标。QEMU (Quick Emulator) 是自由与开源的虚拟机器平台，提供硬体虚拟化功能。'
+ },
+
+ 'fping': {
+ title: 'fping',
+ icon: '<i class="fas fa-exchange-alt"></i>',
+ info: 'Network latency statistics, via <b>fping</b>. <b>fping</b> is a program to send ICMP echo probes to network hosts, similar to <code>ping</code>, but much better performing when pinging multiple hosts. fping versions after 3.15 can be directly used as netdata plugins.'
+ },
+
+ 'gearman': {
+ title: 'Gearman',
+ icon: '<i class="fas fa-tasks"></i>',
+ info: 'Gearman is a job server that allows you to do work in parallel, to load balance processing, and to call functions between languages.'
+ },
+
+ 'ioping': {
+ title: 'ioping',
+ icon: '<i class="fas fa-exchange-alt"></i>',
+ info: 'Disk latency statistics, via <b>ioping</b>. <b>ioping</b> is a program to read/write data probes from/to a disk.'
+ },
+
+ 'httpcheck': {
+ title: 'Http Check',
+ icon: '<i class="fas fa-heartbeat"></i>',
+ info: 'Web Service availability and latency monitoring using HTTP checks. This plugin is a specialized version of the port check plugin.'
+ },
+
+ 'memcached': {
+ title: 'memcached',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>memcached</b>. Memcached is a general-purpose distributed memory caching system. It is often used to speed up dynamic database-driven websites by caching data and objects in RAM to reduce the number of times an external data source (such as a database or API) must be read.'
+ },
+
+ 'monit': {
+ title: 'monit',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Statuses of checks in <b>monit</b>. Monit is a utility for managing and monitoring processes, programs, files, directories and filesystems on a Unix system. Monit conducts automatic maintenance and repair and can execute meaningful causal actions in error situations.'
+ },
+
+ 'mysql': {
+ title: 'MySQL',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>mysql</b>, the open-source relational database management system (RDBMS).'
+ },
+
+ 'postgres': {
+ title: 'Postgres',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>PostgresSQL</b>, the object-relational database (ORDBMS).'
+ },
+
+ 'redis': {
+ title: 'Redis',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>redis</b>. Redis (REmote DIctionary Server) is a software project that implements data structure servers. It is open-source, networked, in-memory, and stores keys with optional durability.'
+ },
+
+ 'rethinkdbs': {
+ title: 'RethinkDB',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b>rethinkdb</b>. RethinkDB is the first open-source scalable database built for realtime applications'
+ },
+
+ 'retroshare': {
+ title: 'RetroShare',
+ icon: '<i class="fas fa-share-alt"></i>',
+ info: 'Performance metrics for <b>RetroShare</b>. RetroShare is open source software for encrypted filesharing, serverless email, instant messaging, online chat, and BBS, based on a friend-to-friend network built on GNU Privacy Guard (GPG).'
+ },
+
+ 'riakkv': {
+ title: 'Riak KV',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Metrics for <b>Riak KV</b>, the distributed key-value store.'
+ },
+
+ 'ipfs': {
+ title: 'IPFS',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'Performance metrics for the InterPlanetary File System (IPFS), a content-addressable, peer-to-peer hypermedia distribution protocol.'
+ },
+
+ 'phpfpm': {
+ title: 'PHP-FPM',
+ icon: '<i class="fas fa-eye"></i>',
+ info: 'Performance metrics for <b>PHP-FPM</b>, an alternative FastCGI implementation for PHP.'
+ },
+
+ 'pihole': {
+ title: 'Pi-hole',
+ icon: '<i class="fas fa-ban"></i>',
+ info: 'Metrics for <a href="https://pi-hole.net/" target="_blank">Pi-hole</a>, a black hole for Internet advertisements.' +
+ ' The metrics returned by Pi-Hole API is all from the last 24 hours.'
+ },
+
+ 'portcheck': {
+ title: 'Port Check',
+ icon: '<i class="fas fa-heartbeat"></i>',
+ info: 'Service availability and latency monitoring using port checks.'
+ },
+
+ 'postfix': {
+ title: 'postfix',
+ icon: '<i class="fas fa-envelope"></i>',
+ info: undefined
+ },
+
+ 'dovecot': {
+ title: 'Dovecot',
+ icon: '<i class="fas fa-envelope"></i>',
+ info: undefined
+ },
+
+ 'hddtemp': {
+ title: 'HDD Temp',
+ icon: '<i class="fas fa-thermometer-half"></i>',
+ info: undefined
+ },
+
+ 'nginx': {
+ title: 'nginx',
+ icon: '<i class="fas fa-eye"></i>',
+ info: undefined
+ },
+
+ 'apache': {
+ title: 'Apache',
+ icon: '<i class="fas fa-eye"></i>',
+ info: undefined
+ },
+
+ 'lighttpd': {
+ title: 'Lighttpd',
+ icon: '<i class="fas fa-eye"></i>',
+ info: undefined
+ },
+
+ 'web_log': {
+ title: undefined,
+ icon: '<i class="fas fa-file-alt"></i>',
+ info: 'Information extracted from a server log file. <code>web_log</code> plugin incrementally parses the server log file to provide, in real-time, a break down of key server performance metrics. For web servers, an extended log file format may optionally be used (for <code>nginx</code> and <code>apache</code>) offering timing information and bandwidth for both requests and responses. <code>web_log</code> plugin may also be configured to provide a break down of requests per URL pattern (check <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/web_log/web_log.conf" target="_blank"><code>/etc/netdata/python.d/web_log.conf</code></a>).'
+ },
+
+ 'named': {
+ title: 'named',
+ icon: '<i class="fas fa-tag"></i>',
+ info: undefined
+ },
+
+ 'squid': {
+ title: 'squid',
+ icon: '<i class="fas fa-exchange-alt"></i>',
+ info: undefined
+ },
+
+ 'nut': {
+ title: 'UPS',
+ icon: '<i class="fas fa-battery-half"></i>',
+ info: undefined
+ },
+
+ 'apcupsd': {
+ title: 'UPS',
+ icon: '<i class="fas fa-battery-half"></i>',
+ info: undefined
+ },
+
+ 'smawebbox': {
+ title: 'Solar Power',
+ icon: '<i class="fas fa-sun"></i>',
+ info: undefined
+ },
+
+ 'fronius': {
+ title: 'Fronius',
+ icon: '<i class="fas fa-sun"></i>',
+ info: undefined
+ },
+
+ 'stiebeleltron': {
+ title: 'Stiebel Eltron',
+ icon: '<i class="fas fa-thermometer-half"></i>',
+ info: undefined
+ },
+
+ 'snmp': {
+ title: 'SNMP',
+ icon: '<i class="fas fa-random"></i>',
+ info: undefined
+ },
+
+ 'go_expvar': {
+ title: 'Go - expvars',
+ icon: '<i class="fas fa-eye"></i>',
+ info: 'Statistics about running Go applications exposed by the <a href="https://golang.org/pkg/expvar/" target="_blank">expvar package</a>.'
+ },
+
+ 'chrony': {
+ icon: '<i class="fas fa-clock"></i>',
+ info: 'chronyd parameters about the system’s clock performance.'
+ },
+
+ 'couchdb': {
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance metrics for <b><a href="https://couchdb.apache.org/">CouchDB</a></b>, the open-source, JSON document-based database with an HTTP API and multi-master replication.'
+ },
+
+ 'beanstalk': {
+ title: 'Beanstalkd',
+ icon: '<i class="fas fa-tasks"></i>',
+ info: 'Provides statistics on the <b><a href="http://kr.github.io/beanstalkd/">beanstalkd</a></b> server and any tubes available on that server using data pulled from beanstalkc'
+ },
+
+ 'rabbitmq': {
+ title: 'RabbitMQ',
+ icon: '<i class="fas fa-comments"></i>',
+ info: 'Performance data for the <b><a href="https://www.rabbitmq.com/">RabbitMQ</a></b> open-source message broker.'
+ },
+
+ 'ceph': {
+ title: 'Ceph',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Provides statistics on the <b><a href="http://ceph.com/">ceph</a></b> cluster server, the open-source distributed storage system.'
+ },
+
+ 'ntpd': {
+ title: 'ntpd',
+ icon: '<i class="fas fa-clock"></i>',
+ info: 'Provides statistics for the internal variables of the Network Time Protocol daemon <b><a href="http://www.ntp.org/">ntpd</a></b> and optional including the configured peers (if enabled in the module configuration). The module presents the performance metrics as shown by <b><a href="http://doc.ntp.org/current-stable/ntpq.html">ntpq</a></b> (the standard NTP query program) using NTP mode 6 UDP packets to communicate with the NTP server.'
+ },
+
+ 'spigotmc': {
+ title: 'Spigot MC',
+ icon: '<i class="fas fa-eye"></i>',
+ info: 'Provides basic performance statistics for the <b><a href="https://www.spigotmc.org/">Spigot Minecraft</a></b> server.'
+ },
+
+ 'unbound': {
+ title: 'Unbound',
+ icon: '<i class="fas fa-tag"></i>',
+ info: undefined
+ },
+
+ 'boinc': {
+ title: 'BOINC',
+ icon: '<i class="fas fa-microchip"></i>',
+ info: 'Provides task counts for <b><a href="http://boinc.berkeley.edu/">BOINC</a></b> distributed computing clients.'
+ },
+
+ 'w1sensor': {
+ title: '1-Wire Sensors',
+ icon: '<i class="fas fa-thermometer-half"></i>',
+ info: 'Data derived from <a href="https://en.wikipedia.org/wiki/1-Wire">1-Wire</a> sensors. Currently temperature sensors are automatically detected.'
+ },
+
+ 'logind': {
+ title: 'Logind',
+ icon: '<i class="fas fa-user"></i>',
+ info: undefined
+ },
+
+ 'powersupply': {
+ title: 'Power Supply',
+ icon: '<i class="fas fa-battery-half"></i>',
+ info: 'Statistics for the various system power supplies. Data collected from <a href="https://www.kernel.org/doc/Documentation/power/power_supply_class.txt">Linux power supply class</a>.'
+ },
+
+ 'xenstat': {
+ title: 'Xen Node',
+ icon: '<i class="fas fa-server"></i>',
+ info: 'General statistics for the Xen node. Data collected using <b>xenstat</b> library</a>.'
+ },
+
+ 'xendomain': {
+ title: '',
+ icon: '<i class="fas fa-th-large"></i>',
+ info: 'Xen domain resource utilization metrics. Netdata reads this information using <b>xenstat</b> library which gives access to the resource usage information (CPU, memory, disk I/O, network) for a virtual machine.'
+ },
+
+ 'wmi': {
+ title: 'wmi',
+ icon: '<i class="fas fa-server"></i>',
+ info: undefined
+ },
+
+ 'perf': {
+ title: 'Perf Counters',
+ icon: '<i class="fas fa-tachometer-alt"></i>',
+ info: 'Performance Monitoring Counters (PMC). Data collected using <b>perf_event_open()</b> system call which utilises Hardware Performance Monitoring Units (PMU).'
+ },
+
+ 'vsphere': {
+ title: 'vSphere',
+ icon: '<i class="fas fa-server"></i>',
+ info: 'Performance statistics for ESXI hosts and virtual machines. Data collected from <a href="https://www.vmware.com/products/vcenter-server.html">VMware vCenter Server</a> using <code><a href="https://github.com/vmware/govmomi"> govmomi</a></code> library.'
+ },
+
+ 'vcsa': {
+ title: 'VCSA',
+ icon: '<i class="fas fa-server"></i>',
+ info: 'vCenter Server Appliance health statistics. Data collected from <a href="https://vmware.github.io/vsphere-automation-sdk-rest/vsphere/index.html#SVC_com.vmware.appliance.health">Health API</a>.'
+ },
+
+ 'zookeeper': {
+ title: 'Zookeeper',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Provides health statistics for <b><a href="https://zookeeper.apache.org/">Zookeeper</a></b> server. Data collected through the command port using <code><a href="https://zookeeper.apache.org/doc/r3.5.5/zookeeperAdmin.html#sc_zkCommands">mntr</a></code> command.'
+ },
+
+ 'hdfs': {
+ title: 'HDFS',
+ icon: '<i class="fas fa-folder-open"></i>',
+ info: 'Provides <b><a href="https://hadoop.apache.org/docs/r3.2.0/hadoop-project-dist/hadoop-hdfs/HdfsDesign.html">Hadoop Distributed File System</a></b> performance statistics. Module collects metrics over <code>Java Management Extensions</code> through the web interface of an <code>HDFS</code> daemon.'
+ },
+
+ 'am2320': {
+ title: 'AM2320 Sensor',
+ icon: '<i class="fas fa-thermometer-half"></i>',
+ info: 'Readings from the external AM2320 Sensor.'
+ },
+
+ 'scaleio': {
+ title: 'ScaleIO',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance and health statistics for various ScaleIO components. Data collected via VxFlex OS Gateway REST API.'
+ },
+
+ 'squidlog': {
+ title: 'Squid log',
+ icon: '<i class="fas fa-file-alt"></i>',
+ info: undefined
+ },
+
+ 'cockroachdb': {
+ title: 'CockroachDB',
+ icon: '<i class="fas fa-database"></i>',
+ info: 'Performance and health statistics for various <code>CockroachDB</code> components.'
+ },
+
+ 'ebpf': {
+ title: 'eBPF',
+ icon: '<i class="fas fa-heartbeat"></i>',
+ info: 'Monitor system calls, internal functions, bytes read, bytes written and errors using <code>eBPF</code>.'
+ },
+
+ 'vernemq': {
+ title: 'VerneMQ',
+ icon: '<i class="fas fa-comments"></i>',
+ info: 'Performance data for the <b><a href="https://vernemq.com/">VerneMQ</a></b> open-source MQTT broker.'
+ },
+
+ 'pulsar': {
+ title: 'Pulsar',
+ icon: '<i class="fas fa-comments"></i>',
+ info: 'Summary, namespaces and topics performance data for the <b><a href="http://pulsar.apache.org/">Apache Pulsar</a></b> pub-sub messaging system.'
+ },
+
+ 'anomalies': {
+ title: 'Anomalies',
+ icon: '<i class="fas fa-flask"></i>',
+ info: 'Anomaly scores relating to key system metrics. A high anomaly probability indicates strange behaviour and may trigger an anomaly prediction from the trained models. Read the <a href="https://github.com/netdata/netdata/tree/master/collectors/python.d.plugin/anomalies" target="_blank">anomalies collector docs</a> for more details.'
+ },
+
+ 'alarms': {
+ title: 'Alarms',
+ icon: '<i class="fas fa-bell"></i>',
+ info: 'Charts showing alarm status over time. More details <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/alarms/README.md" target="_blank">here</a>.'
+ },
+
+ 'statsd': {
+ title: 'StatsD',
+ icon: '<i class="fas fa-chart-line"></i>',
+ info:'StatsD is an industry-standard technology stack for monitoring applications and instrumenting any piece of software to deliver custom metrics. Netdata allows the user to organize the metrics in different charts and visualize any application metric easily. Read more on <a href="https://learn.netdata.cloud/docs/agent/collectors/statsd.plugin">Netdata Learn</a>.'
+ },
+
+ 'supervisord': {
+ title: 'Supervisord',
+ icon: '<i class="fas fa-tasks"></i>',
+ info: 'Detailed statistics for each group of processes controlled by <b><a href="http://supervisord.org/">Supervisor</a></b>. ' +
+ 'Netdata collects these metrics using <a href="http://supervisord.org/api.html#supervisor.rpcinterface.SupervisorNamespaceRPCInterface.getAllProcessInfo" target="_blank"><code>getAllProcessInfo</code></a> method.'
+ },
+};
+
+
+// ----------------------------------------------------------------------------
+// submenus
+
+// information to be shown, just below each submenu
+
+// information about the submenus
+netdataDashboard.submenu = {
+ 'web_log.squid_bandwidth': {
+ title: '频宽',
+ info: 'Bandwidth of responses (<code>sent</code>) by squid. This chart may present unusual spikes, since the bandwidth is accounted at the time the log line is saved by the server, even if the time needed to serve it spans across a longer duration. We suggest to use QoS (e.g. <a href="http://firehol.org/#fireqos" target="_blank">FireQOS</a>) for accurate accounting of the server bandwidth.'
+ },
+
+ 'web_log.squid_responses': {
+ title: '回应',
+ info: 'Information related to the responses sent by squid.'
+ },
+
+ 'web_log.squid_requests': {
+ title: '请求',
+ info: 'Information related to the requests squid has received.'
+ },
+
+ 'web_log.squid_hierarchy': {
+ title: '等级制度',
+ info: 'Performance metrics for the squid hierarchy used to serve the requests.'
+ },
+
+ 'web_log.squid_squid_transport': {
+ title: '运输'
+ },
+
+ 'web_log.squid_squid_cache': {
+ title: '缓存',
+ info: 'squid缓存性能的性能指标.'
+ },
+
+ 'web_log.squid_timings': {
+ title: 'timings',
+ info: 'Duration of squid requests. Unrealistic spikes may be reported, since squid logs the total time of the requests, when they complete. Especially for HTTPS, the clients get a tunnel from the proxy and exchange requests directly with the upstream servers, so squid cannot evaluate the individual requests and reports the total time the tunnel was open.'
+ },
+
+ 'web_log.squid_clients': {
+ title: 'clients'
+ },
+
+ 'web_log.bandwidth': {
+ info: 'Bandwidth of requests (<code>received</code>) and responses (<code>sent</code>). <code>received</code> requires an extended log format (without it, the web server log does not have this information). This chart may present unusual spikes, since the bandwidth is accounted at the time the log line is saved by the web server, even if the time needed to serve it spans across a longer duration. We suggest to use QoS (e.g. <a href="http://firehol.org/#fireqos" target="_blank">FireQOS</a>) for accurate accounting of the web server bandwidth.'
+ },
+
+ 'web_log.urls': {
+ info: 'Number of requests for each <code>URL pattern</code> defined in <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/web_log/web_log.conf" target="_blank"><code>/etc/netdata/python.d/web_log.conf</code></a>. This chart counts all requests matching the URL patterns defined, independently of the web server response codes (i.e. both successful and unsuccessful).'
+ },
+
+ 'web_log.clients': {
+ info: 'Charts showing the number of unique client IPs, accessing the web server.'
+ },
+
+ 'web_log.timings': {
+ info: 'Web server response timings - the time the web server needed to prepare and respond to requests. This requires an extended log format and its meaning is web server specific. For most web servers this accounts the time from the reception of a complete request, to the dispatch of the last byte of the response. So, it includes the network delays of responses, but it does not include the network delays of requests.'
+ },
+
+ 'mem.ksm': {
+ title: 'deduper (ksm)',
+ info: 'Kernel Same-page Merging (KSM) 效能监视，经由读取 <code>/sys/kernel/mm/ksm/</code> 下的档案而来。KSM 是在 Linux 核心 (自 2.6.32 版起) 内含的一种节省记忆体使用率重复资料删除功能。)。 KSM 服务程序 ksmd 会定期扫描记忆体区域，寻找正有资料要更新进来且相同资料存在的分页。KSM 最初是从 KVM 专案开发中而来，利用这种共用相同资料的机制，即可以让更多的虚拟机器放到记忆体中。另外，对许多会产生同样内容的应用程序来说，这个功能是相当有效益的。'
+ },
+
+ 'mem.hugepages': {
+ info: 'Hugepages is a feature that allows the kernel to utilize the multiple page size capabilities of modern hardware architectures. The kernel creates multiple pages of virtual memory, mapped from both physical RAM and swap. There is a mechanism in the CPU architecture called "Translation Lookaside Buffers" (TLB) to manage the mapping of virtual memory pages to actual physical memory addresses. The TLB is a limited hardware resource, so utilizing a large amount of physical memory with the default page size consumes the TLB and adds processing overhead. By utilizing Huge Pages, the kernel is able to create pages of much larger sizes, each page consuming a single resource in the TLB. Huge Pages are pinned to physical RAM and cannot be swapped/paged out.'
+ },
+
+ 'mem.numa': {
+ info: 'Non-Uniform Memory Access (NUMA) 是一种记忆体存取分隔设计，在 NUMA 之下，一个处理器存取自己管理的的记忆体，将比非自己管理的记忆体 (另一个处理器所管理的记忆体或是共用记忆体) 具有更快速的效能。在 <a href="https://www.kernel.org/doc/Documentation/numastat.txt" target="_blank">Linux 核心文件</a> 中有详细说明这些指标。'
+ },
+
+ 'ip.ecn': {
+ info: '<a href="https://en.wikipedia.org/wiki/Explicit_Congestion_Notification" target="_blank">Explicit Congestion Notification (ECN)</a> is a TCP extension that allows end-to-end notification of network congestion without dropping packets. ECN is an optional feature that may be used between two ECN-enabled endpoints when the underlying network infrastructure also supports it.'
+ },
+
+ 'netfilter.conntrack': {
+ title: 'connection tracker',
+ info: 'Netfilter connection tracker 效能指标。Connection tracker 会追踪这台主机上所有的连接，包括流入与流出。工作原理是将所有开启的连接都储存到资料库，以追踪网路、位址转换与连接目标。'
+ },
+
+ 'netfilter.nfacct': {
+ title: 'bandwidth accounting',
+ info: 'The following information is read using the <code>nfacct.plugin</code>.'
+ },
+
+ 'netfilter.synproxy': {
+ title: 'DDoS protection',
+ info: 'DDoS protection performance metrics. <a href="https://github.com/firehol/firehol/wiki/Working-with-SYNPROXY" target="_blank">SYNPROXY</a> is a TCP SYN packets proxy. It is used to protect any TCP server (like a web server) from SYN floods and similar DDoS attacks. It is a netfilter module, in the Linux kernel (since version 3.12). It is optimized to handle millions of packets per second utilizing all CPUs available without any concurrency locking between the connections. It can be used for any kind of TCP traffic (even encrypted), since it does not interfere with the content itself.'
+ },
+
+ 'ipfw.dynamic_rules': {
+ title: 'dynamic rules',
+ info: 'Number of dynamic rules, created by correspondent stateful firewall rules.'
+ },
+
+ 'system.softnet_stat': {
+ title: 'softnet',
+ info: function (os) {
+ if (os === 'linux')
+ return 'Statistics for CPUs SoftIRQs related to network receive work. Break down per CPU core can be found at <a href="#menu_cpu_submenu_softnet_stat">CPU / softnet statistics</a>. <b>processed</b> states the number of packets processed, <b>dropped</b> is the number packets dropped because the network device backlog was full (to fix them on Linux use <code>sysctl</code> to increase <code>net.core.netdev_max_backlog</code>), <b>squeezed</b> is the number of packets dropped because the network device budget ran out (to fix them on Linux use <code>sysctl</code> to increase <code>net.core.netdev_budget</code> and/or <code>net.core.netdev_budget_usecs</code>). More information about identifying and troubleshooting network driver related issues can be found at <a href="https://access.redhat.com/sites/default/files/attachments/20150325_network_performance_tuning.pdf" target="_blank">Red Hat Enterprise Linux Network Performance Tuning Guide</a>.';
+ else
+ return 'Statistics for CPUs SoftIRQs related to network receive work.';
+ }
+ },
+
+ 'cpu.softnet_stat': {
+ title: 'softnet',
+ info: function (os) {
+ if (os === 'linux')
+ return 'Statistics for per CPUs core SoftIRQs related to network receive work. Total for all CPU cores can be found at <a href="#menu_system_submenu_softnet_stat">System / softnet statistics</a>. <b>processed</b> states the number of packets processed, <b>dropped</b> is the number packets dropped because the network device backlog was full (to fix them on Linux use <code>sysctl</code> to increase <code>net.core.netdev_max_backlog</code>), <b>squeezed</b> is the number of packets dropped because the network device budget ran out (to fix them on Linux use <code>sysctl</code> to increase <code>net.core.netdev_budget</code> and/or <code>net.core.netdev_budget_usecs</code>). More information about identifying and troubleshooting network driver related issues can be found at <a href="https://access.redhat.com/sites/default/files/attachments/20150325_network_performance_tuning.pdf" target="_blank">Red Hat Enterprise Linux Network Performance Tuning Guide</a>.';
+ else
+ return 'Statistics for per CPUs core SoftIRQs related to network receive work. Total for all CPU cores can be found at <a href="#menu_system_submenu_softnet_stat">System / softnet statistics</a>.';
+ }
+ },
+
+ 'go_expvar.memstats': {
+ title: 'memory statistics',
+ info: 'Go runtime memory statistics. See <a href="https://golang.org/pkg/runtime/#MemStats" target="_blank">runtime.MemStats</a> documentation for more info about each chart and the values.'
+ },
+
+ 'couchdb.dbactivity': {
+ title: 'db activity',
+ info: 'Overall database reads and writes for the entire server. This includes any external HTTP traffic, as well as internal replication traffic performed in a cluster to ensure node consistency.'
+ },
+
+ 'couchdb.httptraffic': {
+ title: 'http traffic breakdown',
+ info: 'All HTTP traffic, broken down by type of request (<tt>GET</tt>, <tt>PUT</tt>, <tt>POST</tt>, etc.) and response status code (<tt>200</tt>, <tt>201</tt>, <tt>4xx</tt>, etc.)<br/><br/>Any <tt>5xx</tt> errors here indicate a likely CouchDB bug; check the logfile for further information.'
+ },
+
+ 'couchdb.ops': {
+ title: 'server operations'
+ },
+
+ 'couchdb.perdbstats': {
+ title: 'per db statistics',
+ info: 'Statistics per database. This includes <a href="http://docs.couchdb.org/en/latest/api/database/common.html#get--db">3 size graphs per database</a>: active (the size of live data in the database), external (the uncompressed size of the database contents), and file (the size of the file on disk, exclusive of any views and indexes). It also includes the number of documents and number of deleted documents per database.'
+ },
+
+ 'couchdb.erlang': {
+ title: 'erlang statistics',
+ info: 'Detailed information about the status of the Erlang VM that hosts CouchDB. These are intended for advanced users only. High values of the peak message queue (>10e6) generally indicate an overload condition.'
+ },
+
+ 'ntpd.system': {
+ title: 'system',
+ info: 'Statistics of the system variables as shown by the readlist billboard <code>ntpq -c rl</code>. System variables are assigned an association ID of zero and can also be shown in the readvar billboard <code>ntpq -c "rv 0"</code>. These variables are used in the <a href="http://doc.ntp.org/current-stable/discipline.html">Clock Discipline Algorithm</a>, to calculate the lowest and most stable offset.'
+ },
+
+ 'ntpd.peers': {
+ title: 'peers',
+ info: 'Statistics of the peer variables for each peer configured in <code>/etc/ntp.conf</code> as shown by the readvar billboard <code>ntpq -c "rv <association>"</code>, while each peer is assigned a nonzero association ID as shown by <code>ntpq -c "apeers"</code>. The module periodically scans for new/changed peers (default: every 60s). <b>ntpd</b> selects the best possible peer from the available peers to synchronize the clock. A minimum of at least 3 peers is required to properly identify the best possible peer.'
+ }
+};
+
+
+// ----------------------------------------------------------------------------
+// chart
+
+// information works on the context of a chart
+// Its purpose is to set:
+//
+// info: the text above the charts
+// heads: the representation of the chart at the top the subsection (second level menu)
+// mainheads: the representation of the chart at the top of the section (first level menu)
+// colors: the dimension colors of the chart (the default colors are appended)
+// height: the ratio of the chart height relative to the default
+//
+
+var cgroupCPULimitIsSet = 0;
+var cgroupMemLimitIsSet = 0;
+
+netdataDashboard.context = {
+ 'system.cpu': {
+ info: function (os) {
+ void(os);
+ return 'CPU 使用率总表 (全部核心)。 当数值为 100% 时，表示您的 CPU 非常忙碌没有闲置空间。您可以在 <a href="#menu_cpu">CPU</a> 区段及以及 <a href="#menu_apps">应用程序</a> 区段深入了解每个核心与应用程序的使用情况。'
+ + netdataDashboard.sparkline('<br/>请特别关注 <b>iowait</b> ', 'system.cpu', 'iowait', '%', '，如果它一直处于较高的情况，这表示您的磁碟是效能瓶颈，您的系统效能会明显降低。')
+ + netdataDashboard.sparkline('<br/>另一个重要的指标是 <b>softirq</b> ', 'system.cpu', 'softirq', '%', '，若这个数值持续在较高的情况，很有可能是您的网路驱动部份有问题。');
+ },
+ valueRange: "[0, 100]"
+ },
+
+ 'system.load': {
+ info: '目前系统负载，也就是指 CPU 使用情况或正在等待系统资源 (通常是 CPU 与磁碟)。这三个指标分别是 1、5、15 分钟。系统每 5 秒会计算一次。更多的资讯可以参阅 <a href="https://en.wikipedia.org/wiki/Load_(computing)" target="_blank">维基百科</a> 说明。',
+ height: 0.7
+ },
+
+ 'system.cpu_pressure': {
+ info: '<a href="https://www.kernel.org/doc/html/latest/accounting/psi.html">Pressure Stall Information</a> ' +
+ 'identifies and quantifies the disruptions caused by resource contentions. ' +
+ 'The "some" line indicates the share of time in which at least <b>some</b> tasks are stalled on CPU. ' +
+ 'The ratios (in %) are tracked as recent trends over 10-, 60-, and 300-second windows.'
+ },
+
+ 'system.memory_some_pressure': {
+ info: '<a href="https://www.kernel.org/doc/html/latest/accounting/psi.html">Pressure Stall Information</a> ' +
+ 'identifies and quantifies the disruptions caused by resource contentions. ' +
+ 'The "some" line indicates the share of time in which at least <b>some</b> tasks are stalled on memory. ' +
+ 'The "full" line indicates the share of time in which <b>all non-idle</b> tasks are stalled on memory simultaneously. ' +
+ 'In this state actual CPU cycles are going to waste, and a workload that spends extended time in this state is considered to be thrashing. ' +
+ 'The ratios (in %) are tracked as recent trends over 10-, 60-, and 300-second windows.'
+ },
+
+ 'system.io_some_pressure': {
+ info: '<a href="https://www.kernel.org/doc/html/latest/accounting/psi.html">Pressure Stall Information</a> ' +
+ 'identifies and quantifies the disruptions caused by resource contentions. ' +
+ 'The "some" line indicates the share of time in which at least <b>some</b> tasks are stalled on I/O. ' +
+ 'The "full" line indicates the share of time in which <b>all non-idle</b> tasks are stalled on I/O simultaneously. ' +
+ 'In this state actual CPU cycles are going to waste, and a workload that spends extended time in this state is considered to be thrashing. ' +
+ 'The ratios (in %) are tracked as recent trends over 10-, 60-, and 300-second windows.'
+ },
+
+ 'system.io': {
+ info: function (os) {
+ var s = '磁碟 I/O 总计, 包含所有的实体磁碟。您可以在 <a href="#menu_disk">磁碟</a> 区段查看每一个磁碟的详细资讯，也可以在 <a href="#menu_apps">应用程序</a> 区段了解每一支应用程序对于磁碟的使用情况。';
+
+ if (os === 'linux')
+ return s + ' 实体磁碟指的是 <code>/sys/block</code> 中有列出，但是没有在 <code>/sys/devices/virtual/block</code> 的所有磁碟。';
+ else
+ return s;
+ }
+ },
+
+ 'system.pgpgio': {
+ info: '从记忆体分页到磁碟的 I/O。通常是这个系统所有磁碟的总 I/O。'
+ },
+
+ 'system.swapio': {
+ info: '所有的 Swap I/O. (netdata 会合并显示 <code>输入</code> 与 <code>输出</code>。如果图表中没有任何数值，则表示为 0。 - 您可以修改这一页的设定，让图表显示固定的维度。'
+ },
+
+ 'system.pgfaults': {
+ info: '所有的 Page 错误. <b>Major page faults</b> indicates that the system is using its swap. You can find which applications use the swap at the <a href="#menu_apps">Applications Monitoring</a> section.'
+ },
+
+ 'system.entropy': {
+ colors: '#CC22AA',
+ info: '<a href="https://en.wikipedia.org/wiki/Entropy_(computing)" target="_blank">熵 (Entropy)</a>，主要是用在密码学的乱数集区 (<a href="https://en.wikipedia.org/wiki//dev/random" target="_blank">/dev/random</a>)。如果熵的集区为空，需要乱数的程序可能会导致执行变慢 (这取决于每个程序使用的介面)，等待集区补充。在理想情况下，有高度熵需求的系统应该要具备专用的硬体装置 (例如 TPM 装置)。您也可以安装纯软体的方案，例如 <code>haveged</code>，通常这些方案只会使用在伺服器上。'
+ },
+
+ 'system.forks': {
+ colors: '#5555DD',
+ info: '建立新程序的数量。'
+ },
+
+ 'system.intr': {
+ colors: '#DD5555',
+ info: 'CPU 中断的总数。透过检查 <code>system.interrupts</code>，得知每一个中断的细节资讯。在 <a href="#menu_cpu">CPU</a> 区段提供每一个 CPU 核心的中断情形。'
+ },
+
+ 'system.interrupts': {
+ info: 'CPU 中断的细节。在 <a href="#menu_cpu">CPU</a> 区段中，依据每个 CPU 核心分析中断。'
+ },
+
+ 'system.softirqs': {
+ info: 'CPU softirqs 的细节。在 <a href="#menu_cpu">CPU</a> 区段中，依据每个 CPU 核心分析 softirqs。'
+ },
+
+ 'system.processes': {
+ info: '系统程序。<b>running</b> 显示正在 CPU 中的程序。<b>Blocked</b> 显示目前被挡下无法进入 CPU 执行的程序，例如：正在等待磁碟完成动作，才能继续。'
+ },
+
+ 'system.active_processes': {
+ info: '所有的系统程序。'
+ },
+
+ 'system.ctxt': {
+ info: '<a href="https://en.wikipedia.org/wiki/Context_switch" target="_blank">Context Switches</a>，指 CPU 从一个程序、工作或是执行绪切换到另一个程序、工作或是执行绪。如果有许多程序或执行绪需要执行，但可以使用的 CPU 核心很少，即表示系统将会进行更多的 context switching 用来平衡它们所使用的 CPU 资源。这个过程需要大量的运算，因此 context switches 越多，整个系统就会越慢。'
+ },
+
+ 'system.idlejitter': {
+ info: 'Idle jitter 是由 netdata 计算而得。当一个执行绪要求睡眠 (Sleep) 时，需要几个微秒的时间。当系统要唤醒它时，会量测它用了多少个微秒的时间。要求睡眠与实际睡眠时间的差异就是 <b>idle jitter</b>。这个数字在即时的环境中非常有用，因为 CPU jitter 将会影响服务的品质 (例如 VoIP media gateways)。'
+ },
+
+ 'system.net': {
+ info: function (os) {
+ var s = '所有实体网路介面的总频宽。不包含 <code>lo</code>、VPN、网路桥接、IFB 装置、介面聚合 (Bond).. 等。将合并显示实体网路介面的频宽使用情况。';
+
+ if (os === 'linux')
+ return s + ' 实体网路介面是指在 <code>/proc/net/dev</code> 有列出，但不在 <code>/sys/devices/virtual/net</code> 里。';
+ else
+ return s;
+ }
+ },
+
+ 'system.ip': {
+ info: 'IP 总流量。'
+ },
+
+ 'system.ipv4': {
+ info: 'IPv4 总流量。'
+ },
+
+ 'system.ipv6': {
+ info: 'IPv6 总流量。'
+ },
+
+ 'system.ram': {
+ info: '系统随机存取记忆体 (也就是实体记忆体) 使用情况。'
+ },
+
+ 'system.swap': {
+ info: '系统交换空间 (Swap) 记忆体使用情况。Swap 空间会在实体记忆体 (RAM) 已满的情况下使用。当系统记忆体已满但还需要使用更多记忆体情况下，系统记忆体中的比较没有异动的 Page 将会被移动到 Swap 空间 (通常是磁碟、磁碟分割区或是档案)。'
+ },
+
+ // ------------------------------------------------------------------------
+ // CPU charts
+
+ 'cpu.cpu': {
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, 100]"
+ },
+
+ 'cpu.interrupts': {
+ commonMin: true,
+ commonMax: true
+ },
+
+ 'cpu.softirqs': {
+ commonMin: true,
+ commonMax: true
+ },
+
+ 'cpu.softnet_stat': {
+ commonMin: true,
+ commonMax: true
+ },
+
+ // ------------------------------------------------------------------------
+ // MEMORY
+
+ 'mem.ksm_savings': {
+ heads: [
+ netdataDashboard.gaugeChart('Saved', '12%', 'savings', '#0099CC')
+ ]
+ },
+
+ 'mem.ksm_ratios': {
+ heads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Savings"'
+ + ' data-units="percentage %"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'mem.zram_usage': {
+ info: 'ZRAM total RAM usage metrics. ZRAM uses some memory to store metadata about stored memory pages, thus introducing an overhead which is proportional to disk size. It excludes same-element-filled-pages since no memory is allocated for them.'
+ },
+
+ 'mem.zram_savings': {
+ info: 'Displays original and compressed memory data sizes.'
+ },
+
+ 'mem.zram_ratio': {
+ heads: [
+ netdataDashboard.gaugeChart('Compression Ratio', '12%', 'ratio', '#0099CC')
+ ],
+ info: 'Compression ratio, calculated as <code>100 * original_size / compressed_size</code>. More means better compression and more RAM savings.'
+ },
+
+ 'mem.zram_efficiency': {
+ heads: [
+ netdataDashboard.gaugeChart('Efficiency', '12%', 'percent', NETDATA.colors[0])
+ ],
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, 100]",
+ info: 'Memory usage efficiency, calculated as <code>100 * compressed_size / total_mem_used</code>.'
+ },
+
+
+ 'mem.pgfaults': {
+ info: 'A <a href="https://en.wikipedia.org/wiki/Page_fault" target="_blank">page fault</a> is a type of interrupt, called trap, raised by computer hardware when a running program accesses a memory page that is mapped into the virtual address space, but not actually loaded into main memory. If the page is loaded in memory at the time the fault is generated, but is not marked in the memory management unit as being loaded in memory, then it is called a <b>minor</b> or soft page fault. A <b>major</b> page fault is generated when the system needs to load the memory page from disk or swap memory.'
+ },
+
+ 'mem.committed': {
+ colors: NETDATA.colors[3],
+ info: 'Committed 记忆体，是指程序分配到的所有记忆体总计。'
+ },
+
+ 'mem.available': {
+ info: '可用记忆体是由核心估算而来，也就是使用者空间程序可以使用的 RAM 总量，而不会造成交换 (Swap) 发生。'
+ },
+
+ 'mem.writeback': {
+ info: '<b>Dirty</b> 是等待写入磁碟的记忆体量。<b>Writeback</b> 是指有多少记忆体内容被主动写入磁碟。'
+ },
+
+ 'mem.kernel': {
+ info: 'The total amount of memory being used by the kernel. <b>Slab</b> is the amount of memory used by the kernel to cache data structures for its own use. <b>KernelStack</b> is the amount of memory allocated for each task done by the kernel. <b>PageTables</b> is the amount of memory decicated to the lowest level of page tables (A page table is used to turn a virtual address into a physical memory address). <b>VmallocUsed</b> is the amount of memory being used as virtual address space.'
+ },
+
+ 'mem.slab': {
+ info: '<b>Reclaimable</b> is the amount of memory which the kernel can reuse. <b>Unreclaimable</b> can not be reused even when the kernel is lacking memory.'
+ },
+
+ 'mem.hugepages': {
+ info: 'Dedicated (or Direct) HugePages is memory reserved for applications configured to utilize huge pages. Hugepages are <b>used</b> memory, even if there are free hugepages available.'
+ },
+
+ 'mem.transparent_hugepages': {
+ info: 'Transparent HugePages (THP) is backing virtual memory with huge pages, supporting automatic promotion and demotion of page sizes. It works for all applications for anonymous memory mappings and tmpfs/shmem.'
+ },
+
+ 'mem.cachestat_ratio': {
+ info: 'When the processor needs to read or write a location in main memory, it checks for a corresponding entry in the page cache. If the entry is there, a page cache hit has occurred and the read is from the cache. If the entry is not there, a page cache miss has occurred and the kernel allocates a new entry and copies in data from the disk. Netdata calculates the percentage of accessed files that are cached on memory. <a href="https://github.com/iovisor/bcc/blob/master/tools/cachestat.py#L126-L138" target="_blank">The ratio</a> is calculated counting the accessed cached pages (without counting dirty pages and pages added because of read misses) divided by total access without dirty pages. The algorithm will not plot data when ratio is zero and our dashboard will interpolate the plot. '
+ },
+
+ 'mem.cachestat_dirties': {
+ info: 'Number of <a href="https://en.wikipedia.org/wiki/Page_cache#Memory_conservation" target="_blank">dirty(modified) pages</a> cache. Pages in the page cache modified after being brought in are called dirty pages. Since non-dirty pages in the page cache have identical copies in <a href="https://en.wikipedia.org/wiki/Secondary_storage" target="_blank">secondary storage</a> (e.g. hard disk drive or solid-state drive), discarding and reusing their space is much quicker than paging out application memory, and is often preferred over flushing the dirty pages into secondary storage and reusing their space.'
+ },
+
+ 'mem.cachestat_hits': {
+ info: 'When the processor needs to read or write a location in main memory, it checks for a corresponding entry in the page cache. If the entry is there, a page cache hit has occurred and the read is from the cache. Hits show pages accessed that were not modified (we are excluding dirty pages), this counting also excludes the recent pages inserted for read.'
+ },
+
+ 'mem.cachestat_misses': {
+ info: 'When the processor needs to read or write a location in main memory, it checks for a corresponding entry in the page cache. If the entry is not there, a page cache miss has occurred and the cache allocates a new entry and copies in data for the main memory. Misses count page insertions to the memory not related to writing.'
+ },
+
+ 'mem.sync': {
+ info: 'System calls for <a href="https://man7.org/linux/man-pages/man2/sync.2.html" target="_blank">sync() and syncfs()</a> which flush the file system buffers to storage devices. Performance perturbations might be caused by these calls. The <code>sync()</code> calls are based on the eBPF <a href="https://github.com/iovisor/bcc/blob/master/tools/syncsnoop.py" target="_blank">syncsnoop</a> from BCC tools.'
+ },
+
+ 'mem.file_sync': {
+ info: 'System calls for <a href="https://man7.org/linux/man-pages/man2/fsync.2.html" target="_blank">fsync() and fdatasync()</a> transfer all modified page caches for the files on disk devices. These calls block until the device reports that the transfer has been completed.'
+ },
+
+ 'mem.memory_map': {
+ info: 'System calls for <a href="https://man7.org/linux/man-pages/man2/msync.2.html" target="_blank">msync()</a> which flushes changes made to the in-core copy of a file that was mapped.'
+ },
+
+ 'mem.file_segment': {
+ info: 'System calls for <a href="https://man7.org/linux/man-pages/man2/sync_file_range.2.html" target="_blank">sync_file_range()</a> permits fine control when synchronizing the open file referred to by the file descriptor fd with disk. This system call is extremely dangerous and should not be used in portable programs.'
+ },
+
+ // ------------------------------------------------------------------------
+ // network interfaces
+
+ 'net.drops': {
+ info: 'Packets that have been dropped at the network interface level. These are the same counters reported by <code>ifconfig</code> as <code>RX dropped</code> (inbound) and <code>TX dropped</code> (outbound). <b>inbound</b> packets can be dropped at the network interface level due to <a href="#menu_system_submenu_softnet_stat">softnet backlog</a> overflow, bad / unintented VLAN tags, unknown or unregistered protocols, IPv6 frames when the server is not configured for IPv6. Check <a href="https://www.novell.com/support/kb/doc.php?id=7007165" target="_blank">this document</a> for more information.'
+ },
+
+ 'net.duplex': {
+ info: 'State map: 0 - unknown, 1 - half duplex, 2 - full duplex'
+ },
+
+ 'net.operstate': {
+ info: 'State map: 0 - unknown, 1 - notpresent, 2 - down, 3 - lowerlayerdown, 4 - testing, 5 - dormant, 6 - up'
+ },
+
+ 'net.carrier': {
+ info: 'State map: 0 - down, 1 - up'
+ },
+
+ // ------------------------------------------------------------------------
+ // IP
+
+ 'ip.inerrors': {
+ info: 'Errors encountered during the reception of IP packets. ' +
+ '<code>noroutes</code> (<code>InNoRoutes</code>) counts packets that were dropped because there was no route to send them. ' +
+ '<code>truncated</code> (<code>InTruncatedPkts</code>) counts packets which is being discarded because the datagram frame didn\'t carry enough data. ' +
+ '<code>checksum</code> (<code>InCsumErrors</code>) counts packets that were dropped because they had wrong checksum. '
+ },
+
+ 'ip.tcpmemorypressures': {
+ info: 'Number of times a socket was put in <b>memory pressure</b> due to a non fatal memory allocation failure (the kernel attempts to work around this situation by reducing the send buffers, etc).'
+ },
+
+ 'ip.tcpconnaborts': {
+ info: 'TCP connection aborts. <b>baddata</b> (<code>TCPAbortOnData</code>) happens while the connection is on <code>FIN_WAIT1</code> and the kernel receives a packet with a sequence number beyond the last one for this connection - the kernel responds with <code>RST</code> (closes the connection). <b>userclosed</b> (<code>TCPAbortOnClose</code>) happens when the kernel receives data on an already closed connection and responds with <code>RST</code>. <b>nomemory</b> (<code>TCPAbortOnMemory</code> happens when there are too many orphaned sockets (not attached to an fd) and the kernel has to drop a connection - sometimes it will send an <code>RST</code>, sometimes it won\'t. <b>timeout</b> (<code>TCPAbortOnTimeout</code>) happens when a connection times out. <b>linger</b> (<code>TCPAbortOnLinger</code>) happens when the kernel killed a socket that was already closed by the application and lingered around for long enough. <b>failed</b> (<code>TCPAbortFailed</code>) happens when the kernel attempted to send an <code>RST</code> but failed because there was no memory available.'
+ },
+
+ 'ip.tcp_syn_queue': {
+ info: 'The <b>SYN queue</b> of the kernel tracks TCP handshakes until connections get fully established. ' +
+ 'It overflows when too many incoming TCP connection requests hang in the half-open state and the server ' +
+ 'is not configured to fall back to SYN cookies*. Overflows are usually caused by SYN flood DoS attacks ' +
+ '(i.e. someone sends lots of SYN packets and never completes the handshakes). ' +
+ '<b>drops</b> (or <code>TcpExtTCPReqQFullDrop</code>) is the number of connections dropped because the ' +
+ 'SYN queue was full and SYN cookies were disabled. ' +
+ '<b>cookies</b> (or <code>TcpExtTCPReqQFullDoCookies</code>) is the number of SYN cookies sent because the ' +
+ 'SYN queue was full.'
+ },
+
+ 'ip.tcp_accept_queue': {
+ info: 'The <b>accept queue</b> of the kernel holds the fully established TCP connections, waiting to be handled ' +
+ 'by the listening application. <b>overflows</b> (or <code>ListenOverflows</code>) is the number of ' +
+ 'established connections that could not be handled because the receive queue of the listening application ' +
+ 'was full. <b>drops</b> (or <code>ListenDrops</code>) is the number of incoming ' +
+ 'connections that could not be handled, including SYN floods, overflows, out of memory, security issues, ' +
+ 'no route to destination, reception of related ICMP messages, socket is broadcast or multicast.'
+ },
+
+
+ // ------------------------------------------------------------------------
+ // IPv4
+
+ 'ipv4.tcpsock': {
+ info: 'The number of established TCP connections (known as <code>CurrEstab</code>). This is a snapshot of the established connections at the time of measurement (i.e. a connection established and a connection disconnected within the same iteration will not affect this metric).'
+ },
+
+ 'ipv4.tcpopens': {
+ info: '<b>active</b> or <code>ActiveOpens</code> is the number of outgoing TCP <b>connections attempted</b> by this host.'
+ + ' <b>passive</b> or <code>PassiveOpens</code> is the number of incoming TCP <b>connections accepted</b> by this host.'
+ },
+
+ 'ipv4.tcperrors': {
+ info: '<code>InErrs</code> is the number of TCP segments received in error (including header too small, checksum errors, sequence errors, bad packets - for both IPv4 and IPv6).'
+ + ' <code>InCsumErrors</code> is the number of TCP segments received with checksum errors (for both IPv4 and IPv6).'
+ + ' <code>RetransSegs</code> is the number of TCP segments retransmitted.'
+ },
+
+ 'ipv4.tcphandshake': {
+ info: '<code>EstabResets</code> is the number of established connections resets (i.e. connections that made a direct transition from <code>ESTABLISHED</code> or <code>CLOSE_WAIT</code> to <code>CLOSED</code>).'
+ + ' <code>OutRsts</code> is the number of TCP segments sent, with the <code>RST</code> flag set (for both IPv4 and IPv6).'
+ + ' <code>AttemptFails</code> is the number of times TCP connections made a direct transition from either <code>SYN_SENT</code> or <code>SYN_RECV</code> to <code>CLOSED</code>, plus the number of times TCP connections made a direct transition from the <code>SYN_RECV</code> to <code>LISTEN</code>.'
+ + ' <code>TCPSynRetrans</code> shows retries for new outbound TCP connections, which can indicate general connectivity issues or backlog on the remote host.'
+ },
+
+ // ------------------------------------------------------------------------
+ // APPS
+
+ 'apps.cpu': {
+ height: 2.0
+ },
+
+ 'apps.mem': {
+ info: 'Real memory (RAM) used by applications. This does not include shared memory.'
+ },
+
+ 'apps.vmem': {
+ info: 'Virtual memory allocated by applications. Please check <a href="https://github.com/netdata/netdata/tree/master/daemon#virtual-memory" target="_blank">this article</a> for more information.'
+ },
+
+ 'apps.preads': {
+ height: 2.0
+ },
+
+ 'apps.pwrites': {
+ height: 2.0
+ },
+
+ 'apps.uptime': {
+ info: 'Carried over process group uptime since the Netdata restart. The period of time within which at least one process in the group was running.'
+ },
+
+ 'apps.file_open': {
+ info: 'Calls to the internal function <code>do_sys_open</code> ( For kernels newer than <code>5.5.19</code> we add a kprobe to <code>do_sys_openat2</code>. ), which is the common function called from' +
+ ' <a href="https://www.man7.org/linux/man-pages/man2/open.2.html" target="_blank">open(2)</a> ' +
+ ' and <a href="https://www.man7.org/linux/man-pages/man2/openat.2.html" target="_blank">openat(2)</a>. '
+ },
+
+ 'apps.file_open_error': {
+ info: 'Failed calls to the internal function <code>do_sys_open</code> ( For kernels newer than <code>5.5.19</code> we add a kprobe to <code>do_sys_openat2</code>. ).'
+ },
+
+ 'apps.file_closed': {
+ info: 'Calls to the internal function <a href="https://elixir.bootlin.com/linux/v5.10/source/fs/file.c#L665" target="_blank">__close_fd</a> or <a href="https://elixir.bootlin.com/linux/v5.11/source/fs/file.c#L617" target="_blank">close_fd</a> according to your kernel version, which is called from' +
+ ' <a href="https://www.man7.org/linux/man-pages/man2/close.2.html" target="_blank">close(2)</a>. '
+ },
+
+ 'apps.file_close_error': {
+ info: 'Failed calls to the internal function <a href="https://elixir.bootlin.com/linux/v5.10/source/fs/file.c#L665" target="_blank">__close_fd</a> or <a href="https://elixir.bootlin.com/linux/v5.11/source/fs/file.c#L617" target="_blank">close_fd</a> according to your kernel version.'
+ },
+
+ 'apps.file_deleted': {
+ info: 'Calls to the function <a href="https://www.kernel.org/doc/htmldocs/filesystems/API-vfs-unlink.html" target="_blank">vfs_unlink</a>. This chart does not show all events that remove files from the filesystem, because filesystems can create their own functions to remove files.'
+ },
+
+ 'apps.vfs_write_call': {
+ info: 'Successful calls to the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>. This chart may not show all filesystem events if it uses other functions to store data on disk.'
+ },
+
+ 'apps.vfs_write_error': {
+ info: 'Failed calls to the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>. This chart may not show all filesystem events if it uses other functions to store data on disk.'
+ },
+
+ 'apps.vfs_read_call': {
+ info: 'Successful calls to the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a>. This chart may not show all filesystem events if it uses other functions to store data on disk.'
+ },
+
+ 'apps.vfs_read_error': {
+ info: 'Failed calls to the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a>. This chart may not show all filesystem events if it uses other functions to store data on disk.'
+ },
+
+ 'apps.vfs_write_bytes': {
+ info: 'Total of bytes successfully written using the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>.'
+ },
+
+ 'apps.vfs_read_bytes': {
+ info: 'Total of bytes successfully read using the function <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a>.'
+ },
+
+ 'apps.process_create': {
+ info: 'Calls to either <a href="https://www.ece.uic.edu/~yshi1/linux/lkse/node4.html#SECTION00421000000000000000" target="_blank">do_fork</a>, or <code>kernel_clone</code> if you are running kernel newer than 5.9.16, to create a new task, which is the common name used to define process and tasks inside the kernel. Netdata identifies the process by counting the number of calls to <a href="https://linux.die.net/man/2/clone" target="_blank">sys_clone</a> that do not have the flag <code>CLONE_THREAD</code> set.'
+ },
+
+ 'apps.thread_create': {
+ info: 'Calls to either <a href="https://www.ece.uic.edu/~yshi1/linux/lkse/node4.html#SECTION00421000000000000000" target="_blank">do_fork</a>, or <code>kernel_clone</code> if you are running kernel newer than 5.9.16, to create a new task, which is the common name used to define process and tasks inside the kernel. Netdata identifies the threads by counting the number of calls to <a href="https://linux.die.net/man/2/clone" target="_blank">sys_clone</a> that have the flag <code>CLONE_THREAD</code> set.'
+ },
+
+ 'apps.task_close': {
+ info: 'Calls to the functions responsible for closing (<a href="https://www.informit.com/articles/article.aspx?p=370047&seqNum=4" target="_blank">do_exit</a>) and releasing (<a href="https://www.informit.com/articles/article.aspx?p=370047&seqNum=4" target="_blank">release_task</a>) tasks.'
+ },
+
+ 'apps.bandwidth_sent': {
+ info: 'Bytes sent by functions <code>tcp_sendmsg</code> and <code>udp_sendmsg</code>.'
+ },
+
+ 'apps.bandwidth_recv': {
+ info: 'Bytes received by functions <code>tcp_cleanup_rbuf</code> and <code>udp_recvmsg</code>. We use <code>tcp_cleanup_rbuf</code> instead <code>tcp_recvmsg</code>, because this last misses <code>tcp_read_sock()</code> traffic and we would also need to have more probes to get the socket and package size.'
+ },
+
+ 'apps.bandwidth_tcp_send': {
+ info: 'Calls for function <code>tcp_sendmsg</code>.'
+ },
+
+ 'apps.bandwidth_tcp_recv': {
+ info: 'Calls for functions <code>tcp_cleanup_rbuf</code>. We use <code>tcp_cleanup_rbuf</code> instead <code>tcp_recvmsg</code>, because this last misses <code>tcp_read_sock()</code> traffic and we would also need to have more probes to get the socket and package size.'
+ },
+
+ 'apps.bandwidth_tcp_retransmit': {
+ info: 'Calls for functions <code>tcp_retranstmit_skb</code>.'
+ },
+
+ 'apps.bandwidth_udp_send': {
+ info: 'Calls for function <code>udp_sendmsg</code>.'
+ },
+
+ 'apps.bandwidth_udp_recv': {
+ info: 'Calls for function <code>udp_recvmsg</code>.'
+ },
+
+ // ------------------------------------------------------------------------
+ // USERS
+
+ 'users.cpu': {
+ height: 2.0
+ },
+
+ 'users.mem': {
+ info: 'Real memory (RAM) used per user. This does not include shared memory.'
+ },
+
+ 'users.vmem': {
+ info: 'Virtual memory allocated per user. Please check <a href="https://github.com/netdata/netdata/tree/master/daemon#virtual-memory" target="_blank">this article</a> for more information.'
+ },
+
+ 'users.preads': {
+ height: 2.0
+ },
+
+ 'users.pwrites': {
+ height: 2.0
+ },
+
+ 'users.uptime': {
+ info: 'Carried over process group uptime since the Netdata restart. The period of time within which at least one process in the group was running.'
+ },
+
+ // ------------------------------------------------------------------------
+ // GROUPS
+
+ 'groups.cpu': {
+ height: 2.0
+ },
+
+ 'groups.mem': {
+ info: 'Real memory (RAM) used per user group. This does not include shared memory.'
+ },
+
+ 'groups.vmem': {
+ info: 'Virtual memory allocated per user group since the Netdata restart. Please check <a href="https://github.com/netdata/netdata/tree/master/daemon#virtual-memory" target="_blank">this article</a> for more information.'
+ },
+
+ 'groups.preads': {
+ height: 2.0
+ },
+
+ 'groups.pwrites': {
+ height: 2.0
+ },
+
+ 'groups.uptime': {
+ info: 'Carried over process group uptime. The period of time within which at least one process in the group was running.'
+ },
+
+ // ------------------------------------------------------------------------
+ // NETWORK QoS
+
+ 'tc.qos': {
+ heads: [
+ function (os, id) {
+ void(os);
+
+ if (id.match(/.*-ifb$/))
+ return netdataDashboard.gaugeChart('Inbound', '12%', '', '#5555AA');
+ else
+ return netdataDashboard.gaugeChart('Outbound', '12%', '', '#AA9900');
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // NETWORK INTERFACES
+
+ 'net.net': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ if (id.match(/^cgroup_.*/)) {
+ var iface;
+ try {
+ iface = ' ' + id.substring(id.lastIndexOf('.net_') + 5, id.length);
+ } catch (e) {
+ iface = '';
+ }
+ return netdataDashboard.gaugeChart('Received' + iface, '12%', 'received');
+ } else
+ return '';
+ },
+ function (os, id) {
+ void(os);
+ if (id.match(/^cgroup_.*/)) {
+ var iface;
+ try {
+ iface = ' ' + id.substring(id.lastIndexOf('.net_') + 5, id.length);
+ } catch (e) {
+ iface = '';
+ }
+ return netdataDashboard.gaugeChart('Sent' + iface, '12%', 'sent');
+ } else
+ return '';
+ }
+ ],
+ heads: [
+ function (os, id) {
+ void(os);
+ if (!id.match(/^cgroup_.*/))
+ return netdataDashboard.gaugeChart('Received', '12%', 'received');
+ else
+ return '';
+ },
+ function (os, id) {
+ void(os);
+ if (!id.match(/^cgroup_.*/))
+ return netdataDashboard.gaugeChart('Sent', '12%', 'sent');
+ else
+ return '';
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // NETFILTER
+
+ 'netfilter.sockets': {
+ colors: '#88AA00',
+ heads: [
+ netdataDashboard.gaugeChart('Active Connections', '12%', '', '#88AA00')
+ ]
+ },
+
+ 'netfilter.new': {
+ heads: [
+ netdataDashboard.gaugeChart('New Connections', '12%', 'new', '#5555AA')
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // DISKS
+
+ 'disk.util': {
+ colors: '#FF5588',
+ heads: [
+ netdataDashboard.gaugeChart('使用率', '12%', '', '#FF5588')
+ ],
+ info: 'Disk Utilization measures the amount of time the disk was busy with something. This is not related to its performance. 100% means that the system always had an outstanding operation on the disk. Keep in mind that depending on the underlying technology of the disk, 100% here may or may not be an indication of congestion.'
+ },
+
+ 'disk.busy': {
+ colors: '#FF5588',
+ info: 'Disk Busy Time measures the amount of time the disk was busy with something.'
+ },
+
+ 'disk.backlog': {
+ colors: '#0099CC',
+ info: 'Backlog is an indication of the duration of pending disk operations. On every I/O event the system is multiplying the time spent doing I/O since the last update of this field with the number of pending operations. While not accurate, this metric can provide an indication of the expected completion time of the operations in progress.'
+ },
+
+ 'disk.io': {
+ heads: [
+ netdataDashboard.gaugeChart('读取', '12%', 'reads'),
+ netdataDashboard.gaugeChart('写入', '12%', 'writes')
+ ],
+ info: '磁碟传输资料的总计。'
+ },
+
+ 'disk.ops': {
+ info: '已完成的磁碟 I/O operations。提醒：实际上的 operations 数量可能更高，因为系统能够将它们互相合并 (详见 operations 图表)。'
+ },
+
+ 'disk.qops': {
+ info: 'I/O operations currently in progress. This metric is a snapshot - it is not an average over the last interval.'
+ },
+
+ 'disk.iotime': {
+ height: 0.5,
+ info: 'The sum of the duration of all completed I/O operations. This number can exceed the interval if the disk is able to execute I/O operations in parallel.'
+ },
+ 'disk.mops': {
+ height: 0.5,
+ info: 'The number of merged disk operations. The system is able to merge adjacent I/O operations, for example two 4KB reads can become one 8KB read before given to disk.'
+ },
+ 'disk.svctm': {
+ height: 0.5,
+ info: 'The average service time for completed I/O operations. This metric is calculated using the total busy time of the disk and the number of completed operations. If the disk is able to execute multiple parallel operations the reporting average service time will be misleading.'
+ },
+ 'disk.avgsz': {
+ height: 0.5,
+ info: 'I/O operation 平均大小。'
+ },
+ 'disk.await': {
+ height: 0.5,
+ info: '对要提供服务的设备发出 I/O 请求平均时间。这包含了请求在伫列中所花费的时间以及实际提供服务的时间。'
+ },
+
+ 'disk.space': {
+ info: '磁碟空间使用率。系统会自动为 root 使用者做保留，以防止 root 使用者使用过多。'
+ },
+ 'disk.inodes': {
+ info: 'inodes (or index nodes) are filesystem objects (e.g. files and directories). On many types of file system implementations, the maximum number of inodes is fixed at filesystem creation, limiting the maximum number of files the filesystem can hold. It is possible for a device to run out of inodes. When this happens, new files cannot be created on the device, even though there may be free space available.'
+ },
+
+ 'mysql.net': {
+ info: 'The amount of data sent to mysql clients (<strong>out</strong>) and received from mysql clients (<strong>in</strong>).'
+ },
+
+ // ------------------------------------------------------------------------
+ // MYSQL
+
+ 'mysql.queries': {
+ info: 'The number of statements executed by the server.<ul>' +
+ '<li><strong>queries</strong> counts the statements executed within stored SQL programs.</li>' +
+ '<li><strong>questions</strong> counts the statements sent to the mysql server by mysql clients.</li>' +
+ '<li><strong>slow queries</strong> counts the number of statements that took more than <a href="http://dev.mysql.com/doc/refman/5.7/en/server-system-variables.html#sysvar_long_query_time" target="_blank">long_query_time</a> seconds to be executed.' +
+ ' For more information about slow queries check the mysql <a href="http://dev.mysql.com/doc/refman/5.7/en/slow-query-log.html" target="_blank">slow query log</a>.</li>' +
+ '</ul>'
+ },
+
+ 'mysql.handlers': {
+ info: 'Usage of the internal handlers of mysql. This chart provides very good insights of what the mysql server is actually doing.' +
+ ' (if the chart is not showing all these dimensions it is because they are zero - set <strong>Which dimensions to show?</strong> to <strong>All</strong> from the dashboard settings, to render even the zero values)<ul>' +
+ '<li><strong>commit</strong>, the number of internal <a href="http://dev.mysql.com/doc/refman/5.7/en/commit.html" target="_blank">COMMIT</a> statements.</li>' +
+ '<li><strong>delete</strong>, the number of times that rows have been deleted from tables.</li>' +
+ '<li><strong>prepare</strong>, a counter for the prepare phase of two-phase commit operations.</li>' +
+ '<li><strong>read first</strong>, the number of times the first entry in an index was read. A high value suggests that the server is doing a lot of full index scans; e.g. <strong>SELECT col1 FROM foo</strong>, with col1 indexed.</li>' +
+ '<li><strong>read key</strong>, the number of requests to read a row based on a key. If this value is high, it is a good indication that your tables are properly indexed for your queries.</li>' +
+ '<li><strong>read next</strong>, the number of requests to read the next row in key order. This value is incremented if you are querying an index column with a range constraint or if you are doing an index scan.</li>' +
+ '<li><strong>read prev</strong>, the number of requests to read the previous row in key order. This read method is mainly used to optimize <strong>ORDER BY ... DESC</strong>.</li>' +
+ '<li><strong>read rnd</strong>, the number of requests to read a row based on a fixed position. A high value indicates you are doing a lot of queries that require sorting of the result. You probably have a lot of queries that require MySQL to scan entire tables or you have joins that do not use keys properly.</li>' +
+ '<li><strong>read rnd next</strong>, the number of requests to read the next row in the data file. This value is high if you are doing a lot of table scans. Generally this suggests that your tables are not properly indexed or that your queries are not written to take advantage of the indexes you have.</li>' +
+ '<li><strong>rollback</strong>, the number of requests for a storage engine to perform a rollback operation.</li>' +
+ '<li><strong>savepoint</strong>, the number of requests for a storage engine to place a savepoint.</li>' +
+ '<li><strong>savepoint rollback</strong>, the number of requests for a storage engine to roll back to a savepoint.</li>' +
+ '<li><strong>update</strong>, the number of requests to update a row in a table.</li>' +
+ '<li><strong>write</strong>, the number of requests to insert a row in a table.</li>' +
+ '</ul>'
+ },
+
+ 'mysql.table_locks': {
+ info: 'MySQL table locks counters: <ul>' +
+ '<li><strong>immediate</strong>, the number of times that a request for a table lock could be granted immediately.</li>' +
+ '<li><strong>waited</strong>, the number of times that a request for a table lock could not be granted immediately and a wait was needed. If this is high and you have performance problems, you should first optimize your queries, and then either split your table or tables or use replication.</li>' +
+ '</ul>'
+ },
+
+ 'mysql.innodb_deadlocks': {
+ info: 'A deadlock happens when two or more transactions mutually hold and request for locks, creating a cycle of dependencies. For more information about <a href="https://dev.mysql.com/doc/refman/5.7/en/innodb-deadlocks-handling.html" target="_blank">how to minimize and handle deadlocks</a>.'
+ },
+
+ 'mysql.galera_cluster_status': {
+ info:
+ '<code>-1</code>: unknown, ' +
+ '<code>0</code>: primary (primary group configuration, quorum present), ' +
+ '<code>1</code>: non-primary (non-primary group configuration, quorum lost), ' +
+ '<code>2</code>: disconnected(not connected to group, retrying).'
+ },
+
+ 'mysql.galera_cluster_state': {
+ info:
+ '<code>0</code>: undefined, ' +
+ '<code>1</code>: joining, ' +
+ '<code>2</code>: donor/desynced, ' +
+ '<code>3</code>: joined, ' +
+ '<code>4</code>: synced.'
+ },
+
+ 'mysql.galera_cluster_weight': {
+ info: 'The value is counted as a sum of <code>pc.weight</code> of the nodes in the current Primary Component.'
+ },
+
+ 'mysql.galera_connected': {
+ info: '<code>0</code> means that the node has not yet connected to any of the cluster components. ' +
+ 'This may be due to misconfiguration.'
+ },
+
+ 'mysql.open_transactions': {
+ info: 'The number of locally running transactions which have been registered inside the wsrep provider. ' +
+ 'This means transactions which have made operations which have caused write set population to happen. ' +
+ 'Transactions which are read only are not counted.'
+ },
+
+
+ // ------------------------------------------------------------------------
+ // POSTGRESQL
+
+
+ 'postgres.db_stat_blks': {
+ info: 'Blocks reads from disk or cache.<ul>' +
+ '<li><strong>blks_read:</strong> number of disk blocks read in this database.</li>' +
+ '<li><strong>blks_hit:</strong> number of times disk blocks were found already in the buffer cache, so that a read was not necessary (this only includes hits in the PostgreSQL buffer cache, not the operating system's file system cache)</li>' +
+ '</ul>'
+ },
+ 'postgres.db_stat_tuple_write': {
+ info: '<ul><li>Number of rows inserted/updated/deleted.</li>' +
+ '<li><strong>conflicts:</strong> number of queries canceled due to conflicts with recovery in this database. (Conflicts occur only on standby servers; see <a href="https://www.postgresql.org/docs/10/static/monitoring-stats.html#PG-STAT-DATABASE-CONFLICTS-VIEW" target="_blank">pg_stat_database_conflicts</a> for details.)</li>' +
+ '</ul>'
+ },
+ 'postgres.db_stat_temp_bytes': {
+ info: 'Temporary files can be created on disk for sorts, hashes, and temporary query results.'
+ },
+ 'postgres.db_stat_temp_files': {
+ info: '<ul>' +
+ '<li><strong>files:</strong> number of temporary files created by queries. All temporary files are counted, regardless of why the temporary file was created (e.g., sorting or hashing).</li>' +
+ '</ul>'
+ },
+ 'postgres.archive_wal': {
+ info: 'WAL archiving.<ul>' +
+ '<li><strong>total:</strong> total files.</li>' +
+ '<li><strong>ready:</strong> WAL waiting to be archived.</li>' +
+ '<li><strong>done:</strong> WAL successfully archived. ' +
+ 'Ready WAL can indicate archive_command is in error, see <a href="https://www.postgresql.org/docs/current/static/continuous-archiving.html" target="_blank">Continuous Archiving and Point-in-Time Recovery</a>.</li>' +
+ '</ul>'
+ },
+ 'postgres.checkpointer': {
+ info: 'Number of checkpoints.<ul>' +
+ '<li><strong>scheduled:</strong> when checkpoint_timeout is reached.</li>' +
+ '<li><strong>requested:</strong> when max_wal_size is reached.</li>' +
+ '</ul>' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/static/wal-configuration.html" target="_blank">WAL Configuration</a>.'
+ },
+ 'postgres.autovacuum': {
+ info: 'PostgreSQL databases require periodic maintenance known as vacuuming. For many installations, it is sufficient to let vacuuming be performed by the autovacuum daemon. ' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/static/routine-vacuuming.html#AUTOVACUUM" target="_blank">The Autovacuum Daemon</a>.'
+ },
+ 'postgres.standby_delta': {
+ info: 'Streaming replication delta.<ul>' +
+ '<li><strong>sent_delta:</strong> replication delta sent to standby.</li>' +
+ '<li><strong>write_delta:</strong> replication delta written to disk by this standby.</li>' +
+ '<li><strong>flush_delta:</strong> replication delta flushed to disk by this standby server.</li>' +
+ '<li><strong>replay_delta:</strong> replication delta replayed into the database on this standby server.</li>' +
+ '</ul>' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/static/warm-standby.html#SYNCHRONOUS-REPLICATION" target="_blank">Synchronous Replication</a>.'
+ },
+ 'postgres.replication_slot': {
+ info: 'Replication slot files.<ul>' +
+ '<li><strong>wal_keeped:</strong> WAL files retained by each replication slots.</li>' +
+ '<li><strong>pg_replslot_files:</strong> files present in pg_replslot.</li>' +
+ '</ul>' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/static/warm-standby.html#STREAMING-REPLICATION-SLOTS" target="_blank">Replication Slots</a>.'
+ },
+ 'postgres.backend_usage': {
+ info: 'Connections usage against maximum connections allowed, as defined in the <i>max_connections</i> setting.<ul>' +
+ '<li><strong>available:</strong> maximum new connections allowed.</li>' +
+ '<li><strong>used:</strong> connections currently in use.</li>' +
+ '</ul>' +
+ 'Assuming non-superuser accounts are being used to connect to Postgres (so <i>superuser_reserved_connections</i> are subtracted from <i>max_connections</i>).<br/>' +
+ 'For more information see <a href="https://www.postgresql.org/docs/current/runtime-config-connection.html" target="_blank">Connections and Authentication</a>.'
+ },
+
+
+ // ------------------------------------------------------------------------
+ // APACHE
+
+ 'apache.connections': {
+ colors: NETDATA.colors[4],
+ mainheads: [
+ netdataDashboard.gaugeChart('Connections', '12%', '', NETDATA.colors[4])
+ ]
+ },
+
+ 'apache.requests': {
+ colors: NETDATA.colors[0],
+ mainheads: [
+ netdataDashboard.gaugeChart('Requests', '12%', '', NETDATA.colors[0])
+ ]
+ },
+
+ 'apache.net': {
+ colors: NETDATA.colors[3],
+ mainheads: [
+ netdataDashboard.gaugeChart('Bandwidth', '12%', '', NETDATA.colors[3])
+ ]
+ },
+
+ 'apache.workers': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="busy"'
+ + ' data-append-options="percentage"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Workers Utilization"'
+ + ' data-units="percentage %"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'apache.bytesperreq': {
+ colors: NETDATA.colors[3],
+ height: 0.5
+ },
+
+ 'apache.reqpersec': {
+ colors: NETDATA.colors[4],
+ height: 0.5
+ },
+
+ 'apache.bytespersec': {
+ colors: NETDATA.colors[6],
+ height: 0.5
+ },
+
+
+ // ------------------------------------------------------------------------
+ // LIGHTTPD
+
+ 'lighttpd.connections': {
+ colors: NETDATA.colors[4],
+ mainheads: [
+ netdataDashboard.gaugeChart('Connections', '12%', '', NETDATA.colors[4])
+ ]
+ },
+
+ 'lighttpd.requests': {
+ colors: NETDATA.colors[0],
+ mainheads: [
+ netdataDashboard.gaugeChart('Requests', '12%', '', NETDATA.colors[0])
+ ]
+ },
+
+ 'lighttpd.net': {
+ colors: NETDATA.colors[3],
+ mainheads: [
+ netdataDashboard.gaugeChart('Bandwidth', '12%', '', NETDATA.colors[3])
+ ]
+ },
+
+ 'lighttpd.workers': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="busy"'
+ + ' data-append-options="percentage"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Servers Utilization"'
+ + ' data-units="percentage %"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'lighttpd.bytesperreq': {
+ colors: NETDATA.colors[3],
+ height: 0.5
+ },
+
+ 'lighttpd.reqpersec': {
+ colors: NETDATA.colors[4],
+ height: 0.5
+ },
+
+ 'lighttpd.bytespersec': {
+ colors: NETDATA.colors[6],
+ height: 0.5
+ },
+
+ // ------------------------------------------------------------------------
+ // NGINX
+
+ 'nginx.connections': {
+ colors: NETDATA.colors[4],
+ mainheads: [
+ netdataDashboard.gaugeChart('Connections', '12%', '', NETDATA.colors[4])
+ ]
+ },
+
+ 'nginx.requests': {
+ colors: NETDATA.colors[0],
+ mainheads: [
+ netdataDashboard.gaugeChart('Requests', '12%', '', NETDATA.colors[0])
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // HTTP check
+
+ 'httpcheck.responsetime': {
+ info: 'The <code>response time</code> describes the time passed between request and response. ' +
+ 'Currently, the accuracy of the response time is low and should be used as reference only.'
+ },
+
+ 'httpcheck.responselength': {
+ info: 'The <code>response length</code> counts the number of characters in the response body. For static pages, this should be mostly constant.'
+ },
+
+ 'httpcheck.status': {
+ valueRange: "[0, 1]",
+ info: 'This chart verifies the response of the webserver. Each status dimension will have a value of <code>1</code> if triggered. ' +
+ 'Dimension <code>success</code> is <code>1</code> only if all constraints are satisfied. ' +
+ 'This chart is most useful for alarms or third-party apps.'
+ },
+
+ // ------------------------------------------------------------------------
+ // NETDATA
+
+ 'netdata.response_time': {
+ info: 'The netdata API response time measures the time netdata needed to serve requests. This time includes everything, from the reception of the first byte of a request, to the dispatch of the last byte of its reply, therefore it includes all network latencies involved (i.e. a client over a slow network will influence these metrics).'
+ },
+
+ // ------------------------------------------------------------------------
+ // RETROSHARE
+
+ 'retroshare.bandwidth': {
+ info: 'RetroShare inbound and outbound traffic.',
+ mainheads: [
+ netdataDashboard.gaugeChart('Received', '12%', 'bandwidth_down_kb'),
+ netdataDashboard.gaugeChart('Sent', '12%', 'bandwidth_up_kb')
+ ]
+ },
+
+ 'retroshare.peers': {
+ info: 'Number of (connected) RetroShare friends.',
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="peers_connected"'
+ + ' data-append-options="friends"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="connected friends"'
+ + ' data-units=""'
+ + ' data-width="8%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'retroshare.dht': {
+ info: 'Statistics about RetroShare\'s DHT. These values are estimated!'
+ },
+
+ // ------------------------------------------------------------------------
+ // fping
+
+ 'fping.quality': {
+ colors: NETDATA.colors[10],
+ height: 0.5
+ },
+
+ 'fping.packets': {
+ height: 0.5
+ },
+
+
+ // ------------------------------------------------------------------------
+ // containers
+
+ 'cgroup.cpu_limit': {
+ valueRange: "[0, null]",
+ mainheads: [
+ function (os, id) {
+ void(os);
+ cgroupCPULimitIsSet = 1;
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="used"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="CPU"'
+ + ' data-units="%"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'cgroup.cpu': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ if (cgroupCPULimitIsSet === 0) {
+ return '<div data-netdata="' + id + '"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="CPU"'
+ + ' data-units="%"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' role="application"></div>';
+ } else
+ return '';
+ }
+ ]
+ },
+
+ 'cgroup.mem_usage_limit': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ cgroupMemLimitIsSet = 1;
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="used"'
+ + ' data-append-options="percentage"'
+ + ' data-gauge-max-value="100"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Memory"'
+ + ' data-units="%"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'cgroup.mem_usage': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ if (cgroupMemLimitIsSet === 0) {
+ return '<div data-netdata="' + id + '"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Memory"'
+ + ' data-units="MB"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' role="application"></div>';
+ }
+ else
+ return '';
+ }
+ ]
+ },
+
+ 'cgroup.throttle_io': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="read"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Read Disk I/O"'
+ + ' data-units="KB/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' role="application"></div>';
+ },
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="write"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Write Disk I/O"'
+ + ' data-units="KB/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // beanstalkd
+ // system charts
+ 'beanstalk.cpu_usage': {
+ info: 'Amount of CPU Time for user and system used by beanstalkd.'
+ },
+
+ // This is also a per-tube stat
+ 'beanstalk.jobs_rate': {
+ info: 'The rate of jobs processed by the beanstalkd served.'
+ },
+
+ 'beanstalk.connections_rate': {
+ info: 'Tthe rate of connections opened to beanstalkd.'
+ },
+
+ 'beanstalk.commands_rate': {
+ info: 'The rate of commands received by beanstalkd.'
+ },
+
+ 'beanstalk.current_tubes': {
+ info: 'Total number of current tubes on the server including the default tube (which always exists).'
+ },
+
+ 'beanstalk.current_jobs': {
+ info: 'Current number of jobs in all tubes grouped by status: urgent, ready, reserved, delayed and buried.'
+ },
+
+ 'beanstalk.current_connections': {
+ info: 'Current number of connections group by connection type: written, producers, workers, waiting.'
+ },
+
+ 'beanstalk.binlog': {
+ info: 'The rate of records <code>written</code> to binlog and <code>migrated</code> as part of compaction.'
+ },
+
+ 'beanstalk.uptime': {
+ info: 'Total time beanstalkd server has been up for.'
+ },
+
+ // tube charts
+ 'beanstalk.jobs': {
+ info: 'Number of jobs currently in the tube grouped by status: urgent, ready, reserved, delayed and buried.'
+ },
+
+ 'beanstalk.connections': {
+ info: 'The current number of connections to this tube grouped by connection type; using, waiting and watching.'
+ },
+
+ 'beanstalk.commands': {
+ info: 'The rate of <code>delete</code> and <code>pause</code> commands executed by beanstalkd.'
+ },
+
+ 'beanstalk.pause': {
+ info: 'Shows info on how long the tube has been paused for, and how long is left remaining on the pause.'
+ },
+
+ // ------------------------------------------------------------------------
+ // ceph
+
+ 'ceph.general_usage': {
+ info: 'The usage and available space in all ceph cluster.'
+ },
+
+ 'ceph.general_objects': {
+ info: 'Total number of objects storage on ceph cluster.'
+ },
+
+ 'ceph.general_bytes': {
+ info: 'Cluster read and write data per second.'
+ },
+
+ 'ceph.general_operations': {
+ info: 'Number of read and write operations per second.'
+ },
+
+ 'ceph.general_latency': {
+ info: 'Total of apply and commit latency in all OSDs. The apply latency is the total time taken to flush an update to disk. The commit latency is the total time taken to commit an operation to the journal.'
+ },
+
+ 'ceph.pool_usage': {
+ info: 'The usage space in each pool.'
+ },
+
+ 'ceph.pool_objects': {
+ info: 'Number of objects presents in each pool.'
+ },
+
+ 'ceph.pool_read_bytes': {
+ info: 'The rate of read data per second in each pool.'
+ },
+
+ 'ceph.pool_write_bytes': {
+ info: 'The rate of write data per second in each pool.'
+ },
+
+ 'ceph.pool_read_objects': {
+ info: 'Number of read objects per second in each pool.'
+ },
+
+ 'ceph.pool_write_objects': {
+ info: 'Number of write objects per second in each pool.'
+ },
+
+ 'ceph.osd_usage': {
+ info: 'The usage space in each OSD.'
+ },
+
+ 'ceph.apply_latency': {
+ info: 'Time taken to flush an update in each OSD.'
+ },
+
+ 'ceph.commit_latency': {
+ info: 'Time taken to commit an operation to the journal in each OSD.'
+ },
+
+ // ------------------------------------------------------------------------
+ // web_log
+
+ 'web_log.response_statuses': {
+ info: 'Web server responses by type. <code>success</code> includes <b>1xx</b>, <b>2xx</b>, <b>304</b> and <b>401</b>, <code>error</code> includes <b>5xx</b>, <code>redirect</code> includes <b>3xx</b> except <b>304</b>, <code>bad</code> includes <b>4xx</b> except <b>401</b>, <code>other</code> are all the other responses.',
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="success"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Successful"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="redirect"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Redirects"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="bad"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Bad Requests"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="error"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Server Errors"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.response_codes': {
+ info: 'Web server responses by code family. ' +
+ 'According to the standards <code>1xx</code> are informational responses, ' +
+ '<code>2xx</code> are successful responses, ' +
+ '<code>3xx</code> are redirects (although they include <b>304</b> which is used as "<b>not modified</b>"), ' +
+ '<code>4xx</code> are bad requests, ' +
+ '<code>5xx</code> are internal server errors, ' +
+ '<code>other</code> are non-standard responses, ' +
+ '<code>unmatched</code> counts the lines in the log file that are not matched by the plugin (<a href="https://github.com/netdata/netdata/issues/new?title=web_log%20reports%20unmatched%20lines&body=web_log%20plugin%20reports%20unmatched%20lines.%0A%0AThis%20is%20my%20log:%0A%0A%60%60%60txt%0A%0Aplease%20paste%20your%20web%20server%20log%20here%0A%0A%60%60%60" target="_blank">let us know</a> if you have any unmatched).'
+ },
+
+ 'web_log.response_time': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="avg"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Average Response Time"'
+ + ' data-units="milliseconds"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.detailed_response_codes': {
+ info: 'Number of responses for each response code individually.'
+ },
+
+ 'web_log.requests_per_ipproto': {
+ info: 'Web server requests received per IP protocol version.'
+ },
+
+ 'web_log.clients': {
+ info: 'Unique client IPs accessing the web server, within each data collection iteration. If data collection is <b>per second</b>, this chart shows <b>unique client IPs per second</b>.'
+ },
+
+ 'web_log.clients_all': {
+ info: 'Unique client IPs accessing the web server since the last restart of netdata. This plugin keeps in memory all the unique IPs that have accessed the web server. On very busy web servers (several millions of unique IPs) you may want to disable this chart (check <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/web_log/web_log.conf" target="_blank"><code>/etc/netdata/python.d/web_log.conf</code></a>).'
+ },
+
+ // ------------------------------------------------------------------------
+ // web_log for squid
+
+ 'web_log.squid_response_statuses': {
+ info: 'Squid responses by type. ' +
+ '<code>success</code> includes <b>1xx</b>, <b>2xx</b>, <b>000</b>, <b>304</b>, ' +
+ '<code>error</code> includes <b>5xx</b> and <b>6xx</b>, ' +
+ '<code>redirect</code> includes <b>3xx</b> except <b>304</b>, ' +
+ '<code>bad</code> includes <b>4xx</b>, ' +
+ '<code>other</code> are all the other responses.',
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="success"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Successful"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="redirect"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Redirects"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="bad"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Bad Requests"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="error"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Server Errors"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.squid_response_codes': {
+ info: 'Web server responses by code family. ' +
+ 'According to HTTP standards <code>1xx</code> are informational responses, ' +
+ '<code>2xx</code> are successful responses, ' +
+ '<code>3xx</code> are redirects (although they include <b>304</b> which is used as "<b>not modified</b>"), ' +
+ '<code>4xx</code> are bad requests, ' +
+ '<code>5xx</code> are internal server errors. ' +
+ 'Squid also defines <code>000</code> mostly for UDP requests, and ' +
+ '<code>6xx</code> for broken upstream servers sending wrong headers. ' +
+ 'Finally, <code>other</code> are non-standard responses, and ' +
+ '<code>unmatched</code> counts the lines in the log file that are not matched by the plugin (<a href="https://github.com/netdata/netdata/issues/new?title=web_log%20reports%20unmatched%20lines&body=web_log%20plugin%20reports%20unmatched%20lines.%0A%0AThis%20is%20my%20log:%0A%0A%60%60%60txt%0A%0Aplease%20paste%20your%20web%20server%20log%20here%0A%0A%60%60%60" target="_blank">let us know</a> if you have any unmatched).'
+ },
+
+ 'web_log.squid_duration': {
+ mainheads: [
+ function (os, id) {
+ void(os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="avg"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Average Response Time"'
+ + ' data-units="milliseconds"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.squid_detailed_response_codes': {
+ info: 'Number of responses for each response code individually.'
+ },
+
+ 'web_log.squid_clients': {
+ info: 'Unique client IPs accessing squid, within each data collection iteration. If data collection is <b>per second</b>, this chart shows <b>unique client IPs per second</b>.'
+ },
+
+ 'web_log.squid_clients_all': {
+ info: 'Unique client IPs accessing squid since the last restart of netdata. This plugin keeps in memory all the unique IPs that have accessed the server. On very busy squid servers (several millions of unique IPs) you may want to disable this chart (check <a href="https://github.com/netdata/netdata/blob/master/collectors/python.d.plugin/web_log/web_log.conf" target="_blank"><code>/etc/netdata/python.d/web_log.conf</code></a>).'
+ },
+
+ 'web_log.squid_transport_methods': {
+ info: 'Break down per delivery method: <code>TCP</code> are requests on the HTTP port (usually 3128), ' +
+ '<code>UDP</code> are requests on the ICP port (usually 3130), or HTCP port (usually 4128). ' +
+ 'If ICP logging was disabled using the log_icp_queries option, no ICP replies will be logged. ' +
+ '<code>NONE</code> are used to state that squid delivered an unusual response or no response at all. ' +
+ 'Seen with cachemgr requests and errors, usually when the transaction fails before being classified into one of the above outcomes. ' +
+ 'Also seen with responses to <code>CONNECT</code> requests.'
+ },
+
+ 'web_log.squid_code': {
+ info: 'These are combined squid result status codes. A break down per component is given in the following charts. ' +
+ 'Check the <a href="http://wiki.squid-cache.org/SquidFaq/SquidLogs">squid documentation about them</a>.'
+ },
+
+ 'web_log.squid_handling_opts': {
+ info: 'These tags are optional and describe why the particular handling was performed or where the request came from. ' +
+ '<code>CLIENT</code> means that the client request placed limits affecting the response. Usually seen with client issued a <b>no-cache</b>, or analogous cache control command along with the request. Thus, the cache has to validate the object.' +
+ '<code>IMS</code> states that the client sent a revalidation (conditional) request. ' +
+ '<code>ASYNC</code>, is used when the request was generated internally by Squid. Usually this is background fetches for cache information exchanges, background revalidation from stale-while-revalidate cache controls, or ESI sub-objects being loaded. ' +
+ '<code>SWAPFAIL</code> is assigned when the object was believed to be in the cache, but could not be accessed. A new copy was requested from the server. ' +
+ '<code>REFRESH</code> when a revalidation (conditional) request was sent to the server. ' +
+ '<code>SHARED</code> when this request was combined with an existing transaction by collapsed forwarding. NOTE: the existing request is not marked as SHARED. ' +
+ '<code>REPLY</code> when particular handling was requested in the HTTP reply from server or peer. Usually seen on DENIED due to http_reply_access ACLs preventing delivery of servers response object to the client.'
+ },
+
+ 'web_log.squid_object_types': {
+ info: 'These tags are optional and describe what type of object was produced. ' +
+ '<code>NEGATIVE</code> is only seen on HIT responses, indicating the response was a cached error response. e.g. <b>404 not found</b>. ' +
+ '<code>STALE</code> means the object was cached and served stale. This is usually caused by stale-while-revalidate or stale-if-error cache controls. ' +
+ '<code>OFFLINE</code> when the requested object was retrieved from the cache during offline_mode. The offline mode never validates any object. ' +
+ '<code>INVALID</code> when an invalid request was received. An error response was delivered indicating what the problem was. ' +
+ '<code>FAIL</code> is only seen on <code>REFRESH</code> to indicate the revalidation request failed. The response object may be the server provided network error or the stale object which was being revalidated depending on stale-if-error cache control. ' +
+ '<code>MODIFIED</code> is only seen on <code>REFRESH</code> responses to indicate revalidation produced a new modified object. ' +
+ '<code>UNMODIFIED</code> is only seen on <code>REFRESH</code> responses to indicate revalidation produced a <b>304</b> (Not Modified) status, which was relayed to the client. ' +
+ '<code>REDIRECT</code> when squid generated an HTTP redirect response to this request.'
+ },
+
+ 'web_log.squid_cache_events': {
+ info: 'These tags are optional and describe whether the response was loaded from cache, network, or otherwise. ' +
+ '<code>HIT</code> when the response object delivered was the local cache object. ' +
+ '<code>MEM</code> when the response object came from memory cache, avoiding disk accesses. Only seen on HIT responses. ' +
+ '<code>MISS</code> when the response object delivered was the network response object. ' +
+ '<code>DENIED</code> when the request was denied by access controls. ' +
+ '<code>NOFETCH</code> an ICP specific type, indicating service is alive, but not to be used for this request (sent during "-Y" startup, or during frequent failures, a cache in hit only mode will return either UDP_HIT or UDP_MISS_NOFETCH. Neighbours will thus only fetch hits). ' +
+ '<code>TUNNEL</code> when a binary tunnel was established for this transaction.'
+ },
+
+ 'web_log.squid_transport_errors': {
+ info: 'These tags are optional and describe some error conditions which occurred during response delivery (if any). ' +
+ '<code>ABORTED</code> when the response was not completed due to the connection being aborted (usually by the client). ' +
+ '<code>TIMEOUT</code>, when the response was not completed due to a connection timeout.'
+ },
+
+ // ------------------------------------------------------------------------
+ // go web_log
+
+ 'web_log.type_requests': {
+ info: 'Web server responses by type. <code>success</code> includes <b>1xx</b>, <b>2xx</b>, <b>304</b> and <b>401</b>, <code>error</code> includes <b>5xx</b>, <code>redirect</code> includes <b>3xx</b> except <b>304</b>, <code>bad</code> includes <b>4xx</b> except <b>401</b>, <code>other</code> are all the other responses.',
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="success"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Successful"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="redirect"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Redirects"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="bad"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Bad Requests"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ },
+
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="error"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Server Errors"'
+ + ' data-units="requests/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-common-max="' + id + '"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="0"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'web_log.request_processing_time': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="avg"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Average Response Time"'
+ + ' data-units="milliseconds"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ // ------------------------------------------------------------------------
+ // Fronius Solar Power
+
+ 'fronius.power': {
+ info: 'Positive <code>Grid</code> values mean that power is coming from the grid. Negative values are excess power that is going back into the grid, possibly selling it. ' +
+ '<code>Photovoltaics</code> is the power generated from the solar panels. ' +
+ '<code>Accumulator</code> is the stored power in the accumulator, if one is present.'
+ },
+
+ 'fronius.autonomy': {
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, 100]",
+ info: 'The <code>Autonomy</code> is the percentage of how autonomous the installation is. An autonomy of 100 % means that the installation is producing more energy than it is needed. ' +
+ 'The <code>Self consumption</code> indicates the ratio between the current power generated and the current load. When it reaches 100 %, the <code>Autonomy</code> declines, since the solar panels can not produce enough energy and need support from the grid.'
+ },
+
+ 'fronius.energy.today': {
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, null]"
+ },
+
+ // ------------------------------------------------------------------------
+ // Stiebel Eltron Heat pump installation
+
+ 'stiebeleltron.system.roomtemp': {
+ commonMin: true,
+ commonMax: true,
+ valueRange: "[0, null]"
+ },
+
+ // ------------------------------------------------------------------------
+ // Port check
+
+ 'portcheck.latency': {
+ info: 'The <code>latency</code> describes the time spent connecting to a TCP port. No data is sent or received. ' +
+ 'Currently, the accuracy of the latency is low and should be used as reference only.'
+ },
+
+ 'portcheck.status': {
+ valueRange: "[0, 1]",
+ info: 'The <code>status</code> chart verifies the availability of the service. ' +
+ 'Each status dimension will have a value of <code>1</code> if triggered. Dimension <code>success</code> is <code>1</code> only if connection could be established. ' +
+ 'This chart is most useful for alarms and third-party apps.'
+ },
+
+ // ------------------------------------------------------------------------
+
+ 'chrony.system': {
+ info: 'In normal operation, chronyd never steps the system clock, because any jump in the timescale can have adverse consequences for certain application programs. Instead, any error in the system clock is corrected by slightly speeding up or slowing down the system clock until the error has been removed, and then returning to the system clock’s normal speed. A consequence of this is that there will be a period when the system clock (as read by other programs using the <code>gettimeofday()</code> system call, or by the <code>date</code> command in the shell) will be different from chronyd\'s estimate of the current true time (which it reports to NTP clients when it is operating in server mode). The value reported on this line is the difference due to this effect.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'chrony.offsets': {
+ info: '<code>last offset</code> is the estimated local offset on the last clock update. <code>RMS offset</code> is a long-term average of the offset value.',
+ height: 0.5
+ },
+
+ 'chrony.stratum': {
+ info: 'The <code>stratum</code> indicates how many hops away from a computer with an attached reference clock we are. Such a computer is a stratum-1 computer.',
+ decimalDigits: 0,
+ height: 0.5
+ },
+
+ 'chrony.root': {
+ info: 'Estimated delays against the root time server this system is synchronized with. <code>delay</code> is the total of the network path delays to the stratum-1 computer from which the computer is ultimately synchronised. <code>dispersion</code> is the total dispersion accumulated through all the computers back to the stratum-1 computer from which the computer is ultimately synchronised. Dispersion is due to system clock resolution, statistical measurement variations etc.'
+ },
+
+ 'chrony.frequency': {
+ info: 'The <code>frequency</code> is the rate by which the system\'s clock would be would be wrong if chronyd was not correcting it. It is expressed in ppm (parts per million). For example, a value of 1ppm would mean that when the system\'s clock thinks it has advanced 1 second, it has actually advanced by 1.000001 seconds relative to true time.',
+ colors: NETDATA.colors[0]
+ },
+
+ 'chrony.residualfreq': {
+ info: 'This shows the <code>residual frequency</code> for the currently selected reference source. ' +
+ 'It reflects any difference between what the measurements from the reference source indicate the ' +
+ 'frequency should be and the frequency currently being used. The reason this is not always zero is ' +
+ 'that a smoothing procedure is applied to the frequency. Each time a measurement from the reference ' +
+ 'source is obtained and a new residual frequency computed, the estimated accuracy of this residual ' +
+ 'is compared with the estimated accuracy (see <code>skew</code>) of the existing frequency value. ' +
+ 'A weighted average is computed for the new frequency, with weights depending on these accuracies. ' +
+ 'If the measurements from the reference source follow a consistent trend, the residual will be ' +
+ 'driven to zero over time.',
+ height: 0.5,
+ colors: NETDATA.colors[3]
+ },
+
+ 'chrony.skew': {
+ info: 'The estimated error bound on the frequency.',
+ height: 0.5,
+ colors: NETDATA.colors[5]
+ },
+
+ 'couchdb.active_tasks': {
+ info: 'Active tasks running on this CouchDB <b>cluster</b>. Four types of tasks currently exist: indexer (view building), replication, database compaction and view compaction.'
+ },
+
+ 'couchdb.replicator_jobs': {
+ info: 'Detailed breakdown of any replication jobs in progress on this node. For more information, see the <a href="http://docs.couchdb.org/en/latest/replication/replicator.html">replicator documentation</a>.'
+ },
+
+ 'couchdb.open_files': {
+ info: 'Count of all files held open by CouchDB. If this value seems pegged at 1024 or 4096, your server process is probably hitting the open file handle limit and <a href="http://docs.couchdb.org/en/latest/maintenance/performance.html#pam-and-ulimit">needs to be increased.</a>'
+ },
+
+ 'btrfs.disk': {
+ info: 'Physical disk usage of BTRFS. The disk space reported here is the raw physical disk space assigned to the BTRFS volume (i.e. <b>before any RAID levels</b>). BTRFS uses a two-stage allocator, first allocating large regions of disk space for one type of block (data, metadata, or system), and then using a regular block allocator inside those regions. <code>unallocated</code> is the physical disk space that is not allocated yet and is available to become data, metdata or system on demand. When <code>unallocated</code> is zero, all available disk space has been allocated to a specific function. Healthy volumes should ideally have at least five percent of their total space <code>unallocated</code>. You can keep your volume healthy by running the <code>btrfs balance</code> command on it regularly (check <code>man btrfs-balance</code> for more info). Note that some of the space listed as <code>unallocated</code> may not actually be usable if the volume uses devices of different sizes.',
+ colors: [NETDATA.colors[12]]
+ },
+
+ 'btrfs.data': {
+ info: 'Logical disk usage for BTRFS data. Data chunks are used to store the actual file data (file contents). The disk space reported here is the usable allocation (i.e. after any striping or replication). Healthy volumes should ideally have no more than a few GB of free space reported here persistently. Running <code>btrfs balance</code> can help here.'
+ },
+
+ 'btrfs.metadata': {
+ info: 'Logical disk usage for BTRFS metadata. Metadata chunks store most of the filesystem interal structures, as well as information like directory structure and file names. The disk space reported here is the usable allocation (i.e. after any striping or replication). Healthy volumes should ideally have no more than a few GB of free space reported here persistently. Running <code>btrfs balance</code> can help here.'
+ },
+
+ 'btrfs.system': {
+ info: 'Logical disk usage for BTRFS system. System chunks store information about the allocation of other chunks. The disk space reported here is the usable allocation (i.e. after any striping or replication). The values reported here should be relatively small compared to Data and Metadata, and will scale with the volume size and overall space usage.'
+ },
+
+ // ------------------------------------------------------------------------
+ // RabbitMQ
+
+ // info: the text above the charts
+ // heads: the representation of the chart at the top the subsection (second level menu)
+ // mainheads: the representation of the chart at the top of the section (first level menu)
+ // colors: the dimension colors of the chart (the default colors are appended)
+ // height: the ratio of the chart height relative to the default
+
+ 'rabbitmq.queued_messages': {
+ info: 'Overall total of ready and unacknowledged queued messages. Messages that are delivered immediately are not counted here.'
+ },
+
+ 'rabbitmq.message_rates': {
+ info: 'Overall messaging rates including acknowledgements, delieveries, redeliveries, and publishes.'
+ },
+
+ 'rabbitmq.global_counts': {
+ info: 'Overall totals for channels, consumers, connections, queues and exchanges.'
+ },
+
+ 'rabbitmq.file_descriptors': {
+ info: 'Total number of used filed descriptors. See <code><a href="https://www.rabbitmq.com/production-checklist.html#resource-limits-file-handle-limit" target="_blank">Open File Limits</a></code> for further details.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.sockets': {
+ info: 'Total number of used socket descriptors. Each used socket also counts as a used file descriptor. See <code><a href="https://www.rabbitmq.com/production-checklist.html#resource-limits-file-handle-limit" target="_blank">Open File Limits</a></code> for further details.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.processes': {
+ info: 'Total number of processes running within the Erlang VM. This is not the same as the number of processes running on the host.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.erlang_run_queue': {
+ info: 'Number of Erlang processes the Erlang schedulers have queued to run.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.memory': {
+ info: 'Total amount of memory used by the RabbitMQ. This is a complex statistic that can be further analyzed in the management UI. See <code><a href="https://www.rabbitmq.com/production-checklist.html#resource-limits-ram" target="_blank">Memory</a></code> for further details.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.disk_space': {
+ info: 'Total amount of disk space consumed by the message store(s). See <code><a href="https://www.rabbitmq.com/production-checklist.html#resource-limits-disk-space" target=_"blank">Disk Space Limits</a></code> for further details.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.queue_messages': {
+ info: 'Total amount of messages and their states in this queue.',
+ colors: NETDATA.colors[3]
+ },
+
+ 'rabbitmq.queue_messages_stats': {
+ info: 'Overall messaging rates including acknowledgements, delieveries, redeliveries, and publishes.',
+ colors: NETDATA.colors[3]
+ },
+
+ // ------------------------------------------------------------------------
+ // ntpd
+
+ 'ntpd.sys_offset': {
+ info: 'For hosts without any time critical services an offset of < 100 ms should be acceptable even with high network latencies. For hosts with time critical services an offset of about 0.01 ms or less can be achieved by using peers with low delays and configuring optimal <b>poll exponent</b> values.',
+ colors: NETDATA.colors[4]
+ },
+
+ 'ntpd.sys_jitter': {
+ info: 'The jitter statistics are exponentially-weighted RMS averages. The system jitter is defined in the NTPv4 specification; the clock jitter statistic is computed by the clock discipline module.'
+ },
+
+ 'ntpd.sys_frequency': {
+ info: 'The frequency offset is shown in ppm (parts per million) relative to the frequency of the system. The frequency correction needed for the clock can vary significantly between boots and also due to external influences like temperature or radiation.',
+ colors: NETDATA.colors[2],
+ height: 0.6
+ },
+
+ 'ntpd.sys_wander': {
+ info: 'The wander statistics are exponentially-weighted RMS averages.',
+ colors: NETDATA.colors[3],
+ height: 0.6
+ },
+
+ 'ntpd.sys_rootdelay': {
+ info: 'The rootdelay is the round-trip delay to the primary reference clock, similar to the delay shown by the <code>ping</code> command. A lower delay should result in a lower clock offset.',
+ colors: NETDATA.colors[1]
+ },
+
+ 'ntpd.sys_stratum': {
+ info: 'The distance in "hops" to the primary reference clock',
+ colors: NETDATA.colors[5],
+ height: 0.3
+ },
+
+ 'ntpd.sys_tc': {
+ info: 'Time constants and poll intervals are expressed as exponents of 2. The default poll exponent of 6 corresponds to a poll interval of 64 s. For typical Internet paths, the optimum poll interval is about 64 s. For fast LANs with modern computers, a poll exponent of 4 (16 s) is appropriate. The <a href="http://doc.ntp.org/current-stable/poll.html">poll process</a> sends NTP packets at intervals determined by the clock discipline algorithm.',
+ height: 0.5
+ },
+
+ 'ntpd.sys_precision': {
+ colors: NETDATA.colors[6],
+ height: 0.2
+ },
+
+ 'ntpd.peer_offset': {
+ info: 'The offset of the peer clock relative to the system clock in milliseconds. Smaller values here weight peers more heavily for selection after the initial synchronization of the local clock. For a system providing time service to other systems, these should be as low as possible.'
+ },
+
+ 'ntpd.peer_delay': {
+ info: 'The round-trip time (RTT) for communication with the peer, similar to the delay shown by the <code>ping</code> command. Not as critical as either the offset or jitter, but still factored into the selection algorithm (because as a general rule, lower delay means more accurate time). In most cases, it should be below 100ms.'
+ },
+
+ 'ntpd.peer_dispersion': {
+ info: 'This is a measure of the estimated error between the peer and the local system. Lower values here are better.'
+ },
+
+ 'ntpd.peer_jitter': {
+ info: 'This is essentially a remote estimate of the peer\'s <code>system_jitter</code> value. Lower values here weight highly in favor of peer selection, and this is a good indicator of overall quality of a given time server (good servers will have values not exceeding single digit milliseconds here, with high quality stratum one servers regularly having sub-millisecond jitter).'
+ },
+
+ 'ntpd.peer_xleave': {
+ info: 'This variable is used in interleaved mode (used only in NTP symmetric and broadcast modes). See <a href="http://doc.ntp.org/current-stable/xleave.html">NTP Interleaved Modes</a>.'
+ },
+
+ 'ntpd.peer_rootdelay': {
+ info: 'For a stratum 1 server, this is the access latency for the reference clock. For lower stratum servers, it is the sum of the <code>peer_delay</code> and <code>peer_rootdelay</code> for the system they are syncing off of. Similarly to <code>peer_delay</code>, lower values here are technically better, but have limited influence in peer selection.'
+ },
+
+ 'ntpd.peer_rootdisp': {
+ info: 'Is the same as <code>peer_rootdelay</code>, but measures accumulated <code>peer_dispersion</code> instead of accumulated <code>peer_delay</code>.'
+ },
+
+ 'ntpd.peer_hmode': {
+ info: 'The <code>peer_hmode</code> and <code>peer_pmode</code> variables give info about what mode the packets being sent to and received from a given peer are. Mode 1 is symmetric active (both the local system and the remote peer have each other declared as peers in <code>/etc/ntp.conf</code>), Mode 2 is symmetric passive (only one side has the other declared as a peer), Mode 3 is client, Mode 4 is server, and Mode 5 is broadcast (also used for multicast and manycast operation).',
+ height: 0.2
+ },
+
+ 'ntpd.peer_pmode': {
+ height: 0.2
+ },
+
+ 'ntpd.peer_hpoll': {
+ info: 'The <code>peer_hpoll</code> and <code>peer_ppoll</code> variables are log2 representations of the polling interval in seconds.',
+ height: 0.5
+ },
+
+ 'ntpd.peer_ppoll': {
+ height: 0.5
+ },
+
+ 'ntpd.peer_precision': {
+ height: 0.2
+ },
+
+ 'spigotmc.tps': {
+ info: 'The running 1, 5, and 15 minute average number of server ticks per second. An idealized server will show 20.0 for all values, but in practice this almost never happens. Typical servers should show approximately 19.98-20.0 here. Lower values indicate progressively more server-side lag (and thus that you need better hardware for your server or a lower user limit). For every 0.05 ticks below 20, redstone clocks will lag behind by approximately 0.25%. Values below approximately 19.50 may interfere with complex free-running redstone circuits and will noticeably slow down growth.'
+ },
+
+ 'spigotmc.users': {
+ info: 'The number of currently connect users on the monitored Spigot server.'
+ },
+
+ 'boinc.tasks': {
+ info: 'The total number of tasks and the number of active tasks. Active tasks are those which are either currently being processed, or are partialy processed but suspended.'
+ },
+
+ 'boinc.states': {
+ info: 'Counts of tasks in each task state. The normal sequence of states is <code>New</code>, <code>Downloading</code>, <code>Ready to Run</code>, <code>Uploading</code>, <code>Uploaded</code>. Tasks which are marked <code>Ready to Run</code> may be actively running, or may be waiting to be scheduled. <code>Compute Errors</code> are tasks which failed for some reason during execution. <code>Aborted</code> tasks were manually cancelled, and will not be processed. <code>Failed Uploads</code> are otherwise finished tasks which failed to upload to the server, and usually indicate networking issues.'
+ },
+
+ 'boinc.sched': {
+ info: 'Counts of active tasks in each scheduling state. <code>Scheduled</code> tasks are the ones which will run if the system is permitted to process tasks. <code>Preempted</code> tasks are on standby, and will run if a <code>Scheduled</code> task stops running for some reason. <code>Uninitialized</code> tasks should never be present, and indicate tha the scheduler has not tried to schedule them yet.'
+ },
+
+ 'boinc.process': {
+ info: 'Counts of active tasks in each process state. <code>Executing</code> tasks are running right now. <code>Suspended</code> tasks have an associated process, but are not currently running (either because the system isn\'t processing any tasks right now, or because they have been preempted by higher priority tasks). <code>Quit</code> tasks are exiting gracefully. <code>Aborted</code> tasks exceeded some resource limit, and are being shut down. <code>Copy Pending</code> tasks are waiting on a background file transfer to finish. <code>Uninitialized</code> tasks do not have an associated process yet.'
+ },
+
+ 'w1sensor.temp': {
+ info: 'Temperature derived from 1-Wire temperature sensors.'
+ },
+
+ 'logind.sessions': {
+ info: 'Shows the number of active sessions of each type tracked by logind.'
+ },
+
+ 'logind.users': {
+ info: 'Shows the number of active users of each type tracked by logind.'
+ },
+
+ 'logind.seats': {
+ info: 'Shows the number of active seats tracked by logind. Each seat corresponds to a combination of a display device and input device providing a physical presence for the system.'
+ },
+
+ // ------------------------------------------------------------------------
+ // ProxySQL
+
+ 'proxysql.pool_status': {
+ info: 'The status of the backend servers. ' +
+ '<code>1=ONLINE</code> backend server is fully operational, ' +
+ '<code>2=SHUNNED</code> backend sever is temporarily taken out of use because of either too many connection errors in a time that was too short, or replication lag exceeded the allowed threshold, ' +
+ '<code>3=OFFLINE_SOFT</code> when a server is put into OFFLINE_SOFT mode, new incoming connections aren\'t accepted anymore, while the existing connections are kept until they became inactive. In other words, connections are kept in use until the current transaction is completed. This allows to gracefully detach a backend, ' +
+ '<code>4=OFFLINE_HARD</code> when a server is put into OFFLINE_HARD mode, the existing connections are dropped, while new incoming connections aren\'t accepted either. This is equivalent to deleting the server from a hostgroup, or temporarily taking it out of the hostgroup for maintenance work, ' +
+ '<code>-1</code> Unknown status.'
+ },
+
+ 'proxysql.pool_net': {
+ info: 'The amount of data sent to/received from the backend ' +
+ '(This does not include metadata (packets\' headers, OK/ERR packets, fields\' description, etc).'
+ },
+
+ 'proxysql.pool_overall_net': {
+ info: 'The amount of data sent to/received from the all backends ' +
+ '(This does not include metadata (packets\' headers, OK/ERR packets, fields\' description, etc).'
+ },
+
+ 'proxysql.questions': {
+ info: '<code>questions</code> total number of queries sent from frontends, ' +
+ '<code>slow_queries</code> number of queries that ran for longer than the threshold in milliseconds defined in global variable <code>mysql-long_query_time</code>. '
+ },
+
+ 'proxysql.connections': {
+ info: '<code>aborted</code> number of frontend connections aborted due to invalid credential or max_connections reached, ' +
+ '<code>connected</code> number of frontend connections currently connected, ' +
+ '<code>created</code> number of frontend connections created, ' +
+ '<code>non_idle</code> number of frontend connections that are not currently idle. '
+ },
+
+ 'proxysql.pool_latency': {
+ info: 'The currently ping time in microseconds, as reported from Monitor.'
+ },
+
+ 'proxysql.queries': {
+ info: 'The number of queries routed towards this particular backend server.'
+ },
+
+ 'proxysql.pool_used_connections': {
+ info: 'The number of connections are currently used by ProxySQL for sending queries to the backend server.'
+ },
+
+ 'proxysql.pool_free_connections': {
+ info: 'The number of connections are currently free. They are kept open in order to minimize the time cost of sending a query to the backend server.'
+ },
+
+ 'proxysql.pool_ok_connections': {
+ info: 'The number of connections were established successfully.'
+ },
+
+ 'proxysql.pool_error_connections': {
+ info: 'The number of connections weren\'t established successfully.'
+ },
+
+ 'proxysql.commands_count': {
+ info: 'The total number of commands of that type executed'
+ },
+
+ 'proxysql.commands_duration': {
+ info: 'The total time spent executing commands of that type, in ms'
+ },
+
+ // ------------------------------------------------------------------------
+ // Power Supplies
+
+ 'powersupply.capacity': {
+ info: undefined
+ },
+
+ 'powersupply.charge': {
+ info: undefined
+ },
+
+ 'powersupply.energy': {
+ info: undefined
+ },
+
+ 'powersupply.voltage': {
+ info: undefined
+ },
+
+ // ------------------------------------------------------------------------
+ // VMware vSphere
+
+ // Host specific
+ 'vsphere.host_mem_usage_percentage': {
+ info: 'Percentage of used machine memory: <code>consumed</code> / <code>machine-memory-size</code>.'
+ },
+
+ 'vsphere.host_mem_usage': {
+ info:
+ '<code>granted</code> is amount of machine memory that is mapped for a host, ' +
+ 'it equals sum of all granted metrics for all powered-on virtual machines, plus machine memory for vSphere services on the host. ' +
+ '<code>consumed</code> is amount of machine memory used on the host, it includes memory used by the Service Console, the VMkernel, vSphere services, plus the total consumed metrics for all running virtual machines. ' +
+ '<code>consumed</code> = <code>total host memory</code> - <code>free host memory</code>.' +
+ '<code>active</code> is sum of all active metrics for all powered-on virtual machines plus vSphere services (such as COS, vpxa) on the host.' +
+ '<code>shared</code> is sum of all shared metrics for all powered-on virtual machines, plus amount for vSphere services on the host. ' +
+ '<code>sharedcommon</code> is amount of machine memory that is shared by all powered-on virtual machines and vSphere services on the host. ' +
+ '<code>shared</code> - <code>sharedcommon</code> = machine memory (host memory) savings (KB). ' +
+ 'For details see <a href="https://docs.vmware.com/en/VMware-vSphere/6.5/com.vmware.vsphere.resmgmt.doc/GUID-BFDC988B-F53D-4E97-9793-A002445AFAE1.html">Measuring and Differentiating Types of Memory Usage</a> and ' +
+ '<a href="https://www.vmware.com/support/developer/converter-sdk/conv51_apireference/memory_counters.html">Memory Counters</a> articles.'
+ },
+
+ 'vsphere.host_mem_swap_rate': {
+ info:
+ 'This statistic refers to VMkernel swapping and not to guest OS swapping. ' +
+ '<code>in</code> is sum of <code>swapinRate</code> values for all powered-on virtual machines on the host.' +
+ '<code>swapinRate</code> is rate at which VMKernel reads data into machine memory from the swap file. ' +
+ '<code>out</code> is sum of <code>swapoutRate</code> values for all powered-on virtual machines on the host.' +
+ '<code>swapoutRate</code> is rate at which VMkernel writes to the virtual machine’s swap file from machine memory.'
+ },
+
+ // VM specific
+ 'vsphere.vm_mem_usage_percentage': {
+ info: 'Percentage of used virtual machine “physical” memory: <code>actvive</code> / <code>virtual machine configured size</code>.'
+ },
+
+ 'vsphere.vm_mem_usage': {
+ info:
+ '<code>granted</code> is amount of guest “physical” memory that is mapped to machine memory, it includes <code>shared</code> memory amount. ' +
+ '<code>consumed</code> is amount of guest “physical” memory consumed by the virtual machine for guest memory, ' +
+ '<code>consumed</code> = <code>granted</code> - <code>memory saved due to memory sharing</code>. ' +
+ '<code>active</code> is amount of memory that is actively used, as estimated by VMkernel based on recently touched memory pages. ' +
+ '<code>shared</code> is amount of guest “physical” memory shared with other virtual machines (through the VMkernel’s transparent page-sharing mechanism, a RAM de-duplication technique). ' +
+ 'For details see <a href="https://docs.vmware.com/en/VMware-vSphere/6.5/com.vmware.vsphere.resmgmt.doc/GUID-BFDC988B-F53D-4E97-9793-A002445AFAE1.html">Measuring and Differentiating Types of Memory Usage</a> and ' +
+ '<a href="https://www.vmware.com/support/developer/converter-sdk/conv51_apireference/memory_counters.html">Memory Counters</a> articles.'
+
+ },
+
+ 'vsphere.vm_mem_swap_rate': {
+ info:
+ 'This statistic refers to VMkernel swapping and not to guest OS swapping. ' +
+ '<code>in</code> is rate at which VMKernel reads data into machine memory from the swap file. ' +
+ '<code>out</code> is rate at which VMkernel writes to the virtual machine’s swap file from machine memory.'
+ },
+
+ 'vsphere.vm_mem_swap': {
+ info:
+ 'This statistic refers to VMkernel swapping and not to guest OS swapping. ' +
+ '<code>swapped</code> is amount of guest physical memory swapped out to the virtual machine\'s swap file by the VMkernel. ' +
+ 'Swapped memory stays on disk until the virtual machine needs it.'
+ },
+
+ // Common
+ 'vsphere.cpu_usage_total': {
+ info: 'Summary CPU usage statistics across all CPUs/cores.'
+ },
+
+ 'vsphere.net_bandwidth_total': {
+ info: 'Summary receive/transmit statistics across all network interfaces.'
+ },
+
+ 'vsphere.net_packets_total': {
+ info: 'Summary receive/transmit statistics across all network interfaces.'
+ },
+
+ 'vsphere.net_errors_total': {
+ info: 'Summary receive/transmit statistics across all network interfaces.'
+ },
+
+ 'vsphere.net_drops_total': {
+ info: 'Summary receive/transmit statistics across all network interfaces.'
+ },
+
+ 'vsphere.disk_usage_total': {
+ info: 'Summary read/write statistics across all disks.'
+ },
+
+ 'vsphere.disk_max_latency': {
+ info: '<code>latency</code> is highest latency value across all disks.'
+ },
+
+ 'vsphere.overall_status': {
+ info: '<code>0</code> is unknown, <code>1</code> is OK, <code>2</code> is might have a problem, <code>3</code> is definitely has a problem.'
+ },
+
+ // ------------------------------------------------------------------------
+ // VCSA
+ 'vcsa.system_health': {
+ info:
+ '<code>-1</code>: unknown; ' +
+ '<code>0</code>: all components are healthy; ' +
+ '<code>1</code>: one or more components might become overloaded soon; ' +
+ '<code>2</code>: one or more components in the appliance might be degraded; ' +
+ '<code>3</code>: one or more components might be in an unusable status and the appliance might become unresponsive soon; ' +
+ '<code>4</code>: no health data is available.'
+ },
+
+ 'vcsa.components_health': {
+ info:
+ '<code>-1</code>: unknown; ' +
+ '<code>0</code>: healthy; ' +
+ '<code>1</code>: healthy, but may have some problems; ' +
+ '<code>2</code>: degraded, and may have serious problems; ' +
+ '<code>3</code>: unavailable, or will stop functioning soon; ' +
+ '<code>4</code>: no health data is available.'
+ },
+
+ 'vcsa.software_updates_health': {
+ info:
+ '<code>softwarepackages</code> represents information on available software updates available in the remote vSphere Update Manager repository.<br>' +
+ '<code>-1</code>: unknown; ' +
+ '<code>0</code>: no updates available; ' +
+ '<code>2</code>: non-security updates are available; ' +
+ '<code>3</code>: security updates are available; ' +
+ '<code>4</code>: an error retrieving information on software updates.'
+ },
+
+ // ------------------------------------------------------------------------
+ // Zookeeper
+
+ 'zookeeper.server_state': {
+ info:
+ '<code>0</code>: unknown, ' +
+ '<code>1</code>: leader, ' +
+ '<code>2</code>: follower, ' +
+ '<code>3</code>: observer, ' +
+ '<code>4</code>: standalone.'
+ },
+
+ // ------------------------------------------------------------------------
+ // Squidlog
+
+ 'squidlog.requests': {
+ info: 'Total number of requests (log lines read). It includes <code>unmatched</code>.'
+ },
+
+ 'squidlog.excluded_requests': {
+ info: '<code>unmatched</code> counts the lines in the log file that are not matched by the plugin parser (<a href="https://github.com/netdata/netdata/issues/new?title=squidlog%20reports%20unmatched%20lines&body=squidlog%20plugin%20reports%20unmatched%20lines.%0A%0AThis%20is%20my%20log:%0A%0A%60%60%60txt%0A%0Aplease%20paste%20your%20squid%20server%20log%20here%0A%0A%60%60%60" target="_blank">let us know</a> if you have any unmatched).'
+ },
+
+ 'squidlog.type_requests': {
+ info: 'Requests by response type:<br>' +
+ '<ul>' +
+ ' <li><code>success</code> includes 1xx, 2xx, 0, 304, 401.</li>' +
+ ' <li><code>error</code> includes 5xx and 6xx.</li>' +
+ ' <li><code>redirect</code> includes 3xx except 304.</li>' +
+ ' <li><code>bad</code> includes 4xx except 401.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.http_status_code_class_responses': {
+ info: 'The HTTP response status code classes. According to <a href="https://tools.ietf.org/html/rfc7231" target="_blank">rfc7231</a>:<br>' +
+ ' <li><code>1xx</code> is informational responses.</li>' +
+ ' <li><code>2xx</code> is successful responses.</li>' +
+ ' <li><code>3xx</code> is redirects.</li>' +
+ ' <li><code>4xx</code> is bad requests.</li>' +
+ ' <li><code>5xx</code> is internal server errors.</li>' +
+ ' </ul>' +
+ 'Squid also uses <code>0</code> for a result code being unavailable, and <code>6xx</code> to signal an invalid header, a proxy error.'
+ },
+
+ 'squidlog.http_status_code_responses': {
+ info: 'Number of responses for each http response status code individually.'
+ },
+
+ 'squidlog.uniq_clients': {
+ info: 'Unique clients (requesting instances), within each data collection iteration. If data collection is <b>per second</b>, this chart shows <b>unique clients per second</b>.'
+ },
+
+ 'squidlog.bandwidth': {
+ info: 'The size is the amount of data delivered to the clients. Mind that this does not constitute the net object size, as headers are also counted. ' +
+ 'Also, failed requests may deliver an error page, the size of which is also logged here.'
+ },
+
+ 'squidlog.response_time': {
+ info: 'The elapsed time considers how many milliseconds the transaction busied the cache. It differs in interpretation between TCP and UDP:' +
+ '<ul>' +
+ ' <li><code>TCP</code> this is basically the time from having received the request to when Squid finishes sending the last byte of the response.</li>' +
+ ' <li><code>UDP</code> this is the time between scheduling a reply and actually sending it.</li>' +
+ ' </ul>' +
+ 'Please note that <b>the entries are logged after the reply finished being sent</b>, not during the lifetime of the transaction.'
+ },
+
+ 'squidlog.cache_result_code_requests': {
+ info: 'The Squid result code is composed of several tags (separated by underscore characters) which describe the response sent to the client. ' +
+ 'Check the <a href="https://wiki.squid-cache.org/SquidFaq/SquidLogs#Squid_result_codes">squid documentation</a> about them.'
+ },
+
+ 'squidlog.cache_result_code_transport_tag_requests': {
+ info: 'These tags are always present and describe delivery method.<br>' +
+ '<ul>' +
+ ' <li><code>TCP</code> requests on the HTTP port (usually 3128).</li>' +
+ ' <li><code>UDP</code> requests on the ICP port (usually 3130) or HTCP port (usually 4128).</li>' +
+ ' <li><code>NONE</code> Squid delivered an unusual response or no response at all. Seen with cachemgr requests and errors, usually when the transaction fails before being classified into one of the above outcomes. Also seen with responses to CONNECT requests.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.cache_result_code_handling_tag_requests': {
+ info: 'These tags are optional and describe why the particular handling was performed or where the request came from.<br>' +
+ '<ul>' +
+ ' <li><code>CF</code> at least one request in this transaction was collapsed. See <a href="http://www.squid-cache.org/Doc/config/collapsed_forwarding/" target="_blank">collapsed_forwarding</a> for more details about request collapsing.</li>' +
+ ' <li><code>CLIENT</code> usually seen with client issued a "no-cache", or analogous cache control command along with the request. Thus, the cache has to validate the object.</li>' +
+ ' <li><code>IMS</code> the client sent a revalidation (conditional) request.</li>' +
+ ' <li><code>ASYNC</code> the request was generated internally by Squid. Usually this is background fetches for cache information exchanges, background revalidation from <i>stale-while-revalidate</i> cache controls, or ESI sub-objects being loaded.</li>' +
+ ' <li><code>SWAPFAIL</code> the object was believed to be in the cache, but could not be accessed. A new copy was requested from the server.</li>' +
+ ' <li><code>REFRESH</code> a revalidation (conditional) request was sent to the server.</li>' +
+ ' <li><code>SHARED</code> this request was combined with an existing transaction by collapsed forwarding.</li>' +
+ ' <li><code>REPLY</code> the HTTP reply from server or peer. Usually seen on <code>DENIED</code> due to <a href="http://www.squid-cache.org/Doc/config/http_reply_access/" target="_blank">http_reply_access</a> ACLs preventing delivery of servers response object to the client.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.cache_code_object_tag_requests': {
+ info: 'These tags are optional and describe what type of object was produced.<br>' +
+ '<ul>' +
+ ' <li><code>NEGATIVE</code> only seen on HIT responses, indicating the response was a cached error response. e.g. <b>404 not found</b>.</li>' +
+ ' <li><code>STALE</code> the object was cached and served stale. This is usually caused by <i>stale-while-revalidate</i> or <i>stale-if-error</i> cache controls.</li>' +
+ ' <li><code>OFFLINE</code> the requested object was retrieved from the cache during <a href="http://www.squid-cache.org/Doc/config/offline_mode/" target="_blank">offline_mode</a>. The offline mode never validates any object.</li>' +
+ ' <li><code>INVALID</code> an invalid request was received. An error response was delivered indicating what the problem was.</li>' +
+ ' <li><code>FAILED</code> only seen on <code>REFRESH</code> to indicate the revalidation request failed. The response object may be the server provided network error or the stale object which was being revalidated depending on stale-if-error cache control.</li>' +
+ ' <li><code>MODIFIED</code> only seen on <code>REFRESH</code> responses to indicate revalidation produced a new modified object.</li>' +
+ ' <li><code>UNMODIFIED</code> only seen on <code>REFRESH</code> responses to indicate revalidation produced a 304 (Not Modified) status. The client gets either a full 200 (OK), a 304 (Not Modified), or (in theory) another response, depending on the client request and other details.</li>' +
+ ' <li><code>REDIRECT</code> Squid generated an HTTP redirect response to this request.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.cache_code_load_source_tag_requests': {
+ info: 'These tags are optional and describe whether the response was loaded from cache, network, or otherwise.<br>' +
+ '<ul>' +
+ ' <li><code>HIT</code> the response object delivered was the local cache object.</li>' +
+ ' <li><code>MEM</code> the response object came from memory cache, avoiding disk accesses. Only seen on HIT responses.</li>' +
+ ' <li><code>MISS</code> the response object delivered was the network response object.</li>' +
+ ' <li><code>DENIED</code> the request was denied by access controls.</li>' +
+ ' <li><code>NOFETCH</code> an ICP specific type, indicating service is alive, but not to be used for this request.</li>' +
+ ' <li><code>TUNNEL</code> a binary tunnel was established for this transaction.</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.cache_code_error_tag_requests': {
+ info: 'These tags are optional and describe some error conditions which occurred during response delivery.<br>' +
+ '<ul>' +
+ ' <li><code>ABORTED</code> the response was not completed due to the connection being aborted (usually by the client).</li>' +
+ ' <li><code>TIMEOUT</code> the response was not completed due to a connection timeout.</li>' +
+ ' <li><code>IGNORED</code> while refreshing a previously cached response A, Squid got a response B that was older than A (as determined by the Date header field). Squid ignored response B (and attempted to use A instead).</li>' +
+ ' </ul>'
+ },
+
+ 'squidlog.http_method_requests': {
+ info: 'The request method to obtain an object. Please refer to section <a href="https://wiki.squid-cache.org/SquidFaq/SquidLogs#Request_methods">request-methods</a> for available methods and their description.'
+ },
+
+ 'squidlog.hier_code_requests': {
+ info: 'A code that explains how the request was handled, e.g. by forwarding it to a peer, or going straight to the source. ' +
+ 'Any hierarchy tag may be prefixed with <code>TIMEOUT_</code>, if the timeout occurs waiting for all ICP replies to return from the neighbours. The timeout is either dynamic, if the <a href="http://www.squid-cache.org/Doc/config/icp_query_timeout/" target="_blank">icp_query_timeout</a> was not set, or the time configured there has run up. ' +
+ 'Refer to <a href="https://wiki.squid-cache.org/SquidFaq/SquidLogs#Hierarchy_Codes" target="_blank">Hierarchy Codes</a> for details on hierarchy codes.'
+ },
+
+ 'squidlog.server_address_forwarded_requests': {
+ info: 'The IP address or hostname where the request (if a miss) was forwarded. For requests sent to origin servers, this is the origin server\'s IP address. ' +
+ 'For requests sent to a neighbor cache, this is the neighbor\'s hostname. NOTE: older versions of Squid would put the origin server hostname here.'
+ },
+
+ 'squidlog.mime_type_requests': {
+ info: 'The content type of the object as seen in the HTTP reply header. Please note that ICP exchanges usually don\'t have any content type.'
+ },
+
+ // ------------------------------------------------------------------------
+ // CockroachDB
+
+ 'cockroachdb.process_cpu_time_combined_percentage': {
+ info: 'Current combined cpu utilization, calculated as <code>(user+system)/num of logical cpus</code>.'
+ },
+
+ 'cockroachdb.host_disk_bandwidth': {
+ info: 'Summary disk bandwidth statistics across all system host disks.'
+ },
+
+ 'cockroachdb.host_disk_operations': {
+ info: 'Summary disk operations statistics across all system host disks.'
+ },
+
+ 'cockroachdb.host_disk_iops_in_progress': {
+ info: 'Summary disk iops in progress statistics across all system host disks.'
+ },
+
+ 'cockroachdb.host_network_bandwidth': {
+ info: 'Summary network bandwidth statistics across all system host network interfaces.'
+ },
+
+ 'cockroachdb.host_network_packets': {
+ info: 'Summary network packets statistics across all system host network interfaces.'
+ },
+
+ 'cockroachdb.live_nodes': {
+ info: 'Will be <code>0</code> if this node is not itself live.'
+ },
+
+ 'cockroachdb.total_storage_capacity': {
+ info: 'Entire disk capacity. It includes non-CR data, CR data, and empty space.'
+ },
+
+ 'cockroachdb.storage_capacity_usability': {
+ info: '<code>usable</code> is sum of empty space and CR data, <code>unusable</code> is space used by non-CR data.'
+ },
+
+ 'cockroachdb.storage_usable_capacity': {
+ info: 'Breakdown of <code>usable</code> space.'
+ },
+
+ 'cockroachdb.storage_used_capacity_percentage': {
+ info: '<code>total</code> is % of <b>total</b> space used, <code>usable</code> is % of <b>usable</b> space used.'
+ },
+
+ 'cockroachdb.sql_bandwidth': {
+ info: 'The total amount of SQL client network traffic.'
+ },
+
+ 'cockroachdb.sql_errors': {
+ info: '<code>statement</code> is statements resulting in a planning or runtime error, ' +
+ '<code>transaction</code> is SQL transactions abort errors.'
+ },
+
+ 'cockroachdb.sql_started_ddl_statements': {
+ info: 'The amount of <b>started</b> DDL (Data Definition Language) statements. ' +
+ 'This type means database schema changes. ' +
+ 'It includes <code>CREATE</code>, <code>ALTER</code>, <code>DROP</code>, <code>RENAME</code>, <code>TRUNCATE</code> and <code>COMMENT</code> statements.'
+ },
+
+ 'cockroachdb.sql_executed_ddl_statements': {
+ info: 'The amount of <b>executed</b> DDL (Data Definition Language) statements. ' +
+ 'This type means database schema changes. ' +
+ 'It includes <code>CREATE</code>, <code>ALTER</code>, <code>DROP</code>, <code>RENAME</code>, <code>TRUNCATE</code> and <code>COMMENT</code> statements.'
+ },
+
+ 'cockroachdb.sql_started_dml_statements': {
+ info: 'The amount of <b>started</b> DML (Data Manipulation Language) statements.'
+ },
+
+ 'cockroachdb.sql_executed_dml_statements': {
+ info: 'The amount of <b>executed</b> DML (Data Manipulation Language) statements.'
+ },
+
+ 'cockroachdb.sql_started_tcl_statements': {
+ info: 'The amount of <b>started</b> TCL (Transaction Control Language) statements.'
+ },
+
+ 'cockroachdb.sql_executed_tcl_statements': {
+ info: 'The amount of <b>executed</b> TCL (Transaction Control Language) statements.'
+ },
+
+ 'cockroachdb.live_bytes': {
+ info: 'The amount of live data used by both applications and the CockroachDB system.'
+ },
+
+ 'cockroachdb.kv_transactions': {
+ info: 'KV transactions breakdown:<br>' +
+ '<ul>' +
+ ' <li><code>committed</code> committed KV transactions (including 1PC).</li>' +
+ ' <li><code>fast-path_committed</code> KV transaction on-phase commit attempts.</li>' +
+ ' <li><code>aborted</code> aborted KV transactions.</li>' +
+ ' </ul>'
+ },
+
+ 'cockroachdb.kv_transaction_restarts': {
+ info: 'KV transactions restarts breakdown:<br>' +
+ '<ul>' +
+ ' <li><code>write too old</code> restarts due to a concurrent writer committing first.</li>' +
+ ' <li><code>write too old (multiple)</code> restarts due to multiple concurrent writers committing first.</li>' +
+ ' <li><code>forwarded timestamp (iso=serializable)</code> restarts due to a forwarded commit timestamp and isolation=SERIALIZABLE".</li>' +
+ ' <li><code>possible replay</code> restarts due to possible replays of command batches at the storage layer.</li>' +
+ ' <li><code>async consensus failure</code> restarts due to async consensus writes that failed to leave intents.</li>' +
+ ' <li><code>read within uncertainty interval</code> restarts due to reading a new value within the uncertainty interval.</li>' +
+ ' <li><code>aborted</code> restarts due to an abort by a concurrent transaction (usually due to deadlock).</li>' +
+ ' <li><code>push failure</code> restarts due to a transaction push failure.</li>' +
+ ' <li><code>unknown</code> restarts due to a unknown reasons.</li>' +
+ ' </ul>'
+ },
+
+ 'cockroachdb.ranges': {
+ info: 'CockroachDB stores all user data (tables, indexes, etc.) and almost all system data in a giant sorted map of key-value pairs. ' +
+ 'This keyspace is divided into "ranges", contiguous chunks of the keyspace, so that every key can always be found in a single range.'
+ },
+
+ 'cockroachdb.ranges_replication_problem': {
+ info: 'Ranges with not optimal number of replicas:<br>' +
+ '<ul>' +
+ ' <li><code>unavailable</code> ranges with fewer live replicas than needed for quorum.</li>' +
+ ' <li><code>under replicated</code> ranges with fewer live replicas than the replication target.</li>' +
+ ' <li><code>over replicated</code> ranges with more live replicas than the replication target.</li>' +
+ ' </ul>'
+ },
+
+ 'cockroachdb.replicas': {
+ info: 'CockroachDB replicates each range (3 times by default) and stores each replica on a different node.'
+ },
+
+ 'cockroachdb.replicas_leaders': {
+ info: 'For each range, one of the replicas is the <code>leader</code> for write requests, <code>not leaseholders</code> is the number of Raft leaders whose range lease is held by another store.'
+ },
+
+ 'cockroachdb.replicas_leaseholders': {
+ info: 'For each range, one of the replicas holds the "range lease". This replica, referred to as the <code>leaseholder</code>, is the one that receives and coordinates all read and write requests for the range.'
+ },
+
+ 'cockroachdb.queue_processing_failures': {
+ info: 'Failed replicas breakdown by queue:<br>' +
+ '<ul>' +
+ ' <li><code>gc</code> replicas which failed processing in the GC queue.</li>' +
+ ' <li><code>replica gc</code> replicas which failed processing in the replica GC queue.</li>' +
+ ' <li><code>replication</code> replicas which failed processing in the replicate queue.</li>' +
+ ' <li><code>split</code> replicas which failed processing in the split queue.</li>' +
+ ' <li><code>consistency</code> replicas which failed processing in the consistency checker queue.</li>' +
+ ' <li><code>raft log</code> replicas which failed processing in the Raft log queue.</li>' +
+ ' <li><code>raft snapshot</code> replicas which failed processing in the Raft repair queue.</li>' +
+ ' <li><code>time series maintenance</code> replicas which failed processing in the time series maintenance queue.</li>' +
+ ' </ul>'
+ },
+
+ 'cockroachdb.rebalancing_queries': {
+ info: 'Number of kv-level requests received per second by the store, averaged over a large time period as used in rebalancing decisions.'
+ },
+
+ 'cockroachdb.rebalancing_writes': {
+ info: 'Number of keys written (i.e. applied by raft) per second to the store, averaged over a large time period as used in rebalancing decisions.'
+ },
+
+ 'cockroachdb.slow_requests': {
+ info: 'Requests that have been stuck for a long time.'
+ },
+
+ 'cockroachdb.timeseries_samples': {
+ info: 'The amount of metric samples written to disk.'
+ },
+
+ 'cockroachdb.timeseries_write_errors': {
+ info: 'The amount of errors encountered while attempting to write metrics to disk.'
+ },
+
+ 'cockroachdb.timeseries_write_bytes': {
+ info: 'Size of metric samples written to disk.'
+ },
+
+ // ------------------------------------------------------------------------
+ // eBPF
+
+ 'ebpf.tcp_functions': {
+ title : 'TCP calls',
+ info: 'Successful or failed calls to functions <code>tcp_sendmsg</code>, <code>tcp_cleanup_rbuf</code> and <code>tcp_close</code>.'
+ },
+
+ 'ebpf.tcp_bandwidth': {
+ title : 'TCP bandwidth',
+ info: 'Bytes sent and received for functions <code>tcp_sendmsg</code> and <code>tcp_cleanup_rbuf</code>. We use <code>tcp_cleanup_rbuf</code> instead <code>tcp_recvmsg</code>, because this last misses <code>tcp_read_sock()</code> traffic and we would also need to have more probes to get the socket and package size.'
+ },
+
+ 'ebpf.tcp_retransmit': {
+ title : 'TCP retransmit',
+ info: 'Number of packets retransmitted for function <code>tcp_retranstmit_skb</code>.'
+ },
+
+ 'ebpf.tcp_error': {
+ title : 'TCP errors',
+ info: 'Failed calls that to functions <code>tcp_sendmsg</code>, <code>tcp_cleanup_rbuf</code> and <code>tcp_close</code>.'
+ },
+
+ 'ebpf.udp_functions': {
+ title : 'UDP calls',
+ info: 'Successful or failed calls to functions <code>udp_sendmsg</code> and <code>udp_recvmsg</code>.'
+ },
+
+ 'ebpf.udp_bandwidth': {
+ title : 'UDP bandwidth',
+ info: 'Bytes sent and received for functions <code>udp_sendmsg</code> and <code>udp_recvmsg</code>.'
+ },
+
+ 'ebpf.file_descriptor': {
+ title : 'File access',
+ info: 'Calls for internal functions on Linux kernel. The open dimension is attached to the kernel internal function <code>do_sys_open</code> ( For kernels newer than <code>5.5.19</code> we add a kprobe to <code>do_sys_openat2</code>. ), which is the common function called from'+
+ ' <a href="https://www.man7.org/linux/man-pages/man2/open.2.html" target="_blank">open(2)</a> ' +
+ ' and <a href="https://www.man7.org/linux/man-pages/man2/openat.2.html" target="_blank">openat(2)</a>. ' +
+ ' The close dimension is attached to the function <code>__close_fd</code> or <code>close_fd</code> according to your kernel version, which is called from system call' +
+ ' <a href="https://www.man7.org/linux/man-pages/man2/close.2.html" target="_blank">close(2)</a>. '
+ },
+
+ 'ebpf.file_error': {
+ title : 'File access error',
+ info: 'Failed calls to the kernel internal function <code>do_sys_open</code> ( For kernels newer than <code>5.5.19</code> we add a kprobe to <code>do_sys_openat2</code>. ), which is the common function called from'+
+ ' <a href="https://www.man7.org/linux/man-pages/man2/open.2.html" target="_blank">open(2)</a> ' +
+ ' and <a href="https://www.man7.org/linux/man-pages/man2/openat.2.html" target="_blank">openat(2)</a>. ' +
+ ' The close dimension is attached to the function <code>__close_fd</code> or <code>close_fd</code> according to your kernel version, which is called from system call' +
+ ' <a href="https://www.man7.org/linux/man-pages/man2/close.2.html" target="_blank">close(2)</a>. '
+ },
+
+ 'ebpf.deleted_objects': {
+ title : 'VFS remove',
+ info: 'This chart does not show all events that remove files from the file system, because file systems can create their own functions to remove files, it shows calls for the function <a href="https://www.kernel.org/doc/htmldocs/filesystems/API-vfs-unlink.html" target="_blank">vfs_unlink</a>. '
+ },
+
+ 'ebpf.io': {
+ title : 'VFS IO',
+ info: 'Successful or failed calls to functions <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a> and <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>. This chart may not show all file system events if it uses other functions to store data on disk.'
+ },
+
+ 'ebpf.io_bytes': {
+ title : 'VFS bytes written',
+ info: 'Total of bytes read or written with success using the functions <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a> and <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>.'
+ },
+
+ 'ebpf.io_error': {
+ title : 'VFS IO error',
+ info: 'Failed calls to functions <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_read</a> and <a href="https://topic.alibabacloud.com/a/kernel-state-file-operation-__-work-information-kernel_8_8_20287135.html" target="_blank">vfs_write</a>.'
+ },
+
+ 'ebpf.process_thread': {
+ title : 'Task creation',
+ info: 'Number of times that either <a href="https://www.ece.uic.edu/~yshi1/linux/lkse/node4.html#SECTION00421000000000000000" target="_blank">do_fork</a>, or <code>kernel_clone</code> if you are running kernel newer than 5.9.16, is called to create a new task, which is the common name used to define process and tasks inside the kernel. Netdata identifies the threads by couting the number of calls for <a href="https://linux.die.net/man/2/clone" target="_blank">sys_clone</a> that has the flag <code>CLONE_THREAD</code> set.'
+ },
+
+ 'ebpf.exit': {
+ title : 'Exit monitoring',
+ info: 'Calls for the functions responsible for closing (<a href="https://www.informit.com/articles/article.aspx?p=370047&seqNum=4" target="_blank">do_exit</a>) and releasing (<a href="https://www.informit.com/articles/article.aspx?p=370047&seqNum=4" target="_blank">release_task</a>) tasks.'
+ },
+
+ 'ebpf.task_error': {
+ title : 'Task error',
+ info: 'Number of errors to create a new process or thread.'
+ },
+
+ 'ebpf.process_status': {
+ title : 'Task status',
+ info: 'Difference between the number of process created and the number of threads created per period(<code>process</code> dimension), it also shows the number of possible zombie process running on system.'
+ },
+
+ // ------------------------------------------------------------------------
+ // ACLK Internal Stats
+ 'netdata.aclk_status': {
+ valueRange: "[0, 1]",
+ info: 'This chart shows if ACLK was online during entirety of the sample duration.'
+ },
+
+ 'netdata.aclk_query_per_second': {
+ info: 'This chart shows how many queries were added for ACLK_query thread to process and how many it was actually able to process.'
+ },
+
+ 'netdata.aclk_latency_mqtt': {
+ info: 'Measures latency between MQTT publish of the message and it\'s PUB_ACK being received'
+ },
+
+ // ------------------------------------------------------------------------
+ // VerneMQ
+
+ 'vernemq.sockets': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="open_sockets"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Connected Clients"'
+ + ' data-units="clients"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="16%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'vernemq.queue_processes': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="queue_processes"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Queues Processes"'
+ + ' data-units="processes"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="16%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'vernemq.queue_messages_in_queues': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="queue_messages_current"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="Messages in the Queues"'
+ + ' data-units="messages"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="16%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'vernemq.queue_messages': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="queue_message_in"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="MQTT Receive Rate"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="queue_message_out"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="MQTT Send Rate"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ ]
+ },
+ 'vernemq.average_scheduler_utilization': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="system_utilization"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Average Scheduler Utilization"'
+ + ' data-units="percentage"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="16%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // Apache Pulsar
+ 'pulsar.messages_rate': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_rate_in"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Publish"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_rate_out"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Dispatch"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ ]
+ },
+ 'pulsar.subscription_msg_rate_redeliver': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_subscription_msg_rate_redeliver"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Redelivered"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'pulsar.subscription_blocked_on_unacked_messages': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_subscription_blocked_on_unacked_messages"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Blocked On Unacked"'
+ + ' data-units="subscriptions"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'pulsar.msg_backlog': {
+ mainheads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="pulsar_msg_backlog"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Messages Backlog"'
+ + ' data-units="messages"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ 'pulsar.namespace_messages_rate': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="publish"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Publish"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[0] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="dispatch"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Dispatch"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[1] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ ]
+ },
+ 'pulsar.namespace_subscription_msg_rate_redeliver': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="redelivered"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Redelivered"'
+ + ' data-units="messages/s"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'pulsar.namespace_subscription_blocked_on_unacked_messages': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="blocked"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Blocked On Unacked"'
+ + ' data-units="subscriptions"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'pulsar.namespace_msg_backlog': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="backlog"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-max-value="100"'
+ + ' data-title="Messages Backlog"'
+ + ' data-units="messages"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="14%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ },
+ ],
+ },
+
+ // ------------------------------------------------------------------------
+ // Nvidia-smi
+
+ 'nvidia_smi.fan_speed': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="speed"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Fan Speed"'
+ + ' data-units="percentage"'
+ + ' data-easypiechart-max-value="100"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'nvidia_smi.temperature': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="temp"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Temperature"'
+ + ' data-units="celsius"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[3] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'nvidia_smi.memory_allocated': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="used"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Used Memory"'
+ + ' data-units="MiB"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[4] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+ 'nvidia_smi.power': {
+ heads: [
+ function (os, id) {
+ void (os);
+ return '<div data-netdata="' + id + '"'
+ + ' data-dimensions="power"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Power Utilization"'
+ + ' data-units="watts"'
+ + ' data-gauge-adjust="width"'
+ + ' data-width="12%"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + NETDATA.colors[2] + '"'
+ + ' data-decimal-digits="2"'
+ + ' role="application"></div>';
+ }
+ ]
+ },
+
+ // ------------------------------------------------------------------------
+ // Supervisor
+
+ 'supervisord.process_state_code': {
+ info: '<a href="http://supervisord.org/subprocess.html#process-states" target="_blank">Process states map</a>: ' +
+ '<code>0</code> - stopped, <code>10</code> - starting, <code>20</code> - running, <code>30</code> - backoff,' +
+ '<code>40</code> - stopping, <code>100</code> - exited, <code>200</code> - fatal, <code>1000</code> - unknown.'
+ },
+};
diff --git a/applications/luci-app-netdata/web/index.html b/applications/luci-app-netdata/web/index.html
new file mode 100755
index 0000000..9de4afb
--- /dev/null
+++ b/applications/luci-app-netdata/web/index.html
@@ -0,0 +1,1339 @@
+<!DOCTYPE html>
+<!-- SPDX-License-Identifier: GPL-3.0-or-later -->
+<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">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="apple-mobile-web-app-capable" content="yes">
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+ <meta name="author" content="costa@tsaousis.gr">
+
+ <link rel="stylesheet" type="text/css" href="main.css?v=5">
+
+ <link rel="icon" href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAP9JREFUeNpiYBgFo+A/w34gpiZ8DzWzAYgNiHGAA5UdgA73g+2gcyhgg/0DGQoweB6IBQYyFCCOGOBQwBMd/xnW09ERDtgcoEBHB+zHFQrz6egIBUasocDAcJ9OxWAhE4YQI8MDILmATg7wZ8QRDfQKhQf4Cie6pAVGPA4AhQKo0BCgZRAw4ZSBpIWJNI6CD4wEKikBaFqgVSgcYMIrzcjwgcahcIGRiPYCLUPBkNhWUwP9akVcoQBpatG4MsLviAIqWj6f3Absfdq2igg7IIEKDVQKEzN5ofAenJCp1I8gJRTug5tfkGIdR1FDniMI+QZUjF8Amn5htOdHCAAEGACE6B0cS6mrEwAAAABJRU5ErkJggg==" />
+
+ <meta property="og:locale" content="en_US" />
+ <meta property="og:url" content="https://my-netdata.io" />
+ <meta property="og:type" content="website" />
+ <meta property="og:site_name" content="netdata"/>
+ <meta property="og:title" content="Get control of your Linux Servers. Simple. Effective. Awesome." />
+ <meta property="og:description" content="Unparalleled insights, in real-time, of everything happening on your Linux systems and applications, with stunning, interactive web dashboards and powerful performance and health alarms." />
+ <meta property="og:image" content="https://cloud.githubusercontent.com/assets/2662304/22945737/e98cd0c6-f2fd-11e6-96f1-5501934b0955.png" />
+ <meta property="og:image:type" content="image/png" />
+ <meta property="fb:app_id" content="1200089276712916" />
+
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:site" content="@linuxnetdata" />
+ <meta name="twitter:title" content="Get control of your Linux Servers. Simple. Effective. Awesome." />
+ <meta name="twitter:description" content="Unparalleled insights, in real-time, of everything happening on your Linux systems and applications, with stunning, interactive web dashboards and powerful performance and health alarms." />
+ <meta name="twitter:image" content="https://cloud.githubusercontent.com/assets/2662304/14092712/93b039ea-f551-11e5-822c-beadbf2b2a2e.gif" />
+
+ <script src="main.js?v20190905-0"></script>
+</head>
+
+<body data-spy="scroll" data-target="#sidebar" data-offset="100">
+ <div id="loadOverlay" class="loadOverlay" style="background-color: #fff; color: #888;">
+ <div style="font-size: 3vh;">
+ You must enable JavaScript in order to use Netdata!<br />
+ You can do this in <a href="https://enable-javascript.com/" target="_blank">your browser settings</a>.
+ </div>
+ </div>
+ <script type="text/javascript">
+ // Cleanup JS warning.
+ document.documentElement.style.overflowY = "scroll";
+
+ // Change the loadOverlay colors ASAP to match the theme.
+ let theme;
+ const hash = document.location.hash;
+ if (hash.includes('theme=slate')) {
+ theme = 'slate';
+ } else if (hash.includes('theme=white')) {
+ theme = 'white';
+ } else {
+ theme = localStorage.getItem('netdataTheme') || 'slate';
+ }
+ const overlayEl = document.getElementById('loadOverlay');
+ overlayEl.innerHTML = 'netdata<br/><div style="font-size: 3vh;">即时效能监控，做正确的事！</div>';
+ overlayEl.style = theme == 'slate' ? "background-color: #272b30; color: #373b40;" : "background-color: #fff; color: #ddd;";
+ </script>
+ <nav class="navbar navbar-default navbar-fixed-top" role="banner">
+ <div class="container">
+ <!-- <nav id="mynetdata_nav" class="collapse navbar-collapse navbar-left" role="navigation" style="padding-right: 20px;">
+ <ul class="nav navbar-nav">
+ <li data-placement="right" style="line-height: 50px; margin-right: 15px" title="Netdata Agent">
+ <img src="images/netdata-logomark.svg" height="32"/>
+ </li>
+ <li class="dropdown" id="myNetdataDropdownParent" title="your other netdata servers" data-toggle="tooltip" data-placement="right">
+ <a href="#" id="hostname" class="dropdown-toggle" data-toggle="dropdown">my-netdata <strong class="caret"></strong></a>
+ <div id="my-netdata-dropdown-content" class="dropdown-menu scrollable-menu inpagemenu">
+ <div class="agent-item" style="white-space: nowrap">
+ <i class="fas fa-hourglass-half"></i>
+ Loading, please wait...
+ <div></div>
+ </div>
+ </div>
+ </li>
+ </ul>
+ </nav> -->
+ <div class="navbar-header">
+ <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <!-- <a href="/" class="navbar-brand" id="1hostname" title="server hostname<br/>click it to reload the dashboard" data-toggle="tooltip" data-placement="bottom">netdata</a> -->
+ <ul class="nav navbar-nav" style="display: inline-block">
+ <li data-placement="right" class="hidden-xs hidden-sm" style="line-height: 50px; margin-right: 15px" title="Netdata Agent">
+ <img src="images/netdata-logomark.svg" height="32"/>
+ </li>
+ <li class="dropdown" id="myNetdataDropdownParent" title="your other netdata servers" data-toggle="tooltip" data-placement="right">
+ <a href="#" id="hostname" class="dropdown-toggle" data-toggle="dropdown">我的 netdata <strong class="caret"></strong></a>
+ <div id="my-netdata-dropdown-content" class="dropdown-menu scrollable-menu inpagemenu">
+ <div class="agent-item" style="white-space: nowrap">
+ <i class="fas fa-hourglass-half"></i>
+ 载入中，请稍候...
+ <div></div>
+ </div>
+ </div>
+ </li>
+ </ul>
+ </div>
+ <nav class="collapse navbar-collapse navbar-right" role="navigation">
+ <ul class="nav navbar-nav">
+ <li id="alarmsButton" title="检查健康状况监控警报与记录" data-toggle="tooltip" data-placement="bottom"><a href="#" class="btn" data-toggle="modal" data-target="#alarmsModal"><i class="fas fa-bell"></i> <span class="hidden-sm hidden-md">警报 </span><span id="alarms_count_badge" class="badge"></span></a></li>
+ <li title="变更仪表板设定" data-toggle="tooltip" data-placement="bottom"><a href="#" class="btn" data-toggle="modal" data-target="#optionsModal"><i class="fas fa-cog"></i> <span class="hidden-sm hidden-md">设定</span></a></li>
+ <li title="检查 netdata 更新<br/>您应随时保持 netdata 为最新版本" data-toggle="tooltip" data-placement="bottom" class="hidden-sm" id="updateButton"><a href="#" class="btn" data-toggle="modal" data-target="#updateModal"><i class="fas fa-cloud-download-alt"></i> <span class="hidden-sm hidden-md">更新 </span><span id="update_badge" class="badge"></span></a></li>
+ <li title="到 netdata 在 github 上的 wiki<br/>记得 <b>给 netdata 一个 <i class="fas fa-star"></i></b> !" data-toggle="tooltip" data-placement="bottom" class="hidden-xs hidden-sm hidden-md"><a href="https://github.com/netdata/netdata" class="btn" target="_blank"><i class="fab fa-github"></i></a></li>
+ <li title="在 twitter 上跟随 netdata" data-toggle="tooltip" data-placement="bottom" class="hidden-xs hidden-sm hidden-md"><a href="https://twitter.com/linuxnetdata" class="btn" target="_blank"><i class="fab fa-twitter"></i></a></li>
+ <li title="到 facebook 上给 netdata 按赞" data-toggle="tooltip" data-placement="bottom" class="hidden-xs hidden-sm hidden-md"><a href="https://www.facebook.com/linuxnetdata/" class="btn" target="_blank"><i class="fab fa-facebook"></i></a></li>
+ <li title="汇入 / 载入 netdata 快照" data-toggle="tooltip" data-placement="bottom" id="loadButton"><a href="#" class="btn" data-toggle="modal" data-target="#loadSnapshotModal"><i class="fas fa-download"></i> <span class="hidden-sm hidden-md hidden-lg">汇入</span></a></li>
+ <li title="汇出 / 储存 netdata 快照" data-toggle="tooltip" data-placement="bottom" id="saveButton"><a href="#" class="btn" data-toggle="modal" data-target="#saveSnapshotModal"><i class="fas fa-upload"></i> <span class="hidden-sm hidden-md hidden-lg">汇出</span></a></li>
+ <li title="将仪表板列印为 PDF" data-toggle="tooltip" data-placement="bottom" id="printButton"><a href="#" class="btn" data-toggle="modal" data-target="#printPreflightModal"><i class="fas fa-print"></i> <span class="hidden-sm hidden-md hidden-lg">列印</span></a></li>
+ <li title="取得图表使用上的说明资讯" data-toggle="tooltip" data-placement="bottom" class="hidden-sm"><a href="#" class="btn" data-toggle="modal" data-target="#helpModal"><i class="fas fa-question-circle"></i> <span class="hidden-sm hidden-md">说明</span></a></li>
+ <li id="account-menu-container" class="dropdown" data-toggle="tooltip"></li>
+ </ul>
+ </nav>
+ </div>
+ </nav>
+ <div class="navbar-highlight">
+ <div id="navbar-highlight-content" class="navbar-highlight-content"></div>
+ </div>
+
+<!--
+ <div id="sign-in-banner" style="display: none">
+ <div class="container">
+ Like what you see?
+ <strong><a href="#" class="__link" onclick="signInDidClick(event); return false">Sign in</a>
+ to experience the full-range of netdata capabilities!</strong>
+ <div class="__close" onclick="closeSignInBannerDidClick(event)">
+ Close <i class="fas fa-times"></i>
+ </div>
+ </div>
+ </div>
+-->
+
+ <div id="masthead" style="display: none;">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-7">
+ <h1>Netdata
+ <p class="lead">即时效能监控，全力给您最详细的数据</p>
+ </h1>
+ </div>
+ <div class="col-md-5">
+ <div class="well well-lg">
+ <div class="row">
+ <div class="col-md-6">
+ <b>Drag</b> charts to pan.
+ <b>Shift + wheel</b> on them, to zoom in and out.
+ <b>Double-click</b> on them, to reset.
+ <b>Hover</b> on them too!
+ </div>
+ <div class="col-md-6">
+ <div class="netdata-container" data-netdata="system.intr" data-chart-library="dygraph" data-dygraph-theme="sparkline" data-dygraph-type="line" data-dygraph-strokewidth="3" data-dygraph-smooth="true" data-dygraph-highlightcirclesize="6" data-after="-90" data-height="60px" data-colors="#C66"></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="container">
+ <div class="row">
+ <div class="charts-body" role="main">
+ <div id="charts_div"></div>
+ </div>
+ <div class="sidebar-body hidden-xs hidden-sm hidden-print" id="sidebar-body" role="complementary">
+ <nav class="dashboard-sidebar hidden-print hidden-xs hidden-sm" id="sidebar" role="menu"></nav>
+ </div>
+ </div>
+ </div>
+
+ <div id="footer" class="container" style="display: none;">
+ <div class="row">
+ <div class="col-md-10" role="main">
+ <div class="p">
+ <big><a href="https://github.com/netdata/netdata/wiki" target="_blank">Netdata</a></big>
+ <br /><br />
+ <i class="fas fa-copyright"></i> Copyright 2018, <a href="mailto:info@netdata.cloud">Netdata, Inc</a>.<br/>
+ <i class="fas fa-copyright"></i> Copyright 2016-2018, <a href="mailto:costa@tsaousis.gr">Costa Tsaousis</a>.<br/>
+ </div>
+ <div class="p">
+ 以 <a href="http://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank">GPL v3 或之后</a> 条款释出。
+ Netdata 使用之 <a href="https://github.com/netdata/netdata/blob/master/REDISTRIBUTED.md" target="_blank">第三方工具</a>.
+ <br /><br />
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="xssModal" tabindex="-1" role="dialog" aria-labelledby="xssModalLabel" data-keyboard="false" data-backdrop="static" style="z-index: 3000">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h4 class="modal-title" id="xssModalLabel">XSS Protection</h4>
+ </div>
+ <div class="modal-body">
+ <p>
+ This dashboard is about to render data from server:
+ </p>
+ <p style="font-size: 1.25em;">
+ <code id="netdataXssModalServer"></code>
+ </p>
+ <p>
+ To protect your privacy, the dashboard will <b>check all data transferred</b> for cross site scripting (XSS).
+ <br/>This is CPU intensive, so your browser might be a bit slower.
+ </p>
+ <p>
+ If you <b>trust</b> the remote server, you can disable XSS protection.<br/>
+ In this case, any remote dashboard decoration code (javascript) will also run.
+ </p>
+ <p>
+ If you <b>don't trust</b> the remote server, you should keep the protection on.<br/>
+ The dashboard will run slower and remote dashboard decoration code will not run, but better be safe than sorry...
+ </p>
+ </div>
+ <div class="modal-footer">
+ <a href="#" onclick="return xssModalKeepXss();" type="button" class="btn btn-success" data-dismiss="modal">Keep protecting me</a>
+ <a href="#" onclick="return xssModalDisableXss();" type="button" class="btn btn-danger" data-dismiss="modal">I don't need this, the server is mine</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="printPreflightModal" tabindex="-1" role="dialog" aria-labelledby="printPreflightModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="printPreflightModalLabel">打印此netdata仪表板</h4>
+ </div>
+ <div class="modal-body">
+ <p>
+ netdata dashboards cannot be captured, since we are lazy loading and hiding all but the visible charts.
+ <br/>
+ To capture the whole page with all the charts rendered, a new browser window will pop-up that will render all the charts at once.
+ The new browser window will maintain the current pan and zoom settings of the charts. So, align the charts before proceeding.
+ </p>
+ <p>
+ <small>
+ This process will put some CPU and memory pressure on your browser.<br/>
+ For the netdata server, we will sequencially download all the charts, to avoid congesting network and server resources.<br/>
+ <b>Please, do not print netdata dashboards on paper!</b>
+ </small>
+ </p>
+ </div>
+ <div class="modal-footer">
+ <a href="#" onclick="printPreflight(); return false;" type="button" class="btn btn-default">Print</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="printModal" tabindex="-1" role="dialog" aria-labelledby="printModalLabel" data-keyboard="false" data-backdrop="static">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="printModalLabel">Preparing dashboard for printing...</h4>
+ </div>
+ <div class="modal-body">
+ Please wait while we initialize and render all the charts on the dashboard.
+ <div class="progress progress-striped active" style="height: 2em !important;">
+ <div id="printModalProgressBar" class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em;">
+ <span id="printModalProgressBarText" style="padding-left: 10px; padding-top: 4px; font-size: 1.2em; text-align: left; width: 100%; position: absolute; display: block; color: black;"></span>
+ </div>
+ </div>
+ The print dialog will appear as soon as we finish rendering the page.
+ </div>
+ <div class="modal-footer">
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="loadSnapshotModal" tabindex="-1" role="dialog" aria-labelledby="loadSnapshotModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="loadSnapshotModalLabel">Import a netdata snapshot</h4>
+ </div>
+ <div id="loadSnapshotDragAndDrop" class="modal-body">
+ <p>
+ netdata can export and import dashboard snapshots.
+ Any netdata can import the snapshot of any other netdata.
+ The snapshots are not uploaded to a server. They are handled entirely by your web browser, on your computer.
+ </p>
+ <p style="text-align: center;">
+ <label class="btn btn-default">
+ Click here to select the netdata snapshot file to import
+ <input type="file" id="loadSnapshotSelectFiles" value="Import" style="display: none;"
+ onchange="loadSnapshotPreflight();">
+ </label>
+ </p>
+ <div id="loadSnapshotStatus" class="alert alert-info" role="alert">
+ Browse for a snapshot file (or drag it and drop it here), then click <b>Import</b> to render it.
+ </div>
+ <p>
+ <table class="table">
+ <tbody>
+ <tr><th>Filename</th><td id="loadSnapshotFilename"></td></tr>
+ <tr><th>Hostname</th><td id="loadSnapshotHostname"></td></tr>
+ <tr><th>Origin URL</th><td id="loadSnapshotURL"></td></tr>
+ <tr><th>Charts Info</th><td id="loadSnapshotCharts"></td></tr>
+ <tr><th>Snapshot Info</th><td id="loadSnapshotInfo"></td></tr>
+ <tr><th>Time Range</th><td id="loadSnapshotTimeRange"></td></tr>
+ <tr><th>Comments</th><td id="loadSnapshotComments"></td></tr>
+ </tbody>
+ </table>
+ </p>
+ </div>
+ <div class="modal-footer">
+ <span style="display: inline-block; padding-right: 20px;">Snapshot files contain both data and javascript code. Make sure <b>you trust the files</b> you import!</span>
+ <a id="loadSnapshotImport" href="#" onclick="loadSnapshot(); return false;" type="button" class="btn btn-success disabled">Import</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="saveSnapshotModal" tabindex="-1" role="dialog" aria-labelledby="saveSnapshotModalLabel" data-keyboard="false" data-backdrop="static">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="saveSnapshotModalLabel">Export a snapshot</h4>
+ </div>
+ <div class="modal-body">
+ <div id="saveSnapshotModalProgressSection" hidden>
+ Please wait while we collect all the dashboard data...
+ <div class="progress progress-striped active" style="height: 2em !important;">
+ <div id="saveSnapshotModalProgressBar" class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em;">
+ <span id="saveSnapshotModalProgressBarText" style="padding-left: 10px; padding-top: 4px; font-size: 1.2em; text-align: left; width: 100%; position: absolute; display: block;"></span>
+ </div>
+ </div>
+ </div>
+
+ <div id="saveSnapshotResolutionRadio" style="text-align: center;">
+ Select the desired resolution of the snapshot. This is the <b>seconds of data per point</b>.
+ <br/>
+
+ <br/>
+
+ <br/>
+ <input id="saveSnapshotResolutionSlider" data-slider-id='saveSnapshotResolutionSlider' type="text" style="width: 80%;" tabindex="0"/>
+ <br/> <br/>
+ <div class="input-group">
+ <span class="input-group-addon" id="sizing-saveSnapshotFilename" style="width: 100px;">Filename</span>
+ <input id="saveSnapshotFilename" class="form-control" placeholder="Filename of the generated snapshot" aria-describedby="sizing-saveSnapshotFilename" tabindex="2"/>
+ <div class="input-group-btn">
+ <div class="input-group-btn">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span id="saveSnapshotCompressionName">Compression</span> <span class="caret"></span></button>
+ <ul class="dropdown-menu dropdown-menu-right">
+ <li class="disabled"><a href="#" class="disabled">Select Compression</a></li>
+ <li role="separator" class="divider"></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('none'); return false;">uncompressed</a></li>
+ <li role="separator" class="divider"></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('pako.deflate'); return false;">pako.deflate (gzip, binary)</a></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('pako.deflate.base64'); return false;">pako.deflate.base64 (gzip, ascii)</a></li>
+ <li role="separator" class="divider"></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('lzstring.uri'); return false;">lzstring.uri (LZ, ascii)</a></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('lzstring.utf16'); return false;">lzstring.utf16 (LZ, utf16)</a></li>
+ <li><a href="#" onclick="saveSnapshotSetCompression('lzstring.base64'); return false;">lzstring.base64 (LZ, ascii)</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </div>
+ </div>
+ <div class="input-group" style="padding-top: 10px; width: 100%">
+ <span class="input-group-addon" id="sizing-saveSnapshotComments" style="width: 100px;">Comments</span>
+ <input id="saveSnapshotComments" class="form-control" placeholder="Any comments about this snapshot?" aria-describedby="sizing-saveSnapshotComments" tabindex="3"/>
+ </div>
+ </div>
+
+
+ <div id="saveSnapshotStatus" class="alert alert-info" role="alert">
+ Select snaphost resolution. This controls the size the snapshot file.
+ </div>
+ <p>
+ The generated snapshot will include all charts of this dashboard, <b>for the visible timeframe</b>, so align, pan and zoom the charts as needed.
+ The scroll position of the dashboard will also be saved.
+ The snapshot will be downloaded as a file, to your computer, that can be imported back into any netdata dashboard (no need to import it back on this server).
+ </p>
+ <p>
+ <small>
+ Snapshot files include all the information of the dashboard, including the URL of the origin server, its netdata unique ID, etc.
+ So, if you share the snapshot file with third parties, they will be able to access the origin server, if this server is exposed on the internet.
+ <br/>
+ Snapshots are handled entirely by the web browser. The netdata servers are not aware of them.
+ </small>
+ </p>
+ </div>
+ <div class="modal-footer">
+ <a id="saveSnapshotExport" href="#" onclick="saveSnapshot(); return false;" type="button" class="btn btn-success" tabindex="4">Export</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal" tabindex="5">Cancel</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="welcomeModal" tabindex="-1" role="dialog" aria-labelledby="welcomeModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="welcomeModalLabel">Welcome to the world of netdata</h4>
+ </div>
+ <div class="modal-body">
+ <div class="p">
+ <div style="width: 100%; text-align: center; padding-top: 10px; padding-bottom: 10px; font-size: 18px;">
+ if there is a metric for something, we want it visualised<br/>
+ and we want this visualisation to be <strong>real-time</strong>, <strong>efficient</strong> and <strong>awesome</strong>
+ </div>
+ </div>
+ <div class="p">
+ <b><a href="https://github.com/netdata/netdata/wiki" target="_blank">netdata</a></b>
+ is a new way to monitor your systems and applications, to get <strong>real-time insights</strong>
+ of what is really happening and what affects performance.
+ It is carefully optimised to be a real-time system, without interfering in any way,
+ to the core function of your systems.
+ </div>
+ <div class="p">
+ <b><a href="https://github.com/netdata/netdata/wiki" target="_blank">netdata</a></b>
+ has been designed to monitor <strong>massive amounts of metrics, per server, per second</strong>.
+ When installed, it might come up with 1k to 3k metrics, but we have been testing it with 100k
+ metrics, all collected per second, and still the cpu utilisation remained negligible.
+ <br/>
+ We have also tried to give each metric, a meaning, a context.
+ We have grouped and categorized all metrics into meaningful charts, providing a
+ better understanding of the underlying technologies and mechanisms.
+ </div>
+ <div class="p">
+ <b><a href="https://github.com/netdata/netdata/wiki" target="_blank">netdata</a></b> is free,
+ open-source software. If you decide to use it,
+ <strong><a href="https://github.com/netdata/netdata/tree/master/docs/a-github-star-is-important.md" target="_blank">it is important to give netdata a star at GitHub</a></strong>.
+ </div>
+ <div class="p">
+ Enjoy real-time performance monitoring!
+ </div>
+ <div class="p">
+ Costa Tsaousis
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="helpModal" tabindex="-1" role="dialog" aria-labelledby="helpModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="helpModalLabel">仪表板说明</h4>
+ </div>
+ <div class="modal-body">
+
+ <h4>Dygraphs (折线图、区域图与山形图)</h4>
+
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist">
+ <li role="presentation" class="active"><a href="#help_mouse" aria-controls="help_mouse" role="tab" data-toggle="tab">滑鼠介面</a></li>
+ <li role="presentation"><a href="#help_touch" aria-controls="help_touch" role="tab" data-toggle="tab">触控介面</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="help_mouse">
+ <div class="p">
+ <h4>滑鼠移至 / 暂留</h4>
+ Mouse over on a chart to show, at its legend, the values for the timestamp under the mouse (the chart will also highlight the point at the chart).
+ <br/>
+ All the other visible charts will also show and highlight their values for the same timestamp.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>拖曳图表内容</h4>
+ Drag the contents of a chart, by pressing the left mouse button and moving the mouse, to pan it horizontally.
+ <br/>
+ All the charts will follow soon after you let the chart alone (this little delay is by design: it speeds up your browser and lets you focus on what you are exploring).
+ <br/>
+ Once a chart is panned, auto refreshing stops for all charts. To enable it again, <b>double click</b> a panned chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>连点两下</h4>
+ Double Click a chart to reset all the charts to their default auto-refreshing state.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>SHIFT + 拖曳</h4>
+ While pressing the <code>SHIFT</code> key, press the left mouse button on the contents of a chart and move the mouse to select an area, to zoom in. The other charts will follow too. Zooming is performed in two phases:
+ <ul>
+ <li>The already loaded chart contents are zoomed (low resolution)</li>
+ <li>New data are transferred from the netdata server, to refresh the chart with possibly more detail.</li>
+ </ul>
+ Once a chart is zoomed, auto refreshing stops for all charts. To enable it again, <b>double click</b> a zoomed chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>反白时间轴</h4>
+ While pressing the <code>ALT</code> key, press the left mouse button on the contents of a chart and move the mouse to select an area. The selected are will be highlighted on all charts.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>SHIFT + 滑鼠滚轮</h4>
+ While pressing the <code>SHIFT</code> key and the mouse pointer is over the contents of a chart, scroll the mouse wheel to zoom in or out. This kind of zooming is aligned to center below the mouse pointer. The other charts will follow too.
+ <br/>
+ Once a chart is zoomed, auto refreshing stops for all charts. To enable it again, <b>double click</b> a zoomed chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Legend Operations</h4>
+ Click on the label or value of a dimension, will select / un-select this dimension.
+ <br/>
+ You can press any of the SHIFT or CONTROL keys and then click on legend labels or values, to select / un-select multiple dimensions.
+ </div>
+ </div>
+ <div role="tabpanel" class="tab-pane" id="help_touch">
+ <div class="p">
+ <h4>Single Tap</h4>
+ Single Tap on the contents of a chart to show, at its legend, the values for the timestamp tapped (the chart will also highlight the point at the chart).
+ <br/>
+ All the other visible charts will also show and highlight their values for the same timestamp.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Drag Chart Contents</h4>
+ Touch and Drag the contents of a chart to pan it horizontally.
+ <br/>
+ All the charts will follow soon after you let the chart alone (this little delay is by design: it speeds up your browser and lets you focus on what you are exploring).
+ <br/>
+ Once a chart is panned, auto refreshing stops for all charts. To enable it again, <b>double tap</b> a panned chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Double Tap</h4>
+ Double tap a chart to reset all the charts to their default auto-refreshing state.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Zoom <small>(does not work on firefox and IE/Edge)</small></h4>
+ With two fingers, zoom in or out.
+ <br/>
+ Once a chart is zoomed, auto refreshing stops for all charts. To enable it again, <b>double click</b> a zoomed chart.
+ </div>
+ <hr/>
+ <div class="p">
+ <h4>Legend Operations</h4>
+ Tap on the label or value of a dimension, will select / un-select this dimension.
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="alarmsModal" tabindex="-1" role="dialog" aria-labelledby="alarmsModalLabel">
+ <div class="modal-dialog modal-lg" role="document" style="display: table;"> <!-- allow the modal to expand horizontally -->
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="alarmsModalLabel">netdata 警报</h4>
+ </div>
+ <div class="modal-body">
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist">
+ <li role="presentation" class="active"><a href="#alarms_active" aria-controls="alarms_active" role="tab" data-toggle="tab">作用中</a></li>
+ <li role="presentation"><a href="#alarms_all" aria-controls="alarms_all" role="tab" data-toggle="tab">所有</a></li>
+ <li role="presentation"><a href="#alarms_log" aria-controls="alarms_log" role="tab" data-toggle="tab">记录</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="alarms_active">
+ 载入中...
+ </div>
+ <div role="tabpanel" class="tab-pane" id="alarms_all">
+ 载入中...
+ </div>
+ <div role="tabpanel" class="tab-pane" id="alarms_log">
+ 载入中...
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <!-- <a href="#" onclick="alarmsUpdateModal(); return false;" type="button" class="btn btn-default">Update</a> -->
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="optionsModal" tabindex="-1" role="dialog" aria-labelledby="optionsModalLabel">
+ <div class="modal-dialog modal-lg" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="optionsModalLabel">netdata 仪表板选项</h4>
+ </div>
+ <div class="modal-body">
+ <center>
+ <small style="color: #BBBBBB;">这里是浏览器的设定，每个浏览者都可以拥有自己的设定。这里的设定不会影响 netdata 本身的运作。
+ <br/>
+ 设定会立即生效，并且储存在您浏览器的本地储存中 (除了重新整理的 在焦点上/总是 这两个选项以外)。
+ <br/>
+ 若要将所有选项重置回预设值 (包括图表大小)，请点选 <a href="#" onclick="resetDashboardOptions(); return false;">这里</a>。</small>
+ </center>
+ <div style="padding: 10px;"></div>
+
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist">
+ <li role="presentation" class="active"><a href="#settings_performance" aria-controls="settings_performance" role="tab" data-toggle="tab">效能</a></li>
+ <li role="presentation"><a href="#settings_sync" aria-controls="settings_sync" role="tab" data-toggle="tab">同步</a></li>
+ <li role="presentation"><a href="#settings_visual" aria-controls="settings_visual" role="tab" data-toggle="tab">视觉</a></li>
+ <li role="presentation"><a href="#settings_locale" aria-controls="settings_locale" role="tab" data-toggle="tab">地区</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="settings_performance">
+ <form id="optionsForm1" method="get" class="form-horizontal">
+ <div class="form-group">
+ <table>
+ <tr class="option-row">
+ <td class="option-control"><input id="stop_updates_when_focus_is_lost" type="checkbox" checked data-toggle="toggle" data-offstyle="danger" data-onstyle="success" data-on="在焦点上" data-off="总是" data-width="110px"></td>
+ <td class="option-info"><strong>何时要重新整理图表？</strong><br/>
+ <small>When set to <b>在焦点上</b>, the charts will stop being updated if the page / tab does not have the focus of the user. When set to <b>总是</b>, the charts will always be refreshed. Set it to <b>在焦点上</b> it to lower the CPU requirements of the browser (and extend the battery of laptops and tablets) when this page does not have your focus. Set to <b>总是</b> to work on another window (i.e. change the settings of something) and have the charts auto-refresh in this window.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control">
+ <input id="eliminate_zero_dimensions" type="checkbox" checked data-toggle="toggle" data-on="非零" data-off="所有" data-width="110px">
+ </td>
+ <td class="option-info"><strong>要显示那些图表维度？</strong><br/>
+ <small>When set to <b>非零</b>, dimensions that have all their values (within the current view) set to zero will not be transferred from the netdata server (except if all dimensions of the chart are zero, in which case this setting does nothing - all dimensions are transferred and shown). When set to <b>All</b>, all dimensions will always be shown. Set it to <b>非零</b> to lower the data transferred between netdata and your browser, lower the CPU requirements of your browser (fewer lines to draw) and increase the focus on the legends (fewer entries at the legends).</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="destroy_on_hide" type="checkbox" data-toggle="toggle" data-on="消去" data-off="隐藏" data-width="110px"></td>
+ <td class="option-info"><strong>如何处理隐藏图表？</strong><br/>
+ <small>When set to <b>消去</b>, charts that are not in the current viewport of the browser (are above, or below the visible area of the page), will be destroyed and re-created if and when they become visible again. When set to <b>Hide</b>, the not-visible charts will be just hidden, to simplify the DOM and speed up your browser. Set it to <b>消去</b>, to lower the memory requirements of your browser. Set it to <b>隐藏</b> for faster restoration of charts on page scrolling.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="async_on_scroll" type="checkbox" data-toggle="toggle" data-on="非同步" data-off="同步" data-width="110px"></td>
+ <td class="option-info"><strong>如何处理页面卷动？</strong><br/>
+ <small>When set to <b>同步</b>, charts will be examined for their visibility immediately after scrolling. On slow computers this may impact the smoothness of page scrolling. To update the page when scrolling ends, set it to <b>Async</b>. Set it to <b>Sync</b> for immediate chart updates when scrolling. Set it to <b>非同步</b> for smoother page scrolling on slower computers.</small>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </form>
+ </div>
+ <div role="tabpanel" class="tab-pane" id="settings_sync">
+ <form id="optionsForm2" method="get" class="form-horizontal">
+ <div class="form-group">
+ <table>
+ <tr class="option-row">
+ <td class="option-control"><input id="parallel_refresher" type="checkbox" checked data-toggle="toggle" data-on="并行" data-off="循序" data-width="110px"></td>
+ <td class="option-info"><strong>采用何种图表更新模式？</strong><br/>
+ <small>When set to <b>并行</b>, visible charts are refreshed in parallel (all queries are sent to netdata server in parallel) and are rendered asynchronously. When set to <b>sequential</b> charts are refreshed one after another. Set it to parallel if your browser can cope with it (most modern browsers do), set it to sequential if you work on an older/slower computer.</small>
+ </td>
+ </tr>
+ <tr class="option-row" id="concurrent_refreshes_row">
+ <td class="option-control"><input id="concurrent_refreshes" type="checkbox" checked data-toggle="toggle" data-on="重新同步" data-off="尽力而为" data-width="110px"></td>
+ <td class="option-info"><strong>重新整理时是否需要同步所有图表？</strong><br/>
+ <small>When set to <b>重新同步</b>, the dashboard will attempt to re-synchronize all the charts so that they are refreshed concurrently. When set to <b>尽力而为</b>, each chart may be refreshed with a little time difference to the others. Normally, the dashboard starts refreshing them in parallel, but depending on the speed of your computer and the network latencies, charts start having a slight time difference. Setting this to <b>重新同步</b> will attempt to re-synchronize the charts on every update. Setting it to <b>尽力而为</b> may lower the pressure on your browser and the network.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="sync_selection" type="checkbox" checked data-toggle="toggle" data-on="同步" data-off="不要同步" data-onstyle="success" data-offstyle="danger" data-width="110px"></td>
+ <td class="option-info"><strong>是否悬停在图表上时同步更新所有图表？</strong><br/>
+ <small>When enabled, a selection on one chart will automatically select the same time on all other visible charts and the legends of all visible charts will be updated to show the selected values. When disabled, only the chart getting the user's attention will be selected. Enable it to get better insights of the data. Disable it if you are on a very slow computer that cannot actually do it.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="sync_pan_and_zoom" type="checkbox" checked data-toggle="toggle" data-on="同步" data-off="不要同步" data-onstyle="success" data-offstyle="danger" data-width="110px"></td>
+ <td class="option-info"><strong>是否同步移动与缩放所有图表？</strong><br/>
+ <small>When enabled, pan and zoom operations on a chart will be replicated to all charts (even the ones that are not currently visible - of course only when they will become visible). When disabled, pan and zoom operations will not be propagated to other charts.</small>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </form>
+ </div>
+ <div role="tabpanel" class="tab-pane" id="settings_visual">
+ <form id="optionsForm3" method="get" class="form-horizontal">
+ <div class="form-group">
+ <table>
+ <tr class="option-row">
+ <td class="option-control"><input id="netdata_theme_control" type="checkbox" checked data-toggle="toggle" data-offstyle="danger" data-onstyle="success" data-on="深色" data-off="白色" data-width="110px"></td>
+ <td class="option-info"><strong>使用那一种布景主题？</strong><br/>
+ <small>Netdata comes with two themes: <b>深色</b> (the default) and <b>浅色</b>.
+ <br/>
+ <b>Switching this will reload the dashboard</b>.
+ </small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="show_help" type="checkbox" checked data-toggle="toggle" data-on="需要说明" data-off="不需说明" data-width="110px"></td>
+ <td class="option-info"><strong>您需要说明吗？</strong><br/>
+ <small>Netdata can show some help in some areas to help you use the dashboard. If all these balloons bother you, disable them using this switch.
+ <br/>
+ <b>Switching this will reload the dashboard</b>.
+ </small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="pan_and_zoom_data_padding" type="checkbox" checked data-toggle="toggle" data-on="填补" data-off="不需填补" data-width="110px"></td>
+ <td class="option-info"><strong>是否启用在移动与缩放时同时填补数据？</strong><br/>
+ <small>When set to <b>Pad</b> the charts will be padded with more data, both before and after the visible area, thus giving the impression the whole database is loaded. This padding will happen only after the first pan or zoom operation on the chart (initially all charts have only the visible data). When set to <b>不需填补</b> only the visible data will be transfered from the netdata server, even after the first pan and zoom operation.</small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="smooth_plot" type="checkbox" checked data-toggle="toggle" data-on="平滑" data-off="粗糙" data-width="110px"></td>
+ <td class="option-info"><strong>是否在图表上启用贝兹曲线？</strong><br/>
+ <small>When set to <b>平滑</b> the charts libraries that support it, will plot smooth curves instead of simple straight lines to connect the points.
+ <br/>
+ Keep in mind <a href="http://dygraphs.com" target="_blank">dygraphs</a>, the main charting library in netdata dashboards, can only smooth line charts. It cannot smooth area or stacked charts. When set to <b>Rough</b>, this setting can lower the CPU resources consumed by your browser.</small>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </form>
+ </div>
+ <div role="tabpanel" class="tab-pane" id="settings_locale">
+ <form id="optionsForm4" method="get" class="form-horizontal">
+ <div class="form-group">
+ <table>
+ <tr class="option-row">
+ <td colspan="2" align="center">
+ <small>
+ <b>These settings are applied gradually, as charts are updated. To force them, refresh the dashboard now</b>.
+ </small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="units_conversion" type="checkbox" checked data-toggle="toggle" data-on="缩放单位" data-off="固定单位" data-onstyle="success" data-width="110px"></td>
+ <td class="option-info"><strong>是否启用自动缩放单位选择？</strong><br/>
+ <small>When set to <b>缩放单位</b> the values shown will dynamically be scaled (e.g. 1000 kilobits will be shown as 1 megabit).
+ Netdata can auto-scale these original units: <code>kilobits/s</code>, <code>kilobytes/s</code>, <code>KB/s</code>,
+ <code>KB</code>, <code>MB</code>, and <code>GB</code>.
+ When set to <b>固定单位</b> all the values will be rendered using the original units maintained by the netdata server.
+ </small>
+ </td>
+ </tr>
+ <tr id="settingsLocaleTempRow" class="option-row">
+ <td class="option-control"><input id="units_temp" type="checkbox" checked data-toggle="toggle" data-on="摄氏" data-off="华氏" data-width="110px"></td>
+ <td class="option-info"><strong>使用何种温度单位？</strong><br/>
+ <small>Set the temperature units of the dashboard.
+ </small>
+ </td>
+ </tr>
+ <tr id="settingsLocaleTimeRow" class="option-row">
+ <td class="option-control"><input id="seconds_as_time" type="checkbox" checked data-toggle="toggle" data-on="时间" data-off="秒" data-onstyle="success" data-width="110px"></td>
+ <td class="option-info"><strong>是否将秒转换为时间？</strong><br/>
+ <small>When set to <b>时间</b>, charts that present <code>秒</code> will show <code>DDd:HH:MM:SS</code>.
+ When set to <b>秒</b>, the raw number of seconds will be presented.
+ </small>
+ </td>
+ </tr>
+ <tr class="option-row">
+ <td class="option-control"><input id="local_timezone" type="checkbox" checked data-toggle="toggle" data-on="本地时间" data-off="伺服器时间 data-onstyle="success" data-offstyle="danger" data-width="110px"></td>
+ <td class="option-info"><strong>是否显示浏览者本地时间或是伺服器时间？</strong><br/>
+ <small>When set to <b>本地时间</b>, the charts will use your browser local time. When set to <b>Server Time</b> the charts will use the server time.
+ <br/>
+ Set it to <b>本地时间</b> to have a common time-reference, no matter where the server is and which time zone it uses (all your dashboards will report your local time).
+ Set it to <b>伺服器时间</b> when you need to compare netdata charts with server log files.
+ <br/>
+ Your browser time zone is: <b><span id="browser_timezone">-</span></b>.<br/>
+ The server reported timezone is: <b><span id="server_timezone">-</span></b> (you can set this in netdata.conf <code>[global].timezone</code>).<br/>
+ The current time zone on the dashboard is: <b><span id="current_timezone">-</span></b>.
+ <br/>
+ <div class="dropup">
+ <button class="btn btn-default dropdown-toggle" type="button" id="dropdownTimeZone" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+ 选择伺服器时区
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu scrollable-menu-50" aria-labelledby="dropdownTimeZone">
+ <li><a href=# onclick="return selected_server_timezone('UTC');">Universal Time Coordinated (UTC)</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Abidjan');">Africa/Abidjan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Accra');">Africa/Accra</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Algiers');">Africa/Algiers</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Bissau');">Africa/Bissau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Cairo');">Africa/Cairo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Casablanca');">Africa/Casablanca</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Ceuta');">Africa/Ceuta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/El_Aaiun');">Africa/El_Aaiun</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Johannesburg');">Africa/Johannesburg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Khartoum');">Africa/Khartoum</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Lagos');">Africa/Lagos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Maputo');">Africa/Maputo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Monrovia');">Africa/Monrovia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Nairobi');">Africa/Nairobi</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Ndjamena');">Africa/Ndjamena</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Tripoli');">Africa/Tripoli</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Tunis');">Africa/Tunis</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Africa/Windhoek');">Africa/Windhoek</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Adak');">America/Adak</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Anchorage');">America/Anchorage</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Araguaina');">America/Araguaina</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Buenos_Aires');">America/Argentina/Buenos_Aires</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Catamarca');">America/Argentina/Catamarca</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Cordoba');">America/Argentina/Cordoba</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Jujuy');">America/Argentina/Jujuy</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/La_Rioja');">America/Argentina/La_Rioja</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Mendoza');">America/Argentina/Mendoza</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Rio_Gallegos');">America/Argentina/Rio_Gallegos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Salta');">America/Argentina/Salta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/San_Juan');">America/Argentina/San_Juan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/San_Luis');">America/Argentina/San_Luis</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Tucuman');">America/Argentina/Tucuman</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Argentina/Ushuaia');">America/Argentina/Ushuaia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Asuncion');">America/Asuncion</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Atikokan');">America/Atikokan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Bahia');">America/Bahia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Bahia_Banderas');">America/Bahia_Banderas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Barbados');">America/Barbados</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Belem');">America/Belem</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Belize');">America/Belize</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Blanc-Sablon');">America/Blanc-Sablon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Boa_Vista');">America/Boa_Vista</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Bogota');">America/Bogota</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Boise');">America/Boise</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Cambridge_Bay');">America/Cambridge_Bay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Campo_Grande');">America/Campo_Grande</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Cancun');">America/Cancun</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Caracas');">America/Caracas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Cayenne');">America/Cayenne</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Chicago');">America/Chicago</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Chihuahua');">America/Chihuahua</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Costa_Rica');">America/Costa_Rica</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Creston');">America/Creston</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Cuiaba');">America/Cuiaba</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Curacao');">America/Curacao</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Danmarkshavn');">America/Danmarkshavn</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Dawson');">America/Dawson</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Dawson_Creek');">America/Dawson_Creek</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Denver');">America/Denver</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Detroit');">America/Detroit</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Edmonton');">America/Edmonton</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Eirunepe');">America/Eirunepe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/El_Salvador');">America/El_Salvador</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Fortaleza');">America/Fortaleza</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Fort_Nelson');">America/Fort_Nelson</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Glace_Bay');">America/Glace_Bay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Godthab');">America/Godthab</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Goose_Bay');">America/Goose_Bay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Grand_Turk');">America/Grand_Turk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Guatemala');">America/Guatemala</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Guayaquil');">America/Guayaquil</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Guyana');">America/Guyana</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Halifax');">America/Halifax</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Havana');">America/Havana</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Hermosillo');">America/Hermosillo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Indianapolis');">America/Indiana/Indianapolis</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Knox');">America/Indiana/Knox</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Marengo');">America/Indiana/Marengo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Petersburg');">America/Indiana/Petersburg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Tell_City');">America/Indiana/Tell_City</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Vevay');">America/Indiana/Vevay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Vincennes');">America/Indiana/Vincennes</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Indiana/Winamac');">America/Indiana/Winamac</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Inuvik');">America/Inuvik</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Iqaluit');">America/Iqaluit</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Jamaica');">America/Jamaica</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Juneau');">America/Juneau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Kentucky/Louisville');">America/Kentucky/Louisville</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Kentucky/Monticello');">America/Kentucky/Monticello</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/La_Paz');">America/La_Paz</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Lima');">America/Lima</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Los_Angeles');">America/Los_Angeles</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Maceio');">America/Maceio</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Managua');">America/Managua</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Manaus');">America/Manaus</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Martinique');">America/Martinique</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Matamoros');">America/Matamoros</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Mazatlan');">America/Mazatlan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Menominee');">America/Menominee</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Merida');">America/Merida</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Metlakatla');">America/Metlakatla</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Mexico_City');">America/Mexico_City</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Miquelon');">America/Miquelon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Moncton');">America/Moncton</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Monterrey');">America/Monterrey</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Montevideo');">America/Montevideo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Nassau');">America/Nassau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/New_York');">America/New_York</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Nipigon');">America/Nipigon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Nome');">America/Nome</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Noronha');">America/Noronha</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/North_Dakota/Beulah');">America/North_Dakota/Beulah</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/North_Dakota/Center');">America/North_Dakota/Center</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/North_Dakota/New_Salem');">America/North_Dakota/New_Salem</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Ojinaga');">America/Ojinaga</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Panama');">America/Panama</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Pangnirtung');">America/Pangnirtung</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Paramaribo');">America/Paramaribo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Phoenix');">America/Phoenix</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Port-au-Prince');">America/Port-au-Prince</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Port_of_Spain');">America/Port_of_Spain</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Porto_Velho');">America/Porto_Velho</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Puerto_Rico');">America/Puerto_Rico</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Punta_Arenas');">America/Punta_Arenas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Rainy_River');">America/Rainy_River</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Rankin_Inlet');">America/Rankin_Inlet</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Recife');">America/Recife</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Regina');">America/Regina</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Resolute');">America/Resolute</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Rio_Branco');">America/Rio_Branco</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Santarem');">America/Santarem</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Santiago');">America/Santiago</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Santo_Domingo');">America/Santo_Domingo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Sao_Paulo');">America/Sao_Paulo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Scoresbysund');">America/Scoresbysund</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Sitka');">America/Sitka</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/St_Johns');">America/St_Johns</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Swift_Current');">America/Swift_Current</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Tegucigalpa');">America/Tegucigalpa</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Thule');">America/Thule</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Thunder_Bay');">America/Thunder_Bay</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Tijuana');">America/Tijuana</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Toronto');">America/Toronto</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Vancouver');">America/Vancouver</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Whitehorse');">America/Whitehorse</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Winnipeg');">America/Winnipeg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Yakutat');">America/Yakutat</a></li>
+ <li><a href=# onclick="return selected_server_timezone('America/Yellowknife');">America/Yellowknife</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Casey');">Antarctica/Casey</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Davis');">Antarctica/Davis</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/DumontDUrville');">Antarctica/DumontDUrville</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Macquarie');">Antarctica/Macquarie</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Mawson');">Antarctica/Mawson</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Palmer');">Antarctica/Palmer</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Rothera');">Antarctica/Rothera</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Syowa');">Antarctica/Syowa</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Troll');">Antarctica/Troll</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Antarctica/Vostok');">Antarctica/Vostok</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Almaty');">Asia/Almaty</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Amman');">Asia/Amman</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Anadyr');">Asia/Anadyr</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Aqtau');">Asia/Aqtau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Aqtobe');">Asia/Aqtobe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Ashgabat');">Asia/Ashgabat</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Atyrau');">Asia/Atyrau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Baghdad');">Asia/Baghdad</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Baku');">Asia/Baku</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Bangkok');">Asia/Bangkok</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Barnaul');">Asia/Barnaul</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Beirut');">Asia/Beirut</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Bishkek');">Asia/Bishkek</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Brunei');">Asia/Brunei</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Chita');">Asia/Chita</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Choibalsan');">Asia/Choibalsan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Colombo');">Asia/Colombo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Damascus');">Asia/Damascus</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Dhaka');">Asia/Dhaka</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Dili');">Asia/Dili</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Dubai');">Asia/Dubai</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Dushanbe');">Asia/Dushanbe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Famagusta');">Asia/Famagusta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Gaza');">Asia/Gaza</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Hebron');">Asia/Hebron</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Ho_Chi_Minh');">Asia/Ho_Chi_Minh</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Hong_Kong');">Asia/Hong_Kong</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Hovd');">Asia/Hovd</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Irkutsk');">Asia/Irkutsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Jakarta');">Asia/Jakarta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Jayapura');">Asia/Jayapura</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Jerusalem');">Asia/Jerusalem</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kabul');">Asia/Kabul</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kamchatka');">Asia/Kamchatka</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Karachi');">Asia/Karachi</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kathmandu');">Asia/Kathmandu</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Khandyga');">Asia/Khandyga</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kolkata');">Asia/Kolkata</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Krasnoyarsk');">Asia/Krasnoyarsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kuala_Lumpur');">Asia/Kuala_Lumpur</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Kuching');">Asia/Kuching</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Macau');">Asia/Macau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Magadan');">Asia/Magadan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Makassar');">Asia/Makassar</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Manila');">Asia/Manila</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Nicosia');">Asia/Nicosia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Novokuznetsk');">Asia/Novokuznetsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Novosibirsk');">Asia/Novosibirsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Omsk');">Asia/Omsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Oral');">Asia/Oral</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Pontianak');">Asia/Pontianak</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Pyongyang');">Asia/Pyongyang</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Qatar');">Asia/Qatar</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Qyzylorda');">Asia/Qyzylorda</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Riyadh');">Asia/Riyadh</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Sakhalin');">Asia/Sakhalin</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Samarkand');">Asia/Samarkand</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Seoul');">Asia/Seoul</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Shanghai');">Asia/Shanghai</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Singapore');">Asia/Singapore</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Srednekolymsk');">Asia/Srednekolymsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Taipei');">Asia/Taipei</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tashkent');">Asia/Tashkent</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tbilisi');">Asia/Tbilisi</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tehran');">Asia/Tehran</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Thimphu');">Asia/Thimphu</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tokyo');">Asia/Tokyo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Tomsk');">Asia/Tomsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Ulaanbaatar');">Asia/Ulaanbaatar</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Urumqi');">Asia/Urumqi</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Ust-Nera');">Asia/Ust-Nera</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Vladivostok');">Asia/Vladivostok</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Yakutsk');">Asia/Yakutsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Yangon');">Asia/Yangon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Yekaterinburg');">Asia/Yekaterinburg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Asia/Yerevan');">Asia/Yerevan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Azores');">Atlantic/Azores</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Bermuda');">Atlantic/Bermuda</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Canary');">Atlantic/Canary</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Cape_Verde');">Atlantic/Cape_Verde</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Faroe');">Atlantic/Faroe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Madeira');">Atlantic/Madeira</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Reykjavik');">Atlantic/Reykjavik</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/South_Georgia');">Atlantic/South_Georgia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Atlantic/Stanley');">Atlantic/Stanley</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Adelaide');">Australia/Adelaide</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Brisbane');">Australia/Brisbane</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Broken_Hill');">Australia/Broken_Hill</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Currie');">Australia/Currie</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Darwin');">Australia/Darwin</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Eucla');">Australia/Eucla</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Hobart');">Australia/Hobart</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Lindeman');">Australia/Lindeman</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Lord_Howe');">Australia/Lord_Howe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Melbourne');">Australia/Melbourne</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Perth');">Australia/Perth</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Australia/Sydney');">Australia/Sydney</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Amsterdam');">Europe/Amsterdam</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Andorra');">Europe/Andorra</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Astrakhan');">Europe/Astrakhan</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Athens');">Europe/Athens</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Belgrade');">Europe/Belgrade</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Berlin');">Europe/Berlin</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Brussels');">Europe/Brussels</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Bucharest');">Europe/Bucharest</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Budapest');">Europe/Budapest</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Chisinau');">Europe/Chisinau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Copenhagen');">Europe/Copenhagen</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Dublin');">Europe/Dublin</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Gibraltar');">Europe/Gibraltar</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Helsinki');">Europe/Helsinki</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Istanbul');">Europe/Istanbul</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Kaliningrad');">Europe/Kaliningrad</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Kiev');">Europe/Kiev</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Kirov');">Europe/Kirov</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Lisbon');">Europe/Lisbon</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/London');">Europe/London</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Luxembourg');">Europe/Luxembourg</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Madrid');">Europe/Madrid</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Malta');">Europe/Malta</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Minsk');">Europe/Minsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Monaco');">Europe/Monaco</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Moscow');">Europe/Moscow</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Oslo');">Europe/Oslo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Paris');">Europe/Paris</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Prague');">Europe/Prague</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Riga');">Europe/Riga</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Rome');">Europe/Rome</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Samara');">Europe/Samara</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Saratov');">Europe/Saratov</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Simferopol');">Europe/Simferopol</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Sofia');">Europe/Sofia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Stockholm');">Europe/Stockholm</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Tallinn');">Europe/Tallinn</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Tirane');">Europe/Tirane</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Ulyanovsk');">Europe/Ulyanovsk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Uzhgorod');">Europe/Uzhgorod</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Vienna');">Europe/Vienna</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Vilnius');">Europe/Vilnius</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Volgograd');">Europe/Volgograd</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Warsaw');">Europe/Warsaw</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Zaporozhye');">Europe/Zaporozhye</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Europe/Zurich');">Europe/Zurich</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Chagos');">Indian/Chagos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Christmas');">Indian/Christmas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Cocos');">Indian/Cocos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Kerguelen');">Indian/Kerguelen</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Mahe');">Indian/Mahe</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Maldives');">Indian/Maldives</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Mauritius');">Indian/Mauritius</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Indian/Reunion');">Indian/Reunion</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Apia');">Pacific/Apia</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Auckland');">Pacific/Auckland</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Bougainville');">Pacific/Bougainville</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Chatham');">Pacific/Chatham</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Chuuk');">Pacific/Chuuk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Easter');">Pacific/Easter</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Efate');">Pacific/Efate</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Enderbury');">Pacific/Enderbury</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Fakaofo');">Pacific/Fakaofo</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Fiji');">Pacific/Fiji</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Funafuti');">Pacific/Funafuti</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Galapagos');">Pacific/Galapagos</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Gambier');">Pacific/Gambier</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Guadalcanal');">Pacific/Guadalcanal</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Guam');">Pacific/Guam</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Honolulu');">Pacific/Honolulu</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Kiritimati');">Pacific/Kiritimati</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Kosrae');">Pacific/Kosrae</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Kwajalein');">Pacific/Kwajalein</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Majuro');">Pacific/Majuro</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Marquesas');">Pacific/Marquesas</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Nauru');">Pacific/Nauru</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Niue');">Pacific/Niue</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Norfolk');">Pacific/Norfolk</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Noumea');">Pacific/Noumea</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Pago_Pago');">Pacific/Pago_Pago</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Palau');">Pacific/Palau</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Pitcairn');">Pacific/Pitcairn</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Pohnpei');">Pacific/Pohnpei</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Port_Moresby');">Pacific/Port_Moresby</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Rarotonga');">Pacific/Rarotonga</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Tahiti');">Pacific/Tahiti</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Tarawa');">Pacific/Tarawa</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Tongatapu');">Pacific/Tongatapu</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Wake');">Pacific/Wake</a></li>
+ <li><a href=# onclick="return selected_server_timezone('Pacific/Wallis');">Pacific/Wallis</a></li>
+ </ul>
+ </div>
+ <b><span id="timezone_error_message"></span></b>
+
+ </small>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </form>
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+
+ <div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="updateModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="updateModalLabel">检查更新</h4>
+ </div>
+ <div class="modal-body">
+ 您的 netdata 版本：<b><code><span id="netdataVersion">未知</span></code></b><br/>
+ <br/>
+ <div style="padding: 10px;"></div>
+ <div id="versionCheckLog">尚未检查，请下 立即检查 按钮。</div>
+ <div>
+ <hr/>
+ </div>
+ <div>
+ 到这里查阅 netdata 的进度报告与关键更新：<strong><a href="https://twitter.com/linuxnetdata" target="_blank">在 <i class="fab fa-twitter"></i> twitter 上跟随 netdata</a></strong>。
+ <br/>
+ 您也可以在 <a href="https://www.facebook.com/linuxnetdata/" target="_blank"><i class="fab fa-facebook"></i> facebook 上给 netdata 按赞</a>,
+ 或是 <a href="https://github.com/netdata/netdata" target="_blank">到 <i class="fab fa-github"></i> github 上了解 netdata</a>.
+ </div>
+ </div>
+ <div class="modal-footer">
+ <a href="#" onclick="notifyForUpdate(true); return false;" type="button" class="btn btn-default">立即检查</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="signInModal" tabindex="-1" role="dialog" aria-labelledby="signInModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="signInModalLabel">登入</h4>
+ </div>
+ <div class="modal-body">
+ <p>
+ Signing-in to netdata.cloud will synchronize the list of
+ your netdata monitored nodes known at registry
+ <strong><span id="sim-registry"></span></strong>. This
+ may include server hostnames, urls and identification
+ GUIDs.
+ </p>
+ <p>
+ After you upgrade all your netdata servers, your private
+ registry will not be needed any more.
+ </p>
+ <p>
+ Are you sure you want to proceed?
+ </p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+ <a href="#" onclick="explicitlySignIn(); return false;" type="button" class="btn btn-success">登入</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="syncRegistryModal" tabindex="-1" role="dialog" aria-labelledby="syncRegistryModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="syncRegistryModalLabel">将netdata.cloud与注册表同步?</h4>
+ </div>
+ <div class="modal-body">
+ <p>
+ You are about to synchronize your netdata.cloud account with data from the registry at <strong><span id="sync-registry-modal-registry"></span></strong>.
+ This may include server hostnames, urls and identification GUIDs.
+ </p>
+ <p>
+ Are you sure you want to proceed?
+ </p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+ <a href="#" onclick="explicitlySyncAgents(); return false;" type="button" class="btn btn-success">Synchronize</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="deleteRegistryModal" tabindex="-1" role="dialog" aria-labelledby="deleteRegistryModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="deleteRegistryModalLabel">Delete <span id="deleteRegistryServerName"></span>?</h4>
+ </div>
+ <div class="modal-body">
+ You are about to delete, from your personal list of netdata servers, the following server:
+ <p style="text-align: center; padding-top: 10px; padding-bottom: 10px; line-height: 2;">
+ <b><span id="deleteRegistryServerName2"></span></b>
+ <br/>
+ <b><span id="deleteRegistryServerURL"></span></b>
+ </p>
+ Are you sure you want to do this?
+ <br/>
+ <div style="padding: 10px;"></div>
+ <small>Keep in mind, this server will be added back if and when you visit it again.</small>
+ <br/>
+ <div id="deleteRegistryResponse" style="display: block; width: 100%; text-align: center; padding-top: 20px;"></div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-success" data-dismiss="modal">keep it</button>
+ <a href="#" onclick="notifyForDeleteRegistry(); return false;" type="button" class="btn btn-danger">delete it</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="switchRegistryModal" tabindex="-1" role="dialog" aria-labelledby="switchRegistryModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="switchRegistryModalLabel">更换Netdata注册表标识</h4>
+ </div>
+ <div class="modal-body">
+ 可以将以下ID复制并粘贴到所有浏览器(例：工作和家庭).
+ <br/>
+ 所有具有相同ID的浏览器都将识别<b>you</b>, 所以请不要和别人分享.
+ <div style="text-align: center; padding-top: 10px; padding-bottom: 10px; line-height: 2;">
+ <form action="#">
+ <input type="text" class="form-control" id="switchRegistryPersonGUID" placeholder="your personal ID" maxlength="36" autocomplete="off" style="text-align: center; font-size: 1.4em;">
+ </form>
+ </div>
+ 复制此ID并将其粘贴到其他浏览器，或将从其他浏览器获取的ID粘贴到此处。
+ <div style="padding-top: 10px;"><small>
+ Keep in mind that:
+ <ul>
+ <li>当您切换ID时，您以前的ID将永远丢失-这是不可逆的。</li>
+ <li>两个ID（旧的和新的）必须在其个人列表中列出此网络数据。</li>
+ <li>注册中心必须知道这两个ID： <b><span id="switchRegistryURL"></span></b>.</li>
+ <li>要获取新的ID，只需清除浏览器cookies。</li>
+ </ul>
+ </small></div>
+ <div id="switchRegistryResponse" style="display: block; width: 100%; text-align: center; padding-top: 20px;"></div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-success" data-dismiss="modal">取消</button>
+ <a href="#" onclick="notifyForSwitchRegistry(); return false;" type="button" class="btn btn-danger">更换</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="gotoServerModal" tabindex="-1" role="dialog" aria-labelledby="gotoServerModalLabel">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
+ <h4 class="modal-title" id="gotoServerModalLabel"><span id="gotoServerName"></span></h4>
+ </div>
+ <div class="modal-body">
+ Checking known URLs for this server...
+ <div style="padding-top: 20px;">
+ <table id="gotoServerList">
+ </table>
+ </div>
+ <p style="padding-top: 10px;"><small>
+ Checks may fail if you are viewing an HTTPS page and the server to be checked is HTTP only.
+ </small></p>
+ <div id="gotoServerResponse" style="display: block; width: 100%; text-align: center; padding-top: 20px;"></div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <iframe id="ssoifrm" width="0" height="0" style="border: none;"></iframe>
+ <div id="hiddenDownloadLinks" style="display: none;" hidden></div>
+ <script type="text/javascript" src="dashboard.js?v20190902-0"></script>
+</body>
+</html>
diff --git a/applications/luci-app-netdata/web/main.js b/applications/luci-app-netdata/web/main.js
new file mode 100755
index 0000000..a9cfc2b
--- /dev/null
+++ b/applications/luci-app-netdata/web/main.js
@@ -0,0 +1,5149 @@
+// Main JavaScript file for the Netdata GUI.
+
+// Codacy declarations
+/* global NETDATA */
+
+// netdata snapshot data
+var netdataSnapshotData = null;
+
+// enable alarms checking and notifications
+var netdataShowAlarms = true;
+
+// enable registry updates
+var netdataRegistry = true;
+
+// forward definition only - not used here
+var netdataServer = undefined;
+var netdataServerStatic = undefined;
+var netdataCheckXSS = undefined;
+
+// control the welcome modal and analytics
+var this_is_demo = null;
+
+function escapeUserInputHTML(s) {
+ return s.toString()
+ .replace(/&/g, '&')
+ .replace(/</g, '<')
+ .replace(/>/g, '>')
+ .replace(/"/g, '"')
+ .replace(/#/g, '#')
+ .replace(/'/g, ''')
+ .replace(/\(/g, '(')
+ .replace(/\)/g, ')')
+ .replace(/\//g, '/');
+}
+
+function verifyURL(s) {
+ if (typeof (s) === 'string' && (s.startsWith('http://') || s.startsWith('https://'))) {
+ return s
+ .replace(/'/g, '%22')
+ .replace(/"/g, '%27')
+ .replace(/\)/g, '%28')
+ .replace(/\(/g, '%29');
+ }
+
+ console.log('invalid URL detected:');
+ console.log(s);
+ return 'javascript:alert("invalid url");';
+}
+
+// --------------------------------------------------------------------
+// urlOptions
+
+var urlOptions = {
+ hash: '#',
+ theme: null,
+ help: null,
+ mode: 'live', // 'live', 'print'
+ update_always: false,
+ pan_and_zoom: false,
+ server: null,
+ after: 0,
+ before: 0,
+ highlight: false,
+ highlight_after: 0,
+ highlight_before: 0,
+ nowelcome: false,
+ show_alarms: false,
+ chart: null,
+ family: null,
+ alarm: null,
+ alarm_unique_id: 0,
+ alarm_id: 0,
+ alarm_event_id: 0,
+ alarm_when: 0,
+
+ hasProperty: function (property) {
+ // console.log('checking property ' + property + ' of type ' + typeof(this[property]));
+ return typeof this[property] !== 'undefined';
+ },
+
+ genHash: function (forReload) {
+ var hash = urlOptions.hash;
+
+ if (urlOptions.pan_and_zoom === true) {
+ hash += ';after=' + urlOptions.after.toString() +
+ ';before=' + urlOptions.before.toString();
+ }
+
+ if (urlOptions.highlight === true) {
+ hash += ';highlight_after=' + urlOptions.highlight_after.toString() +
+ ';highlight_before=' + urlOptions.highlight_before.toString();
+ }
+
+ if (urlOptions.theme !== null) {
+ hash += ';theme=' + urlOptions.theme.toString();
+ }
+
+ if (urlOptions.help !== null) {
+ hash += ';help=' + urlOptions.help.toString();
+ }
+
+ if (urlOptions.update_always === true) {
+ hash += ';update_always=true';
+ }
+
+ if (forReload === true && urlOptions.server !== null) {
+ hash += ';server=' + urlOptions.server.toString();
+ }
+
+ if (urlOptions.mode !== 'live') {
+ hash += ';mode=' + urlOptions.mode;
+ }
+
+ return hash;
+ },
+
+ parseHash: function () {
+ var variables = document.location.hash.split(';');
+ var len = variables.length;
+ while (len--) {
+ if (len !== 0) {
+ var p = variables[len].split('=');
+ if (urlOptions.hasProperty(p[0]) && typeof p[1] !== 'undefined') {
+ urlOptions[p[0]] = decodeURIComponent(p[1]);
+ }
+ } else {
+ if (variables[len].length > 0) {
+ urlOptions.hash = variables[len];
+ }
+ }
+ }
+
+ var booleans = ['nowelcome', 'show_alarms', 'update_always'];
+ len = booleans.length;
+ while (len--) {
+ if (urlOptions[booleans[len]] === 'true' || urlOptions[booleans[len]] === true || urlOptions[booleans[len]] === '1' || urlOptions[booleans[len]] === 1) {
+ urlOptions[booleans[len]] = true;
+ } else {
+ urlOptions[booleans[len]] = false;
+ }
+ }
+
+ var numeric = ['after', 'before', 'highlight_after', 'highlight_before', 'alarm_when'];
+ len = numeric.length;
+ while (len--) {
+ if (typeof urlOptions[numeric[len]] === 'string') {
+ try {
+ urlOptions[numeric[len]] = parseInt(urlOptions[numeric[len]]);
+ }
+ catch (e) {
+ console.log('failed to parse URL hash parameter ' + numeric[len]);
+ urlOptions[numeric[len]] = 0;
+ }
+ }
+ }
+
+ if (urlOptions.alarm_when) {
+ // if alarm_when exists, create after/before params
+ // -/+ 2 minutes from the alarm, and reload the page
+ const alarmTime = new Date(urlOptions.alarm_when * 1000).valueOf();
+ const timeMarginMs = 120000; // 2 mins
+
+ const after = alarmTime - timeMarginMs;
+ const before = alarmTime + timeMarginMs;
+ const newHash = document.location.hash.replace(
+ /;alarm_when=[0-9]*/i,
+ ";after=" + after + ";before=" + before,
+ );
+ history.replaceState(null, '', newHash);
+ location.reload();
+ }
+
+ if (urlOptions.server !== null && urlOptions.server !== '') {
+ netdataServerStatic = document.location.origin.toString() + document.location.pathname.toString();
+ netdataServer = urlOptions.server;
+ netdataCheckXSS = true;
+ } else {
+ urlOptions.server = null;
+ }
+
+ if (urlOptions.before > 0 && urlOptions.after > 0) {
+ urlOptions.pan_and_zoom = true;
+ urlOptions.nowelcome = true;
+ } else {
+ urlOptions.pan_and_zoom = false;
+ }
+
+ if (urlOptions.highlight_before > 0 && urlOptions.highlight_after > 0) {
+ urlOptions.highlight = true;
+ } else {
+ urlOptions.highlight = false;
+ }
+
+ switch (urlOptions.mode) {
+ case 'print':
+ urlOptions.theme = 'white';
+ urlOptions.welcome = false;
+ urlOptions.help = false;
+ urlOptions.show_alarms = false;
+
+ if (urlOptions.pan_and_zoom === false) {
+ urlOptions.pan_and_zoom = true;
+ urlOptions.before = Date.now();
+ urlOptions.after = urlOptions.before - 600000;
+ }
+
+ netdataShowAlarms = false;
+ netdataRegistry = false;
+ this_is_demo = false;
+ break;
+
+ case 'live':
+ default:
+ urlOptions.mode = 'live';
+ break;
+ }
+
+ // console.log(urlOptions);
+ },
+
+ hashUpdate: function () {
+ history.replaceState(null, '', urlOptions.genHash(true));
+ },
+
+ netdataPanAndZoomCallback: function (status, after, before) {
+ //console.log(1);
+ //console.log(new Error().stack);
+
+ if (netdataSnapshotData === null) {
+ urlOptions.pan_and_zoom = status;
+ urlOptions.after = after;
+ urlOptions.before = before;
+ urlOptions.hashUpdate();
+ }
+ },
+
+ netdataHighlightCallback: function (status, after, before) {
+ //console.log(2);
+ //console.log(new Error().stack);
+
+ if (status === true && (after === null || before === null || after <= 0 || before <= 0 || after >= before)) {
+ status = false;
+ after = 0;
+ before = 0;
+ }
+
+ if (netdataSnapshotData === null) {
+ urlOptions.highlight = status;
+ } else {
+ urlOptions.highlight = false;
+ }
+
+ urlOptions.highlight_after = Math.round(after);
+ urlOptions.highlight_before = Math.round(before);
+ urlOptions.hashUpdate();
+
+ var show_eye = NETDATA.globalChartUnderlay.hasViewport();
+
+ if (status === true && after > 0 && before > 0 && after < before) {
+ var d1 = NETDATA.dateTime.localeDateString(after);
+ var d2 = NETDATA.dateTime.localeDateString(before);
+ if (d1 === d2) {
+ d2 = '';
+ }
+ document.getElementById('navbar-highlight-content').innerHTML =
+ ((show_eye === true) ? '<span class="navbar-highlight-bar highlight-tooltip" onclick="urlOptions.showHighlight();" title="restore the highlighted view" data-toggle="tooltip" data-placement="bottom">' : '<span>').toString()
+ + 'highlighted time-frame'
+ + ' <b>' + d1 + ' <code>' + NETDATA.dateTime.localeTimeString(after) + '</code></b> to '
+ + ' <b>' + d2 + ' <code>' + NETDATA.dateTime.localeTimeString(before) + '</code></b>, '
+ + 'duration <b>' + NETDATA.seconds4human(Math.round((before - after) / 1000)) + '</b>'
+ + '</span>'
+ + '<span class="navbar-highlight-button-right highlight-tooltip" onclick="urlOptions.clearHighlight();" title="clear the highlighted time-frame" data-toggle="tooltip" data-placement="bottom"><i class="fas fa-times"></i></span>';
+
+ $('.navbar-highlight').show();
+
+ $('.highlight-tooltip').tooltip({
+ html: true,
+ delay: {show: 500, hide: 0},
+ container: 'body'
+ });
+ } else {
+ $('.navbar-highlight').hide();
+ }
+ },
+
+ clearHighlight: function () {
+ NETDATA.globalChartUnderlay.clear();
+
+ if (NETDATA.globalPanAndZoom.isActive() === true) {
+ NETDATA.globalPanAndZoom.clearMaster();
+ }
+ },
+
+ showHighlight: function () {
+ NETDATA.globalChartUnderlay.focus();
+ }
+};
+
+urlOptions.parseHash();
+
+// --------------------------------------------------------------------
+// check options that should be processed before loading netdata.js
+
+var localStorageTested = -1;
+
+function localStorageTest() {
+ if (localStorageTested !== -1) {
+ return localStorageTested;
+ }
+
+ if (typeof Storage !== "undefined" && typeof localStorage === 'object') {
+ var test = 'test';
+ try {
+ localStorage.setItem(test, test);
+ localStorage.removeItem(test);
+ localStorageTested = true;
+ }
+ catch (e) {
+ console.log(e);
+ localStorageTested = false;
+ }
+ } else {
+ localStorageTested = false;
+ }
+
+ return localStorageTested;
+}
+
+function loadLocalStorage(name) {
+ var ret = null;
+
+ try {
+ if (localStorageTest() === true) {
+ ret = localStorage.getItem(name);
+ } else {
+ console.log('localStorage is not available');
+ }
+ }
+ catch (error) {
+ console.log(error);
+ return null;
+ }
+
+ if (typeof ret === 'undefined' || ret === null) {
+ return null;
+ }
+
+ // console.log('loaded: ' + name.toString() + ' = ' + ret.toString());
+
+ return ret;
+}
+
+function saveLocalStorage(name, value) {
+ // console.log('saving: ' + name.toString() + ' = ' + value.toString());
+ try {
+ if (localStorageTest() === true) {
+ localStorage.setItem(name, value.toString());
+ return true;
+ }
+ }
+ catch (error) {
+ console.log(error);
+ }
+
+ return false;
+}
+
+function getTheme(def) {
+ if (urlOptions.mode === 'print') {
+ return 'white';
+ }
+
+ var ret = loadLocalStorage('netdataTheme');
+ if (typeof ret === 'undefined' || ret === null || ret === 'undefined') {
+ return def;
+ } else {
+ return ret;
+ }
+}
+
+function setTheme(theme) {
+ if (urlOptions.mode === 'print') {
+ return false;
+ }
+
+ if (theme === netdataTheme) {
+ return false;
+ }
+ return saveLocalStorage('netdataTheme', theme);
+}
+
+var netdataTheme = getTheme('slate');
+var netdataShowHelp = true;
+
+if (urlOptions.theme !== null) {
+ setTheme(urlOptions.theme);
+ netdataTheme = urlOptions.theme;
+} else {
+ urlOptions.theme = netdataTheme;
+}
+
+if (urlOptions.help !== null) {
+ saveLocalStorage('options.show_help', urlOptions.help);
+ netdataShowHelp = urlOptions.help;
+} else {
+ urlOptions.help = loadLocalStorage('options.show_help');
+}
+
+// --------------------------------------------------------------------
+// natural sorting
+// http://www.davekoelle.com/files/alphanum.js - LGPL
+
+function naturalSortChunkify(t) {
+ var tz = [];
+ var x = 0, y = -1, n = 0, i, j;
+
+ while (i = (j = t.charAt(x++)).charCodeAt(0)) {
+ var m = (i >= 48 && i <= 57);
+ if (m !== n) {
+ tz[++y] = "";
+ n = m;
+ }
+ tz[y] += j;
+ }
+
+ return tz;
+}
+
+function naturalSortCompare(a, b) {
+ var aa = naturalSortChunkify(a.toLowerCase());
+ var bb = naturalSortChunkify(b.toLowerCase());
+
+ for (var x = 0; aa[x] && bb[x]; x++) {
+ if (aa[x] !== bb[x]) {
+ var c = Number(aa[x]), d = Number(bb[x]);
+ if (c.toString() === aa[x] && d.toString() === bb[x]) {
+ return c - d;
+ } else {
+ return (aa[x] > bb[x]) ? 1 : -1;
+ }
+ }
+ }
+
+ return aa.length - bb.length;
+}
+
+// --------------------------------------------------------------------
+// saving files to client
+
+function saveTextToClient(data, filename) {
+ var blob = new Blob([data], {
+ type: 'application/octet-stream'
+ });
+
+ var url = URL.createObjectURL(blob);
+ var link = document.createElement('a');
+ link.setAttribute('href', url);
+ link.setAttribute('download', filename);
+
+ var el = document.getElementById('hiddenDownloadLinks');
+ el.innerHTML = '';
+ el.appendChild(link);
+
+ setTimeout(function () {
+ el.removeChild(link);
+ URL.revokeObjectURL(url);
+ }, 60);
+
+ link.click();
+}
+
+function saveObjectToClient(data, filename) {
+ saveTextToClient(JSON.stringify(data), filename);
+}
+
+// -----------------------------------------------------------------------------
+// registry call back to render my-netdata menu
+
+function toggleExpandIcon(svgEl) {
+ if (svgEl.getAttribute('data-icon') === 'caret-down') {
+ svgEl.setAttribute('data-icon', 'caret-up');
+ } else {
+ svgEl.setAttribute('data-icon', 'caret-down');
+ }
+}
+
+function toggleAgentItem(e, guid) {
+ e.stopPropagation();
+ e.preventDefault();
+
+ toggleExpandIcon(e.currentTarget.children[0]);
+
+ const el = document.querySelector(`.agent-alternate-urls.agent-${guid}`);
+ if (el) {
+ el.classList.toggle('collapsed');
+ }
+}
+
+// When you stream metrics from netdata to netdata, the recieving netdata now
+// has multiple host databases. It's own, and multiple mirrored. Mirrored databases
+// can be accessed with <http://localhost:19999/host/NAME/>
+const OLD_DASHBOARD_SUFFIX = "old"
+let isOldSuffix = true
+try {
+ const currentScriptMainJs = document.currentScript;
+ const mainJsSrc = currentScriptMainJs.getAttribute("src")
+ isOldSuffix = mainJsSrc.startsWith("../main.js")
+} catch {
+ console.warn("current script not detecting, assuming the dashboard is running with /old suffix")
+}
+
+function transformWithOldSuffix(url) {
+ return isOldSuffix ? `../${url}` : url
+}
+
+function renderStreamedHosts(options) {
+ let html = `<div class="info-item">Databases streamed to this agent</div>`;
+
+ var base = document.location.origin.toString() +
+ document.location.pathname.toString()
+ .replace(isOldSuffix ? `/${OLD_DASHBOARD_SUFFIX}` : "", "");
+ if (base.endsWith("/host/" + options.hostname + "/")) {
+ base = base.substring(0, base.length - ("/host/" + options.hostname + "/").toString().length);
+ }
+
+ if (base.endsWith("/")) {
+ base = base.substring(0, base.length - 1);
+ }
+
+ var master = options.hosts[0].hostname;
+ // We sort a clone of options.hosts, to keep the master as the first element
+ // for future calls.
+ var sorted = options.hosts.slice(0).sort(function (a, b) {
+ if (a.hostname === master) {
+ return -1;
+ }
+ return naturalSortCompare(a.hostname, b.hostname);
+ });
+
+ let displayedDatabases = false;
+
+ for (var s of sorted) {
+ let url, icon;
+ const hostname = s.hostname;
+
+ if (myNetdataMenuFilterValue !== "") {
+ if (!hostname.includes(myNetdataMenuFilterValue)) {
+ continue;
+ }
+ }
+
+ displayedDatabases = true;
+
+ if (hostname === master) {
+ url = isOldSuffix ? `${base}/${OLD_DASHBOARD_SUFFIX}/` : `${base}/`;
+ icon = 'home';
+ } else {
+ url = isOldSuffix ? `${base}/host/${hostname}/${OLD_DASHBOARD_SUFFIX}/` : `${base}/host/${hostname}/`;
+ icon = 'window-restore';
+ }
+
+ html += (
+ `<div class="agent-item">
+ <a class="registry_link" href="${url}#" onClick="return gotoHostedModalHandler('${url}');">
+ <i class="fas fa-${icon}" style="color: #999;"></i>
+ </a>
+ <span class="__title" onClick="return gotoHostedModalHandler('${url}');">
+ <a class="registry_link" href="${url}#">${hostname}</a>
+ </span>
+ <div></div>
+ </div>`
+ )
+ }
+
+ if (!displayedDatabases) {
+ html += (
+ `<div class="info-item">
+ <i class="fas fa-filter"></i>
+ <span style="margin-left: 8px">no databases match the filter criteria.<span>
+ </div>`
+ )
+ }
+
+ return html;
+}
+
+function renderMachines(machinesArray) {
+ let html = `<div class="info-item">My nodes</div>`;
+
+ if (machinesArray === null) {
+ let ret = loadLocalStorage("registryCallback");
+ if (ret) {
+ machinesArray = JSON.parse(ret);
+ console.log("failed to contact the registry - loaded registry data from browser local storage");
+ }
+ }
+
+ let found = false;
+ let displayedAgents = false;
+
+ const maskedURL = NETDATA.registry.MASKED_DATA;
+
+ if (machinesArray) {
+ saveLocalStorage("registryCallback", JSON.stringify(machinesArray));
+
+ var machines = machinesArray.sort(function (a, b) {
+ return naturalSortCompare(a.name, b.name);
+ });
+
+ for (var machine of machines) {
+ found = true;
+
+ if (myNetdataMenuFilterValue !== "") {
+ if (!machine.name.includes(myNetdataMenuFilterValue)) {
+ continue;
+ }
+ }
+
+ displayedAgents = true;
+
+ const alternateUrlItems = (
+ `<div class="agent-alternate-urls agent-${machine.guid} collapsed">
+ ${machine.alternate_urls.reduce((str, url) => {
+ if (url === maskedURL) {
+ return str
+ }
+
+ return str + (
+ `<div class="agent-item agent-item--alternate">
+ <div></div>
+ <a href="${url}" title="${url}">${truncateString(url, 64)}</a>
+ <a href="#" onclick="deleteRegistryModalHandler('${machine.guid}', '${machine.name}', '${url}'); return false;">
+ <i class="fas fa-trash" style="color: #777;"></i>
+ </a>
+ </div>`
+ )
+ },
+ ''
+ )}
+ </div>`
+ )
+
+ html += (
+ `<div class="agent-item agent-${machine.guid}">
+ <i class="fas fa-chart-bar" color: #fff"></i>
+ <span class="__title" onClick="return gotoServerModalHandler('${machine.guid}');">
+ <a class="registry_link" href="${machine.url}#">${machine.name}</a>
+ </span>
+ <a href="#" onClick="toggleAgentItem(event, '${machine.guid}');">
+ <i class="fas fa-caret-down" style="color: #999"></i>
+ </a>
+ </div>
+ ${alternateUrlItems}`
+ )
+ }
+
+ if (found && (!displayedAgents)) {
+ html += (
+ `<div class="info-item">
+ <i class="fas fa-filter"></i>
+ <span style="margin-left: 8px">zero nodes are matching the filter value.<span>
+ </div>`
+ )
+ }
+ }
+
+ if (!found) {
+ if (machines) {
+ html += (
+ `<div class="info-item">
+ <a href="https://github.com/netdata/netdata/tree/master/registry#registry" target="_blank">Your nodes list is empty</a>
+ </div>`
+ )
+ } else {
+ html += (
+ `<div class="info-item">
+ <a href="https://github.com/netdata/netdata/tree/master/registry#registry" target="_blank">Failed to contact the registry</a>
+ </div>`
+ )
+ }
+
+ html += `<hr />`;
+ html += `<div class="info-item">Demo netdata nodes</div>`;
+
+ const demoServers = [
+ {url: "//london.netdata.rocks/default.html", title: "UK - London (DigitalOcean.com)"},
+ {url: "//newyork.netdata.rocks/default.html", title: "US - New York (DigitalOcean.com)"},
+ {url: "//sanfrancisco.netdata.rocks/default.html", title: "US - San Francisco (DigitalOcean.com)"},
+ {url: "//atlanta.netdata.rocks/default.html", title: "US - Atlanta (CDN77.com)"},
+ {url: "//frankfurt.netdata.rocks/default.html", title: "Germany - Frankfurt (DigitalOcean.com)"},
+ {url: "//toronto.netdata.rocks/default.html", title: "Canada - Toronto (DigitalOcean.com)"},
+ {url: "//singapore.netdata.rocks/default.html", title: "Japan - Singapore (DigitalOcean.com)"},
+ {url: "//bangalore.netdata.rocks/default.html", title: "India - Bangalore (DigitalOcean.com)"},
+
+ ]
+
+ for (var server of demoServers) {
+ html += (
+ `<div class="agent-item">
+ <i class="fas fa-chart-bar" style="color: #fff"></i>
+ <a href="${server.url}">${server.title}</a>
+ <div></div>
+ </div>
+ `
+ );
+ }
+ }
+
+ return html;
+}
+
+function setMyNetdataMenu(html) {
+ const el = document.getElementById('my-netdata-dropdown-content')
+ el.innerHTML = html;
+}
+
+function clearMyNetdataMenu() {
+ setMyNetdataMenu(`<div class="agent-item" style="white-space: nowrap">
+ <i class="fas fa-hourglass-half"></i>
+ Loading, please wait...
+ <div></div>
+ </div>`);
+}
+
+function errorMyNetdataMenu() {
+ setMyNetdataMenu(`<div class="agent-item" style="padding: 0 8px">
+ <i class="fas fa-exclamation-triangle" style="color: red"></i>
+ Cannot load known Netdata agents from Netdata Cloud! Please make sure you have the latest version of Netdata.
+ </div>`);
+}
+
+function restrictMyNetdataMenu() {
+ setMyNetdataMenu(`<div class="info-item" style="white-space: nowrap">
+ <span>Please <a href="#" onclick="signInDidClick(event); return false">sign in to netdata.cloud</a> to view your nodes!</span>
+ <div></div>
+ </div>`);
+}
+
+function openAuthenticatedUrl(url) {
+ if (isSignedIn()) {
+ window.open(url);
+ } else {
+ window.open(`${NETDATA.registry.cloudBaseURL}/account/sign-in-agent?id=${NETDATA.registry.machine_guid}&name=${encodeURIComponent(NETDATA.registry.hostname)}&origin=${encodeURIComponent(window.location.origin + "/")}&redirect_uri=${encodeURIComponent(window.location.origin + "/" + url)}`);
+ }
+}
+
+function renderMyNetdataMenu(machinesArray) {
+ const el = document.getElementById('my-netdata-dropdown-content');
+ el.classList.add(`theme-${netdataTheme}`);
+
+ if (machinesArray == registryAgents) {
+ console.log("Rendering my-netdata menu from registry");
+ } else {
+ console.log("Rendering my-netdata menu from netdata.cloud", machinesArray);
+ }
+
+ let html = '';
+
+ if (!isSignedIn()) {
+ if (!NETDATA.registry.isRegistryEnabled()) {
+ html += (
+ ``
+ );
+ }
+ }
+
+ if (isSignedIn()) {
+ html += (
+ `<div class="filter-control">
+ <input
+ id="my-netdata-menu-filter-input"
+ type="text"
+ placeholder="filter nodes..."
+ autofocus
+ autocomplete="off"
+ value="${myNetdataMenuFilterValue}"
+ onkeydown="myNetdataFilterDidChange(event)"
+ />
+ <span class="filter-control__clear" onclick="myNetdataFilterClearDidClick(event)"><i class="fas fa-times"></i><span>
+ </div>
+ <hr />`
+ );
+ }
+
+ // options.hosts = [
+ // {
+ // hostname: "streamed1",
+ // },
+ // {
+ // hostname: "streamed2",
+ // },
+ // ]
+
+ if (options.hosts.length > 1) {
+ html += `<div id="my-netdata-menu-streamed">${renderStreamedHosts(options)}</div><hr />`;
+ }
+
+ if (isSignedIn() || NETDATA.registry.isRegistryEnabled()) {
+ html += `<div id="my-netdata-menu-machines">${renderMachines(machinesArray)}</div><hr />`;
+ }
+
+ if (!isSignedIn()) {
+ html += (
+ `<div class="agent-item">
+ <i class="fas fa-cog""></i>
+ <a href="#" onclick="switchRegistryModalHandler(); return false;">更换标识</a>
+ <div></div>
+ </div>
+ <div class="agent-item">
+ <i class="fas fa-question-circle""></i>
+ <a href="https://github.com/netdata/netdata/tree/master/registry#registry" target="_blank">这是什么?</a>
+ <div></div>
+ </div>`
+ )
+ } else {
+ html += (
+ `<div class="agent-item">
+ <i class="fas fa-tv"></i>
+ <a onclick="openAuthenticatedUrl('console.html');" target="_blank">Nodes<sup class="beta"> beta</sup></a>
+ <div></div>
+ </div>
+ <div class="agent-item">
+ <i class="fas fa-sync"></i>
+ <a href="#" onclick="showSyncModal(); return false">Synchronize with netdata.cloud</a>
+ <div></div>
+ </div>
+ <div class="agent-item">
+ <i class="fas fa-question-circle""></i>
+ <a href="https://netdata.cloud/about" target="_blank">What is this?</a>
+ <div></div>
+ </div>`
+ )
+ }
+
+ el.innerHTML = html;
+
+ gotoServerInit();
+}
+
+function isdemo() {
+ if (this_is_demo !== null) {
+ return this_is_demo;
+ }
+ this_is_demo = false;
+
+ try {
+ if (typeof document.location.hostname === 'string') {
+ if (document.location.hostname.endsWith('.my-netdata.io') ||
+ document.location.hostname.endsWith('.mynetdata.io') ||
+ document.location.hostname.endsWith('.netdata.rocks') ||
+ document.location.hostname.endsWith('.netdata.ai') ||
+ document.location.hostname.endsWith('.netdata.live') ||
+ document.location.hostname.endsWith('.firehol.org') ||
+ document.location.hostname.endsWith('.netdata.online') ||
+ document.location.hostname.endsWith('.netdata.cloud')) {
+ this_is_demo = true;
+ }
+ }
+ }
+ catch (error) {
+ }
+ return this_is_demo;
+}
+
+function netdataURL(url, forReload) {
+ if (typeof url === 'undefined')
+ // url = document.location.toString();
+ {
+ url = '';
+ }
+
+ if (url.indexOf('#') !== -1) {
+ url = url.substring(0, url.indexOf('#'));
+ }
+
+ var hash = urlOptions.genHash(forReload);
+
+ // console.log('netdataURL: ' + url + hash);
+
+ return url + hash;
+}
+
+function netdataReload(url) {
+ document.location = verifyURL(netdataURL(url, true));
+
+ // since we play with hash
+ // this is needed to reload the page
+ location.reload();
+}
+
+function gotoHostedModalHandler(url) {
+ document.location = verifyURL(url + urlOptions.genHash());
+ return false;
+}
+
+var gotoServerValidateRemaining = 0;
+var gotoServerMiddleClick = false;
+var gotoServerStop = false;
+
+function gotoServerValidateUrl(id, guid, url) {
+ var penalty = 0;
+ var error = 'failed';
+
+ if (document.location.toString().startsWith('http://') && url.toString().startsWith('https://'))
+ // we penalize https only if the current url is http
+ // to allow the user walk through all its servers.
+ {
+ penalty = 500;
+ } else if (document.location.toString().startsWith('https://') && url.toString().startsWith('http://')) {
+ error = 'can\'t check';
+ }
+
+ var finalURL = netdataURL(url);
+
+ setTimeout(function () {
+ document.getElementById('gotoServerList').innerHTML += '<tr><td style="padding-left: 20px;"><a href="' + verifyURL(finalURL) + '" target="_blank">' + escapeUserInputHTML(url) + '</a></td><td style="padding-left: 30px;"><code id="' + guid + '-' + id + '-status">checking...</code></td></tr>';
+
+ NETDATA.registry.hello(url, function (data) {
+ if (typeof data !== 'undefined' && data !== null && typeof data.machine_guid === 'string' && data.machine_guid === guid) {
+ // console.log('OK ' + id + ' URL: ' + url);
+ document.getElementById(guid + '-' + id + '-status').innerHTML = "OK";
+
+ if (!gotoServerStop) {
+ gotoServerStop = true;
+
+ if (gotoServerMiddleClick) {
+ window.open(verifyURL(finalURL), '_blank');
+ gotoServerMiddleClick = false;
+ document.getElementById('gotoServerResponse').innerHTML = '<b>Opening new window to ' + NETDATA.registry.machines[guid].name + '<br/><a href="' + verifyURL(finalURL) + '">' + escapeUserInputHTML(url) + '</a></b><br/>(check your pop-up blocker if it fails)';
+ } else {
+ document.getElementById('gotoServerResponse').innerHTML += 'found it! It is at:<br/><small>' + escapeUserInputHTML(url) + '</small>';
+ document.location = verifyURL(finalURL);
+ $('#gotoServerModal').modal('hide');
+ }
+ }
+ } else {
+ if (typeof data !== 'undefined' && data !== null && typeof data.machine_guid === 'string' && data.machine_guid !== guid) {
+ error = 'wrong machine';
+ }
+
+ document.getElementById(guid + '-' + id + '-status').innerHTML = error;
+ gotoServerValidateRemaining--;
+ if (gotoServerValidateRemaining <= 0) {
+ gotoServerMiddleClick = false;
+ document.getElementById('gotoServerResponse').innerHTML = '<b>Sorry! I cannot find any operational URL for this server</b>';
+ }
+ }
+ });
+ }, (id * 50) + penalty);
+}
+
+function gotoServerModalHandler(guid) {
+ // console.log('goto server: ' + guid);
+
+ gotoServerStop = false;
+ var checked = {};
+ var len = NETDATA.registry.machines[guid].alternate_urls.length;
+ var count = 0;
+
+ document.getElementById('gotoServerResponse').innerHTML = '';
+ document.getElementById('gotoServerList').innerHTML = '';
+ document.getElementById('gotoServerName').innerHTML = NETDATA.registry.machines[guid].name;
+ $('#gotoServerModal').modal('show');
+
+ gotoServerValidateRemaining = len;
+ while (len--) {
+ var url = NETDATA.registry.machines[guid].alternate_urls[len];
+ checked[url] = true;
+ gotoServerValidateUrl(count++, guid, url);
+ }
+
+ if (!isSignedIn()) {
+ // When the registry is enabled, if the user's known URLs are not working
+ // we consult the registry to get additional URLs.
+ setTimeout(function () {
+ if (gotoServerStop === false) {
+ document.getElementById('gotoServerResponse').innerHTML = '<b>Added all the known URLs for this machine.</b>';
+ NETDATA.registry.search(guid, function (data) {
+ // console.log(data);
+ len = data.urls.length;
+ while (len--) {
+ var url = data.urls[len][1];
+ // console.log(url);
+ if (typeof checked[url] === 'undefined') {
+ gotoServerValidateRemaining++;
+ checked[url] = true;
+ gotoServerValidateUrl(count++, guid, url);
+ }
+ }
+ });
+ }
+ }, 2000);
+ }
+
+ 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;
+ document.getElementById('switchRegistryResponse').innerHTML = '';
+ $('#switchRegistryModal').modal('show');
+}
+
+function notifyForSwitchRegistry() {
+ var n = document.getElementById('switchRegistryPersonGUID').value;
+
+ if (n !== '' && n.length === 36) {
+ NETDATA.registry.switch(n, function (result) {
+ if (result !== null) {
+ $('#switchRegistryModal').modal('hide');
+ NETDATA.registry.init();
+ } else {
+ document.getElementById('switchRegistryResponse').innerHTML = "<b>Sorry! The registry rejected your request.</b>";
+ }
+ });
+ } else {
+ document.getElementById('switchRegistryResponse').innerHTML = "<b>The ID you have entered is not a GUID.</b>";
+ }
+}
+
+var deleteRegistryGuid = null;
+var deleteRegistryUrl = null;
+
+function deleteRegistryModalHandler(guid, name, url) {
+ // void (guid);
+
+ deleteRegistryGuid = guid;
+ deleteRegistryUrl = url;
+
+ document.getElementById('deleteRegistryServerName').innerHTML = name;
+ document.getElementById('deleteRegistryServerName2').innerHTML = name;
+ document.getElementById('deleteRegistryServerURL').innerHTML = url;
+ document.getElementById('deleteRegistryResponse').innerHTML = '';
+
+ $('#deleteRegistryModal').modal('show');
+}
+
+function notifyForDeleteRegistry() {
+ const responseEl = document.getElementById('deleteRegistryResponse');
+
+ if (deleteRegistryUrl) {
+ if (isSignedIn()) {
+ deleteCloudAgentURL(deleteRegistryGuid, deleteRegistryUrl)
+ .then((count) => {
+ if (!count) {
+ responseEl.innerHTML = "<b>Sorry, this command was rejected by netdata.cloud!</b>";
+ return;
+ }
+ NETDATA.registry.delete(deleteRegistryUrl, function (result) {
+ if (result === null) {
+ console.log("Received error from registry", result);
+ }
+
+ deleteRegistryUrl = null;
+ $('#deleteRegistryModal').modal('hide');
+ NETDATA.registry.init();
+ });
+ });
+ } else {
+ NETDATA.registry.delete(deleteRegistryUrl, function (result) {
+ if (result !== null) {
+ deleteRegistryUrl = null;
+ $('#deleteRegistryModal').modal('hide');
+ NETDATA.registry.init();
+ } else {
+ responseEl.innerHTML = "<b>Sorry, this command was rejected by the registry server!</b>";
+ }
+ });
+ }
+ }
+}
+
+var options = {
+ menus: {},
+ submenu_names: {},
+ data: null,
+ hostname: 'netdata_server', // will be overwritten by the netdata server
+ version: 'unknown',
+ release_channel: 'unknown',
+ hosts: [],
+
+ duration: 0, // the default duration of the charts
+ update_every: 1,
+
+ chartsPerRow: 0,
+ // chartsMinWidth: 1450,
+ chartsHeight: 180,
+};
+
+function chartsPerRow(total) {
+ void (total);
+
+ if (options.chartsPerRow === 0) {
+ return 1;
+ //var width = Math.floor(total / options.chartsMinWidth);
+ //if(width === 0) width = 1;
+ //return width;
+ } else {
+ return options.chartsPerRow;
+ }
+}
+
+function prioritySort(a, b) {
+ if (a.priority < b.priority) {
+ return -1;
+ }
+ if (a.priority > b.priority) {
+ return 1;
+ }
+ return naturalSortCompare(a.name, b.name);
+}
+
+function sortObjectByPriority(object) {
+ var idx = {};
+ var sorted = [];
+
+ for (var i in object) {
+ if (!object.hasOwnProperty(i)) {
+ continue;
+ }
+
+ if (typeof idx[i] === 'undefined') {
+ idx[i] = object[i];
+ sorted.push(i);
+ }
+ }
+
+ sorted.sort(function (a, b) {
+ if (idx[a].priority < idx[b].priority) {
+ return -1;
+ }
+ if (idx[a].priority > idx[b].priority) {
+ return 1;
+ }
+ return naturalSortCompare(a, b);
+ });
+
+ return sorted;
+}
+
+// ----------------------------------------------------------------------------
+// scroll to a section, without changing the browser history
+
+function scrollToId(hash) {
+ if (hash && hash !== '' && document.getElementById(hash) !== null) {
+ var offset = $('#' + hash).offset();
+ if (typeof offset !== 'undefined') {
+ //console.log('scrolling to ' + hash + ' at ' + offset.top.toString());
+ $('html, body').animate({scrollTop: offset.top - 30}, 0);
+ }
+ }
+
+ // we must return false to prevent the default action
+ return false;
+}
+
+// ----------------------------------------------------------------------------
+
+// user editable information
+var customDashboard = {
+ menu: {},
+ submenu: {},
+ context: {}
+};
+
+// netdata standard information
+var netdataDashboard = {
+ sparklines_registry: {},
+ os: 'unknown',
+
+ menu: {},
+ submenu: {},
+ context: {},
+
+ // generate a sparkline
+ // used in the documentation
+ sparkline: function (prefix, chart, dimension, units, suffix) {
+ if (options.data === null || typeof options.data.charts === 'undefined') {
+ return '';
+ }
+
+ if (typeof options.data.charts[chart] === 'undefined') {
+ return '';
+ }
+
+ if (typeof options.data.charts[chart].dimensions === 'undefined') {
+ return '';
+ }
+
+ if (typeof options.data.charts[chart].dimensions[dimension] === 'undefined') {
+ return '';
+ }
+
+ var key = chart + '.' + dimension;
+
+ if (typeof units === 'undefined') {
+ units = '';
+ }
+
+ if (typeof this.sparklines_registry[key] === 'undefined') {
+ this.sparklines_registry[key] = {count: 1};
+ } else {
+ this.sparklines_registry[key].count++;
+ }
+
+ key = key + '.' + this.sparklines_registry[key].count;
+
+ return prefix + '<div class="netdata-container" data-netdata="' + chart + '" data-after="-120" data-width="25%" data-height="15px" data-chart-library="dygraph" data-dygraph-theme="sparkline" data-dimensions="' + dimension + '" data-show-value-of-' + dimension + '-at="' + key + '"></div> (<span id="' + key + '" style="display: inline-block; min-width: 50px; text-align: right;">X</span>' + units + ')' + suffix;
+ },
+
+ gaugeChart: function (title, width, dimensions, colors) {
+ if (typeof colors === 'undefined') {
+ colors = '';
+ }
+
+ if (typeof dimensions === 'undefined') {
+ dimensions = '';
+ }
+
+ return '<div class="netdata-container" data-netdata="CHART_UNIQUE_ID"'
+ + ' data-dimensions="' + dimensions + '"'
+ + ' data-chart-library="gauge"'
+ + ' data-gauge-adjust="width"'
+ + ' data-title="' + title + '"'
+ + ' data-width="' + width + '"'
+ + ' data-before="0"'
+ + ' data-after="-CHART_DURATION"'
+ + ' data-points="CHART_DURATION"'
+ + ' data-colors="' + colors + '"'
+ + ' role="application"></div>';
+ },
+
+ anyAttribute: function (obj, attr, key, def) {
+ if (typeof (obj[key]) !== 'undefined') {
+ var x = obj[key][attr];
+
+ if (typeof (x) === 'undefined') {
+ return def;
+ }
+
+ if (typeof (x) === 'function') {
+ return x(netdataDashboard.os);
+ }
+
+ return x;
+ }
+
+ return def;
+ },
+
+ menuTitle: function (chart) {
+ if (typeof chart.menu_pattern !== 'undefined') {
+ return (this.anyAttribute(this.menu, 'title', chart.menu_pattern, chart.menu_pattern).toString()
+ + ' ' + chart.type.slice(-(chart.type.length - chart.menu_pattern.length - 1)).toString()).replace(/_/g, ' ');
+ }
+
+ return (this.anyAttribute(this.menu, 'title', chart.menu, chart.menu)).toString().replace(/_/g, ' ');
+ },
+
+ menuIcon: function (chart) {
+ if (typeof chart.menu_pattern !== 'undefined') {
+ return this.anyAttribute(this.menu, 'icon', chart.menu_pattern, '<i class="fas fa-puzzle-piece"></i>').toString();
+ }
+
+ return this.anyAttribute(this.menu, 'icon', chart.menu, '<i class="fas fa-puzzle-piece"></i>');
+ },
+
+ menuInfo: function (chart) {
+ if (typeof chart.menu_pattern !== 'undefined') {
+ return this.anyAttribute(this.menu, 'info', chart.menu_pattern, null);
+ }
+
+ return this.anyAttribute(this.menu, 'info', chart.menu, null);
+ },
+
+ menuHeight: function (chart) {
+ if (typeof chart.menu_pattern !== 'undefined') {
+ return this.anyAttribute(this.menu, 'height', chart.menu_pattern, 1.0);
+ }
+
+ return this.anyAttribute(this.menu, 'height', chart.menu, 1.0);
+ },
+
+ submenuTitle: function (menu, submenu) {
+ var key = menu + '.' + submenu;
+ // console.log(key);
+ var title = this.anyAttribute(this.submenu, 'title', key, submenu).toString().replace(/_/g, ' ');
+ if (title.length > 28) {
+ var a = title.substring(0, 13);
+ var b = title.substring(title.length - 12, title.length);
+ return a + '...' + b;
+ }
+ return title;
+ },
+
+ submenuInfo: function (menu, submenu) {
+ var key = menu + '.' + submenu;
+ return this.anyAttribute(this.submenu, 'info', key, null);
+ },
+
+ submenuHeight: function (menu, submenu, relative) {
+ var key = menu + '.' + submenu;
+ return this.anyAttribute(this.submenu, 'height', key, 1.0) * relative;
+ },
+
+ contextInfo: function (id) {
+ var x = this.anyAttribute(this.context, 'info', id, null);
+
+ if (x !== null) {
+ return '<div class="shorten dashboard-context-info netdata-chart-alignment" role="document">' + x + '</div>';
+ } else {
+ return '';
+ }
+ },
+
+ contextValueRange: function (id) {
+ if (typeof this.context[id] !== 'undefined' && typeof this.context[id].valueRange !== 'undefined') {
+ return this.context[id].valueRange;
+ } else {
+ return '[null, null]';
+ }
+ },
+
+ contextHeight: function (id, def) {
+ if (typeof this.context[id] !== 'undefined' && typeof this.context[id].height !== 'undefined') {
+ return def * this.context[id].height;
+ } else {
+ return def;
+ }
+ },
+
+ contextDecimalDigits: function (id, def) {
+ if (typeof this.context[id] !== 'undefined' && typeof this.context[id].decimalDigits !== 'undefined') {
+ return this.context[id].decimalDigits;
+ } else {
+ return def;
+ }
+ }
+};
+
+// ----------------------------------------------------------------------------
+
+// enrich the data structure returned by netdata
+// to reflect our menu system and content
+// TODO: this is a shame - we should fix charts naming (issue #807)
+function enrichChartData(chart) {
+ var parts = chart.type.split('_');
+ var tmp = parts[0];
+
+ switch (tmp) {
+ case 'ap':
+ case 'net':
+ case 'disk':
+ case 'powersupply':
+ case 'statsd':
+ chart.menu = tmp;
+ break;
+
+ case 'apache':
+ 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':
+ chart.menu = chart.type;
+ if (chart.id.match(/.*[\._\/-:]qemu[\._\/-:]*/) || chart.id.match(/.*[\._\/-:]kvm[\._\/-:]*/)) {
+ chart.menu_pattern = 'cgqemu';
+ } else {
+ chart.menu_pattern = 'cgroup';
+ }
+ break;
+
+ case 'go':
+ chart.menu = chart.type;
+ if (parts.length > 2 && parts[1] === 'expvar') {
+ chart.menu_pattern = tmp + '_' + parts[1];
+ } else if (parts.length > 1) {
+ chart.menu_pattern = tmp;
+ }
+ break;
+
+ case 'isc':
+ 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':
+ case 'web':
+ chart.menu = chart.type;
+ if (parts.length > 2 && parts[1] === 'log') {
+ chart.menu_pattern = tmp + '_' + parts[1];
+ } else if (parts.length > 1) {
+ chart.menu_pattern = tmp;
+ }
+ break;
+
+ case 'tc':
+ chart.menu = tmp;
+
+ // find a name for this device from fireqos info
+ // we strip '_(in|out)' or '(in|out)_'
+ if (chart.context === 'tc.qos' && (typeof options.submenu_names[chart.family] === 'undefined' || options.submenu_names[chart.family] === chart.family)) {
+ var n = chart.name.split('.')[1];
+ if (n.endsWith('_in')) {
+ options.submenu_names[chart.family] = n.slice(0, n.lastIndexOf('_in'));
+ } else if (n.endsWith('_out')) {
+ options.submenu_names[chart.family] = n.slice(0, n.lastIndexOf('_out'));
+ } else if (n.startsWith('in_')) {
+ options.submenu_names[chart.family] = n.slice(3, n.length);
+ } else if (n.startsWith('out_')) {
+ options.submenu_names[chart.family] = n.slice(4, n.length);
+ } else {
+ options.submenu_names[chart.family] = n;
+ }
+ }
+
+ // increase the priority of IFB devices
+ // to have inbound appear before outbound
+ if (chart.id.match(/.*-ifb$/)) {
+ chart.priority--;
+ }
+
+ break;
+
+ default:
+ chart.menu = chart.type;
+ if (parts.length > 1) {
+ chart.menu_pattern = tmp;
+ }
+ break;
+ }
+
+ chart.submenu = chart.family;
+}
+
+// ----------------------------------------------------------------------------
+
+function headMain(os, charts, duration) {
+ void (os);
+
+ if (urlOptions.mode === 'print') {
+ return '';
+ }
+
+ var head = '';
+
+ if (typeof charts['system.swap'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.swap"'
+ + ' data-dimensions="used"'
+ + ' data-append-options="percentage"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="Used Swap"'
+ + ' data-units="%"'
+ + ' data-easypiechart-max-value="100"'
+ + ' data-width="9%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-colors="#DD4400"'
+ + ' role="application"></div>';
+ }
+
+ if (typeof charts['system.io'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.io"'
+ + ' data-dimensions="in"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="磁碟读取"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.io.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.io"'
+ + ' data-dimensions="out"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="磁碟写入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.io.mainhead"'
+ + ' role="application"></div>';
+ }
+ else if (typeof charts['system.pgpgio'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.pgpgio"'
+ + ' data-dimensions="in"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="磁碟读取"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.pgpgio.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.pgpgio"'
+ + ' data-dimensions="out"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="磁碟写入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.pgpgio.mainhead"'
+ + ' role="application"></div>';
+ }
+
+ if (typeof charts['system.cpu'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.cpu"'
+ + ' data-chart-library="gauge"'
+ + ' data-title="CPU"'
+ + ' data-units="%"'
+ + ' data-gauge-max-value="100"'
+ + ' data-width="20%"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-colors="' + NETDATA.colors[12] + '"'
+ + ' role="application"></div>';
+ }
+
+ if (typeof charts['system.net'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.net"'
+ + ' data-dimensions="received"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="网路流入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.net.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.net"'
+ + ' data-dimensions="sent"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="网路流出"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.net.mainhead"'
+ + ' role="application"></div>';
+ }
+ else if (typeof charts['system.ip'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ip"'
+ + ' data-dimensions="received"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IP 流入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ip.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ip"'
+ + ' data-dimensions="sent"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IP 流出"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ip.mainhead"'
+ + ' role="application"></div>';
+ }
+ else if (typeof charts['system.ipv4'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ipv4"'
+ + ' data-dimensions="received"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IPv4 流入"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ipv4.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ipv4"'
+ + ' data-dimensions="sent"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IPv4 流出"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ipv4.mainhead"'
+ + ' role="application"></div>';
+ }
+ else if (typeof charts['system.ipv6'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ipv6"'
+ + ' data-dimensions="received"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IPv6 流入"'
+ + ' data-units="kbps"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ipv6.mainhead"'
+ + ' role="application"></div>';
+
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ipv6"'
+ + ' data-dimensions="sent"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="IPv6 流出"'
+ + ' data-units="kbps"'
+ + ' data-width="11%"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-common-units="system.ipv6.mainhead"'
+ + ' role="application"></div>';
+ }
+
+ if (typeof charts['system.ram'] !== 'undefined') {
+ head += '<div class="netdata-container" style="margin-right: 10px;" data-netdata="system.ram"'
+ + ' data-dimensions="used|buffers|active|wired"' // active and wired are FreeBSD stats
+ + ' data-append-options="percentage"'
+ + ' data-chart-library="easypiechart"'
+ + ' data-title="已用内存"'
+ + ' data-units="%"'
+ + ' data-easypiechart-max-value="100"'
+ + ' data-width="9%"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-points="' + duration.toString() + '"'
+ + ' data-colors="' + NETDATA.colors[7] + '"'
+ + ' role="application"></div>';
+ }
+
+ return head;
+}
+
+function generateHeadCharts(type, chart, duration) {
+ if (urlOptions.mode === 'print') {
+ return '';
+ }
+
+ var head = '';
+ var hcharts = netdataDashboard.anyAttribute(netdataDashboard.context, type, chart.context, []);
+ if (hcharts.length > 0) {
+ var hi = 0, hlen = hcharts.length;
+ while (hi < hlen) {
+ if (typeof hcharts[hi] === 'function') {
+ head += hcharts[hi](netdataDashboard.os, chart.id).replace(/CHART_DURATION/g, duration.toString()).replace(/CHART_UNIQUE_ID/g, chart.id);
+ } else {
+ head += hcharts[hi].replace(/CHART_DURATION/g, duration.toString()).replace(/CHART_UNIQUE_ID/g, chart.id);
+ }
+ hi++;
+ }
+ }
+ return head;
+}
+
+function renderPage(menus, data) {
+ var div = document.getElementById('charts_div');
+ var pcent_width = Math.floor(100 / chartsPerRow($(div).width()));
+
+ // find the proper duration for per-second updates
+ var duration = Math.round(($(div).width() * pcent_width / 100 * data.update_every / 3) / 60) * 60;
+ options.duration = duration;
+ options.update_every = data.update_every;
+
+ var html = '';
+ var sidebar = '<ul class="nav dashboard-sidenav" data-spy="affix" id="sidebar_ul">';
+ var mainhead = headMain(netdataDashboard.os, data.charts, duration);
+
+ // sort the menus
+ var main = sortObjectByPriority(menus);
+ var i = 0, len = main.length;
+ while (i < len) {
+ var menu = main[i++];
+
+ // generate an entry at the main menu
+
+ var menuid = NETDATA.name2id('menu_' + menu);
+ sidebar += '<li class=""><a href="#' + menuid + '" onClick="return scrollToId(\'' + menuid + '\');">' + menus[menu].icon + ' ' + menus[menu].title + '</a><ul class="nav">';
+ html += '<div role="section" class="dashboard-section"><div role="sectionhead"><h1 id="' + menuid + '" role="heading">' + menus[menu].icon + ' ' + menus[menu].title + '</h1></div><div role="section" class="dashboard-subsection">';
+
+ if (menus[menu].info !== null) {
+ html += menus[menu].info;
+ }
+
+ // console.log(' >> ' + menu + ' (' + menus[menu].priority + '): ' + menus[menu].title);
+
+ var shtml = '';
+ var mhead = '<div class="netdata-chart-row">' + mainhead;
+ mainhead = '';
+
+ // sort the submenus of this menu
+ var sub = sortObjectByPriority(menus[menu].submenus);
+ var si = 0, slen = sub.length;
+ while (si < slen) {
+ var submenu = sub[si++];
+
+ // generate an entry at the submenu
+ var submenuid = NETDATA.name2id('menu_' + menu + '_submenu_' + submenu);
+ sidebar += '<li class><a href="#' + submenuid + '" onClick="return scrollToId(\'' + submenuid + '\');">' + menus[menu].submenus[submenu].title + '</a></li>';
+ shtml += '<div role="section" class="dashboard-section-container" id="' + submenuid + '"><h2 id="' + submenuid + '" class="netdata-chart-alignment" role="heading">' + menus[menu].submenus[submenu].title + '</h2>';
+
+ if (menus[menu].submenus[submenu].info !== null) {
+ shtml += '<div class="dashboard-submenu-info netdata-chart-alignment" role="document">' + menus[menu].submenus[submenu].info + '</div>';
+ }
+
+ var head = '<div class="netdata-chart-row">';
+ var chtml = '';
+
+ // console.log(' \------- ' + submenu + ' (' + menus[menu].submenus[submenu].priority + '): ' + menus[menu].submenus[submenu].title);
+
+ // sort the charts in this submenu of this menu
+ menus[menu].submenus[submenu].charts.sort(prioritySort);
+ var ci = 0, clen = menus[menu].submenus[submenu].charts.length;
+ while (ci < clen) {
+ var chart = menus[menu].submenus[submenu].charts[ci++];
+
+ // generate the submenu heading charts
+ mhead += generateHeadCharts('mainheads', chart, duration);
+ head += generateHeadCharts('heads', chart, duration);
+
+ function chartCommonMin(family, context, units) {
+ var x = netdataDashboard.anyAttribute(netdataDashboard.context, 'commonMin', context, undefined);
+ if (typeof x !== 'undefined') {
+ return ' data-common-min="' + family + '/' + context + '/' + units + '"';
+ } else {
+ return '';
+ }
+ }
+
+ function chartCommonMax(family, context, units) {
+ var x = netdataDashboard.anyAttribute(netdataDashboard.context, 'commonMax', context, undefined);
+ if (typeof x !== 'undefined') {
+ return ' data-common-max="' + family + '/' + context + '/' + units + '"';
+ } else {
+ return '';
+ }
+ }
+
+ // generate the chart
+ if (urlOptions.mode === 'print') {
+ chtml += '<div role="row" class="dashboard-print-row">';
+ }
+
+ chtml += '<div class="netdata-chartblock-container" style="width: ' + pcent_width.toString() + '%;">' + netdataDashboard.contextInfo(chart.context) + '<div class="netdata-container" id="chart_' + NETDATA.name2id(chart.id) + '" data-netdata="' + chart.id + '"'
+ + ' data-width="100%"'
+ + ' data-height="' + netdataDashboard.contextHeight(chart.context, options.chartsHeight).toString() + 'px"'
+ + ' data-dygraph-valuerange="' + netdataDashboard.contextValueRange(chart.context) + '"'
+ + ' data-before="0"'
+ + ' data-after="-' + duration.toString() + '"'
+ + ' data-id="' + NETDATA.name2id(options.hostname + '/' + chart.id) + '"'
+ + ' data-colors="' + netdataDashboard.anyAttribute(netdataDashboard.context, 'colors', chart.context, '') + '"'
+ + ' data-decimal-digits="' + netdataDashboard.contextDecimalDigits(chart.context, -1) + '"'
+ + chartCommonMin(chart.family, chart.context, chart.units)
+ + chartCommonMax(chart.family, chart.context, chart.units)
+ + ' role="application"></div></div>';
+
+ if (urlOptions.mode === 'print') {
+ chtml += '</div>';
+ }
+ }
+
+ head += '</div>';
+ shtml += head + chtml + '</div>';
+ }
+
+ mhead += '</div>';
+ sidebar += '</ul></li>';
+ html += mhead + shtml + '</div></div><hr role="separator"/>';
+ }
+
+ const isMemoryModeDbEngine = data.memory_mode === "dbengine";
+ sidebar += '<li class="" style="padding-top:15px;"><a href="https://github.com/netdata/netdata/blob/master/docs/Add-more-charts-to-netdata.md#add-more-charts-to-netdata" target="_blank"><i class="fas fa-plus"></i> 加入更多图表</a></li>';
+ sidebar += '<li class=""><a href="https://github.com/netdata/netdata/tree/master/health#Health-monitoring" target="_blank"><i class="fas fa-plus"></i> 加入更多警报</a></li>';
+ sidebar += '<li class="" style="margin:20px;color:#666;"><small>每 ' +
+ ((data.update_every === 1) ? '秒' : data.update_every.toString() + ' 秒') + ', ' +
+ '收集<strong>' + data.dimensions_count.toLocaleString() + '</strong> 上的度量 ' +
+ data.hostname.toString() + ', 把它们呈现在<strong>' +
+ data.charts_count.toLocaleString() + '</strong> 图表' +
+ (isMemoryModeDbEngine ? '' : ',') + // oxford comma
+ ' 监控<strong>' +
+ data.alarms_count.toLocaleString() + '</strong> 警报.';
+
+ if (!isMemoryModeDbEngine) {
+ sidebar += '<br /> <br />获取更多历史记录 ' +
+ '<a href="https://learn.netdata.cloud/guides/longer-metrics-storage#using-the-round-robin-database" target=_blank>配置Netdata\'s <strong>历史</strong></a> 或使用 <a href="https://learn.netdata.cloud/docs/agent/database/engine/" target=_blank>DB 引擎.</a>';
+ }
+
+ sidebar += '<br/> <br/><strong>netdata</strong><br/>' + data.version.toString() + '</small></li>';
+ sidebar += '</ul>';
+ div.innerHTML = html;
+ document.getElementById('sidebar').innerHTML = sidebar;
+
+ if (urlOptions.highlight === true) {
+ NETDATA.globalChartUnderlay.init(null
+ , urlOptions.highlight_after
+ , urlOptions.highlight_before
+ , (urlOptions.after > 0) ? urlOptions.after : null
+ , (urlOptions.before > 0) ? urlOptions.before : null
+ );
+ } else {
+ NETDATA.globalChartUnderlay.clear();
+ }
+
+ if (urlOptions.mode === 'print') {
+ printPage();
+ } else {
+ finalizePage();
+ }
+}
+
+function renderChartsAndMenu(data) {
+ options.menus = {};
+ options.submenu_names = {};
+
+ var menus = options.menus;
+ var charts = data.charts;
+ var m, menu_key;
+
+ for (var c in charts) {
+ if (!charts.hasOwnProperty(c)) {
+ continue;
+ }
+
+ var chart = charts[c];
+ enrichChartData(chart);
+ m = chart.menu;
+
+ // create the menu
+ if (typeof menus[m] === 'undefined') {
+ menus[m] = {
+ menu_pattern: chart.menu_pattern,
+ priority: chart.priority,
+ submenus: {},
+ title: netdataDashboard.menuTitle(chart),
+ icon: netdataDashboard.menuIcon(chart),
+ info: netdataDashboard.menuInfo(chart),
+ height: netdataDashboard.menuHeight(chart) * options.chartsHeight
+ };
+ } else {
+ if (typeof (menus[m].menu_pattern) === 'undefined') {
+ menus[m].menu_pattern = chart.menu_pattern;
+ }
+
+ if (chart.priority < menus[m].priority) {
+ menus[m].priority = chart.priority;
+ }
+ }
+
+ menu_key = (typeof (menus[m].menu_pattern) !== 'undefined') ? menus[m].menu_pattern : m;
+
+ // create the submenu
+ if (typeof menus[m].submenus[chart.submenu] === 'undefined') {
+ menus[m].submenus[chart.submenu] = {
+ priority: chart.priority,
+ charts: [],
+ title: null,
+ info: netdataDashboard.submenuInfo(menu_key, chart.submenu),
+ height: netdataDashboard.submenuHeight(menu_key, chart.submenu, menus[m].height)
+ };
+ } else {
+ if (chart.priority < menus[m].submenus[chart.submenu].priority) {
+ menus[m].submenus[chart.submenu].priority = chart.priority;
+ }
+ }
+
+ // index the chart in the menu/submenu
+ menus[m].submenus[chart.submenu].charts.push(chart);
+ }
+
+ // propagate the descriptive subname given to QoS
+ // to all the other submenus with the same name
+ for (var m in menus) {
+ if (!menus.hasOwnProperty(m)) {
+ continue;
+ }
+
+ for (var s in menus[m].submenus) {
+ if (!menus[m].submenus.hasOwnProperty(s)) {
+ continue;
+ }
+
+ // set the family using a name
+ if (typeof options.submenu_names[s] !== 'undefined') {
+ menus[m].submenus[s].title = s + ' (' + options.submenu_names[s] + ')';
+ } else {
+ menu_key = (typeof (menus[m].menu_pattern) !== 'undefined') ? menus[m].menu_pattern : m;
+ menus[m].submenus[s].title = netdataDashboard.submenuTitle(menu_key, s);
+ }
+ }
+ }
+
+ renderPage(menus, data);
+}
+
+// ----------------------------------------------------------------------------
+
+function loadJs(url, callback) {
+ $.ajax({
+ url: url.startsWith("http") ? url : transformWithOldSuffix(url),
+ cache: true,
+ dataType: "script",
+ xhrFields: {withCredentials: true} // required for the cookie
+ })
+ .fail(function () {
+ alert('Cannot load required JS library: ' + url);
+ })
+ .always(function () {
+ if (typeof callback === 'function') {
+ callback();
+ }
+ })
+}
+
+var clipboardLoaded = false;
+
+function loadClipboard(callback) {
+ if (clipboardLoaded === false) {
+ clipboardLoaded = true;
+ loadJs('lib/clipboard-polyfill-be05dad.js', callback);
+ } else {
+ callback();
+ }
+}
+
+var bootstrapTableLoaded = false;
+
+function loadBootstrapTable(callback) {
+ if (bootstrapTableLoaded === false) {
+ bootstrapTableLoaded = true;
+ loadJs('lib/bootstrap-table-1.11.0.min.js', function () {
+ loadJs('lib/bootstrap-table-export-1.11.0.min.js', function () {
+ loadJs('lib/tableExport-1.6.0.min.js', callback);
+ })
+ });
+ } else {
+ callback();
+ }
+}
+
+var bootstrapSliderLoaded = false;
+
+function loadBootstrapSlider(callback) {
+ if (bootstrapSliderLoaded === false) {
+ bootstrapSliderLoaded = true;
+ loadJs('lib/bootstrap-slider-10.0.0.min.js', function () {
+ NETDATA._loadCSS(transformWithOldSuffix("css/bootstrap-slider-10.0.0.min.css"));
+ callback();
+ });
+ } else {
+ callback();
+ }
+}
+
+var lzStringLoaded = false;
+
+function loadLzString(callback) {
+ if (lzStringLoaded === false) {
+ lzStringLoaded = true;
+ loadJs('lib/lz-string-1.4.4.min.js', callback);
+ } else {
+ callback();
+ }
+}
+
+var pakoLoaded = false;
+
+function loadPako(callback) {
+ if (pakoLoaded === false) {
+ pakoLoaded = true;
+ loadJs('lib/pako-1.0.6.min.js', callback);
+ } else {
+ callback();
+ }
+}
+
+// ----------------------------------------------------------------------------
+
+function clipboardCopy(text) {
+ clipboard.writeText(text);
+}
+
+function clipboardCopyBadgeEmbed(url) {
+ clipboard.writeText('<embed src="' + url + '" type="image/svg+xml" height="20"/>');
+}
+
+// ----------------------------------------------------------------------------
+
+function alarmsUpdateModal() {
+ var active = '<h3>触发警报</h3><table class="table">';
+ var all = '<h3>所有作用中的警报</h3><div class="panel-group" id="alarms_all_accordion" role="tablist" aria-multiselectable="true">';
+ var footer = '<hr/><a href="https://github.com/netdata/netdata/tree/master/web/api/badges#netdata-badges" target="_blank">netdata badges</a> 会自动重新整理。不同颜色分表代表的警报状态：<span style="color: #e05d44"><b> 红色 </b></span> 表示重大，<span style="color:#fe7d37"><b> 橘色 </b></span> 表示警告，<span style="color: #4c1"><b> 绿色 </b></span> 表示良好，<span style="color: #9f9f9f"><b> 灰色 </b></span> 表示未定义 (例如无资料或无状态)，<span style="color: #000"><b> 黑色 </b></span> 表示尚未初始化。您可以复制这里的网址并将它们嵌入到任一个网页。<br/>netdata 能够发送这些警报通知。请参阅 <a href="https://github.com/netdata/netdata/blob/master/health/notifications/health_alarm_notify.conf">这个设定档</a> 了解更多资讯。';
+
+ loadClipboard(function () {
+ });
+
+ NETDATA.alarms.get('all', function (data) {
+ options.alarm_families = [];
+
+ alarmsCallback(data);
+
+ if (data === null) {
+ document.getElementById('alarms_active').innerHTML =
+ document.getElementById('alarms_all').innerHTML =
+ document.getElementById('alarms_log').innerHTML =
+ 'failed to load alarm data!';
+ return;
+ }
+
+ function alarmid4human(id) {
+ if (id === 0) {
+ return '-';
+ }
+
+ return id.toString();
+ }
+
+ function timestamp4human(timestamp, space) {
+ if (timestamp === 0) {
+ return '-';
+ }
+
+ if (typeof space === 'undefined') {
+ space = ' ';
+ }
+
+ var t = new Date(timestamp * 1000);
+ var now = new Date();
+
+ if (t.toDateString() === now.toDateString()) {
+ return t.toLocaleTimeString();
+ }
+
+ return t.toLocaleDateString() + space + t.toLocaleTimeString();
+ }
+
+ function alarm_lookup_explain(alarm, chart) {
+ var dimensions = ' of all values ';
+
+ if (chart.dimensions.length > 1) {
+ dimensions = ' of the sum of all dimensions ';
+ }
+
+ if (typeof alarm.lookup_dimensions !== 'undefined') {
+ var d = alarm.lookup_dimensions.replace(/|/g, ',');
+ var x = d.split(',');
+ if (x.length > 1) {
+ dimensions = 'of the sum of dimensions <code>' + alarm.lookup_dimensions + '</code> ';
+ } else {
+ dimensions = 'of all values of dimension <code>' + alarm.lookup_dimensions + '</code> ';
+ }
+ }
+
+ return '<code>' + alarm.lookup_method + '</code> '
+ + dimensions + ', of chart <code>' + alarm.chart + '</code>'
+ + ', starting <code>' + NETDATA.seconds4human(alarm.lookup_after + alarm.lookup_before, { space: ' ' }) + '</code> and up to <code>' + NETDATA.seconds4human(alarm.lookup_before, { space: ' ' }) + '</code>'
+ + ((alarm.lookup_options) ? (', with options <code>' + alarm.lookup_options.replace(/ /g, ', ') + '</code>') : '')
+ + '.';
+ }
+
+ function alarm_to_html(alarm, full) {
+ var chart = options.data.charts[alarm.chart];
+ if (typeof (chart) === 'undefined') {
+ chart = options.data.charts_by_name[alarm.chart];
+ if (typeof (chart) === 'undefined') {
+ // this means the charts loaded are incomplete
+ // probably netdata was restarted and more alarms
+ // are now available.
+ console.log('Cannot find chart ' + alarm.chart + ', you probably need to refresh the page.');
+ return '';
+ }
+ }
+
+ var has_alarm = (typeof alarm.warn !== 'undefined' || typeof alarm.crit !== 'undefined');
+ var badge_url = NETDATA.alarms.server + '/api/v1/badge.svg?chart=' + alarm.chart + '&alarm=' + alarm.name + '&refresh=auto';
+
+ var action_buttons = '<br/> <br/>role: <b>' + alarm.recipient + '</b><br/> <br/>'
+ + '<div class="action-button ripple" title="click to scroll the dashboard to the chart of this alarm" data-toggle="tooltip" data-placement="bottom" onClick="scrollToChartAfterHidingModal(\'' + alarm.chart + '\', ' + alarm.last_status_change * 1000 + ', \'' + alarm.status + '\'); $(\'#alarmsModal\').modal(\'hide\'); return false;"><i class="fab fa-periscope"></i></div>'
+ + '<div class="action-button ripple" title="click to copy to the clipboard the URL of this badge" data-toggle="tooltip" data-placement="bottom" onClick="clipboardCopy(\'' + badge_url + '\'); return false;"><i class="far fa-copy"></i></div>'
+ + '<div class="action-button ripple" title="click to copy to the clipboard an auto-refreshing <code>embed</code> html element for this badge" data-toggle="tooltip" data-placement="bottom" onClick="clipboardCopyBadgeEmbed(\'' + badge_url + '\'); return false;"><i class="fas fa-copy"></i></div>';
+
+ var html = '<tr><td class="text-center" style="vertical-align:middle" width="40%"><b>' + alarm.chart + '</b><br/> <br/><embed src="' + badge_url + '" type="image/svg+xml" height="20"/><br/> <br/><span style="font-size: 18px">' + alarm.info + '</span>' + action_buttons + '</td>'
+ + '<td><table class="table">'
+ + ((typeof alarm.warn !== 'undefined') ? ('<tr><td width="10%" style="text-align:right">warning when</td><td><span style="font-family: monospace; color:#fe7d37; font-weight: bold;">' + alarm.warn + '</span></td></tr>') : '')
+ + ((typeof alarm.crit !== 'undefined') ? ('<tr><td width="10%" style="text-align:right">critical when</td><td><span style="font-family: monospace; color: #e05d44; font-weight: bold;">' + alarm.crit + '</span></td></tr>') : '');
+
+ if (full === true) {
+ var units = chart.units;
+ if (units === '%') {
+ units = '%';
+ }
+
+ html += ((typeof alarm.lookup_after !== 'undefined') ? ('<tr><td width="10%" style="text-align:right">db lookup</td><td>' + alarm_lookup_explain(alarm, chart) + '</td></tr>') : '')
+ + ((typeof alarm.calc !== 'undefined') ? ('<tr><td width="10%" style="text-align:right">calculation</td><td><span style="font-family: monospace;">' + alarm.calc + '</span></td></tr>') : '')
+ + ((chart.green !== null) ? ('<tr><td width="10%" style="text-align:right">green threshold</td><td><code>' + chart.green + ' ' + units + '</code></td></tr>') : '')
+ + ((chart.red !== null) ? ('<tr><td width="10%" style="text-align:right">red threshold</td><td><code>' + chart.red + ' ' + units + '</code></td></tr>') : '');
+ }
+
+ if (alarm.warn_repeat_every > 0) {
+ html += '<tr><td width="10%" style="text-align:right">repeat warning</td><td>' + NETDATA.seconds4human(alarm.warn_repeat_every) + '</td></tr>';
+ }
+
+ if (alarm.crit_repeat_every > 0) {
+ html += '<tr><td width="10%" style="text-align:right">repeat critical</td><td>' + NETDATA.seconds4human(alarm.crit_repeat_every) + '</td></tr>';
+ }
+
+ var delay = '';
+ if ((alarm.delay_up_duration > 0 || alarm.delay_down_duration > 0) && alarm.delay_multiplier !== 0 && alarm.delay_max_duration > 0) {
+ if (alarm.delay_up_duration === alarm.delay_down_duration) {
+ delay += '<small><br/>hysteresis ' + NETDATA.seconds4human(alarm.delay_up_duration, {
+ space: ' ',
+ negative_suffix: ''
+ });
+ } else {
+ delay = '<small><br/>hysteresis ';
+ if (alarm.delay_up_duration > 0) {
+ delay += 'on escalation <code>' + NETDATA.seconds4human(alarm.delay_up_duration, {
+ space: ' ',
+ negative_suffix: ''
+ }) + '</code>, ';
+ }
+ if (alarm.delay_down_duration > 0) {
+ delay += 'on recovery <code>' + NETDATA.seconds4human(alarm.delay_down_duration, {
+ space: ' ',
+ negative_suffix: ''
+ }) + '</code>, ';
+ }
+ }
+ if (alarm.delay_multiplier !== 1.0) {
+ delay += 'multiplied by <code>' + alarm.delay_multiplier.toString() + '</code>';
+ delay += ', up to <code>' + NETDATA.seconds4human(alarm.delay_max_duration, {
+ space: ' ',
+ negative_suffix: ''
+ }) + '</code>';
+ }
+ delay += '</small>';
+ }
+
+ html += '<tr><td width="10%" style="text-align:right">check every</td><td>' + NETDATA.seconds4human(alarm.update_every, {
+ space: ' ',
+ negative_suffix: ''
+ }) + '</td></tr>'
+ + ((has_alarm === true) ? ('<tr><td width="10%" style="text-align:right">execute</td><td><span style="font-family: monospace;">' + alarm.exec + '</span>' + delay + '</td></tr>') : '')
+ + '<tr><td width="10%" style="text-align:right">source</td><td><span style="font-family: monospace;">' + alarm.source + '</span></td></tr>'
+ + '</table></td></tr>';
+
+ return html;
+ }
+
+ function alarm_family_show(id) {
+ var html = '<table class="table">';
+ var family = options.alarm_families[id];
+ var len = family.arr.length;
+ while (len--) {
+ var alarm = family.arr[len];
+ html += alarm_to_html(alarm, true);
+ }
+ html += '</table>';
+
+ $('#alarm_all_' + id.toString()).html(html);
+ enableTooltipsAndPopovers();
+ }
+
+ // find the proper family of each alarm
+ var x, family, alarm;
+ var count_active = 0;
+ var count_all = 0;
+ var families = {};
+ var families_sort = [];
+ for (x in data.alarms) {
+ if (!data.alarms.hasOwnProperty(x)) {
+ continue;
+ }
+
+ alarm = data.alarms[x];
+ family = alarm.family;
+
+ // find the chart
+ var chart = options.data.charts[alarm.chart];
+ if (typeof chart === 'undefined') {
+ chart = options.data.charts_by_name[alarm.chart];
+ }
+
+ // not found - this should never happen!
+ if (typeof chart === 'undefined') {
+ console.log('WARNING: alarm ' + x + ' is linked to chart ' + alarm.chart + ', which is not found in the list of chart got from the server.');
+ chart = { priority: 9999999 };
+ }
+ else if (typeof chart.menu !== 'undefined' && typeof chart.submenu !== 'undefined')
+ // the family based on the chart
+ {
+ family = chart.menu + ' - ' + chart.submenu;
+ }
+
+ if (typeof families[family] === 'undefined') {
+ families[family] = {
+ name: family,
+ arr: [],
+ priority: chart.priority
+ };
+
+ families_sort.push(families[family]);
+ }
+
+ if (chart.priority < families[family].priority) {
+ families[family].priority = chart.priority;
+ }
+
+ families[family].arr.unshift(alarm);
+ }
+
+ // sort the families, like the dashboard menu does
+ var families_sorted = families_sort.sort(function (a, b) {
+ if (a.priority < b.priority) {
+ return -1;
+ }
+ if (a.priority > b.priority) {
+ return 1;
+ }
+ return naturalSortCompare(a.name, b.name);
+ });
+
+ var i = 0;
+ var fc = 0;
+ var len = families_sorted.length;
+ while (len--) {
+ family = families_sorted[i++].name;
+ var active_family_added = false;
+ var expanded = 'true';
+ var collapsed = '';
+ var cin = 'in';
+
+ if (fc !== 0) {
+ all += "</table></div></div></div>";
+ expanded = 'false';
+ collapsed = 'class="collapsed"';
+ cin = '';
+ }
+
+ all += '<div class="panel panel-default"><div class="panel-heading" role="tab" id="alarm_all_heading_' + fc.toString() + '"><h4 class="panel-title"><a ' + collapsed + ' role="button" data-toggle="collapse" data-parent="#alarms_all_accordion" href="#alarm_all_' + fc.toString() + '" aria-expanded="' + expanded + '" aria-controls="alarm_all_' + fc.toString() + '">' + family.toString() + '</a></h4></div><div id="alarm_all_' + fc.toString() + '" class="panel-collapse collapse ' + cin + '" role="tabpanel" aria-labelledby="alarm_all_heading_' + fc.toString() + '" data-alarm-id="' + fc.toString() + '"><div class="panel-body" id="alarm_all_body_' + fc.toString() + '">';
+
+ options.alarm_families[fc] = families[family];
+
+ fc++;
+
+ var arr = families[family].arr;
+ var c = arr.length;
+ while (c--) {
+ alarm = arr[c];
+ if (alarm.status === 'WARNING' || alarm.status === 'CRITICAL') {
+ if (!active_family_added) {
+ active_family_added = true;
+ active += '<tr><th class="text-center" colspan="2"><h4>' + family + '</h4></th></tr>';
+ }
+ count_active++;
+ active += alarm_to_html(alarm, true);
+ }
+
+ count_all++;
+ }
+ }
+ active += "</table>";
+ if (families_sorted.length > 0) {
+ all += "</div></div></div>";
+ }
+ all += "</div>";
+
+ if (!count_active) {
+ active += '<div style="width:100%; height: 100px; text-align: center;"><span style="font-size: 50px;"><i class="fas fa-thumbs-up"></i></span><br/>一切正常。没有警报。</div>';
+ } else {
+ active += footer;
+ }
+
+ if (!count_all) {
+ all += "<h4>此系统中没有运行警报。</h4>";
+ } else {
+ all += footer;
+ }
+
+ document.getElementById('alarms_active').innerHTML = active;
+ document.getElementById('alarms_all').innerHTML = all;
+ enableTooltipsAndPopovers();
+
+ if (families_sorted.length > 0) {
+ alarm_family_show(0);
+ }
+
+ // register bootstrap events
+ var $accordion = $('#alarms_all_accordion');
+ $accordion.on('show.bs.collapse', function (d) {
+ var target = $(d.target);
+ var id = $(target).data('alarm-id');
+ alarm_family_show(id);
+ });
+ $accordion.on('hidden.bs.collapse', function (d) {
+ var target = $(d.target);
+ var id = $(target).data('alarm-id');
+ $('#alarm_all_' + id.toString()).html('');
+ });
+
+ document.getElementById('alarms_log').innerHTML = '<h3>警报记录</h3><table id="alarms_log_table"></table>';
+
+ loadBootstrapTable(function () {
+ $('#alarms_log_table').bootstrapTable({
+ url: NETDATA.alarms.server + '/api/v1/alarm_log?all',
+ cache: false,
+ pagination: true,
+ pageSize: 10,
+ showPaginationSwitch: false,
+ search: true,
+ searchTimeOut: 300,
+ searchAlign: 'left',
+ showColumns: true,
+ showExport: true,
+ exportDataType: 'basic',
+ exportOptions: {
+ fileName: 'netdata_alarm_log'
+ },
+ onClickRow: function (row, $element,field) {
+ void (field);
+ void ($element);
+ let main_url;
+ let common_url = "&host=" + encodeURIComponent(row['hostname']) + "&chart=" + encodeURIComponent(row['chart']) + "&family=" + encodeURIComponent(row['family']) + "&alarm=" + encodeURIComponent(row['name']) + "&alarm_unique_id=" + row['unique_id'] + "&alarm_id=" + row['alarm_id'] + "&alarm_event_id=" + row['alarm_event_id'] + "&alarm_when=" + row['when'];
+ if (NETDATA.registry.isUsingGlobalRegistry() && NETDATA.registry.machine_guid != null) {
+ main_url = "https://netdata.cloud/alarms/redirect?agentID=" + NETDATA.registry.machine_guid + common_url;
+ } else {
+ main_url = NETDATA.registry.server + "/goto-host-from-alarm.html?" + common_url ;
+ }
+ window.open(main_url,"_blank");
+ },
+ rowStyle: function (row, index) {
+ void (index);
+
+ switch (row.status) {
+ case 'CRITICAL':
+ return { classes: 'danger' };
+ break;
+ case 'WARNING':
+ return { classes: 'warning' };
+ break;
+ case 'UNDEFINED':
+ return { classes: 'info' };
+ break;
+ case 'CLEAR':
+ return { classes: 'success' };
+ break;
+ }
+ return {};
+ },
+ showFooter: false,
+ showHeader: true,
+ showRefresh: true,
+ showToggle: false,
+ sortable: true,
+ silentSort: false,
+ columns: [
+ {
+ field: 'when',
+ title: '事件日期',
+ valign: 'middle',
+ titleTooltip: 'The date and time the even took place',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return timestamp4human(value, ' ');
+ },
+ align: 'center',
+ switchable: false,
+ sortable: true
+ },
+ {
+ field: 'hostname',
+ title: '主机',
+ valign: 'middle',
+ titleTooltip: 'The host that generated this event',
+ align: 'center',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'unique_id',
+ title: '唯一 ID',
+ titleTooltip: 'The host unique ID for this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'alarm_id',
+ title: '警报 ID',
+ titleTooltip: 'The ID of the alarm that generated this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'alarm_event_id',
+ title: '警报事件 ID',
+ titleTooltip: 'The incremental ID of this event for the given alarm',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'chart',
+ title: '图表',
+ titleTooltip: 'The chart the alarm is attached to',
+ align: 'center',
+ valign: 'middle',
+ switchable: false,
+ sortable: true
+ },
+ {
+ field: 'family',
+ title: 'Family',
+ titleTooltip: 'The family of the chart the alarm is attached to',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'name',
+ title: '警报',
+ titleTooltip: 'The alarm name that generated this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return value.toString().replace(/_/g, ' ');
+ },
+ align: 'center',
+ valign: 'middle',
+ switchable: false,
+ sortable: true
+ },
+ {
+ field: 'value_string',
+ title: 'Friendly Value',
+ titleTooltip: 'The value of the alarm, that triggered this event',
+ align: 'right',
+ valign: 'middle',
+ sortable: true
+ },
+ {
+ field: 'old_value_string',
+ title: 'Friendly Old Value',
+ titleTooltip: 'The value of the alarm, just before this event',
+ align: 'right',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'old_value',
+ title: 'Old Value',
+ titleTooltip: 'The value of the alarm, just before this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return ((value !== null) ? Math.round(value * 100) / 100 : 'NaN').toString();
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'value',
+ title: 'Value',
+ titleTooltip: 'The value of the alarm, that triggered this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return ((value !== null) ? Math.round(value * 100) / 100 : 'NaN').toString();
+ },
+ align: 'right',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'units',
+ title: '单位',
+ titleTooltip: 'The units of the value of the alarm',
+ align: 'left',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'old_status',
+ title: '先前状态',
+ titleTooltip: 'The status of the alarm, just before this event',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'status',
+ title: '状态',
+ titleTooltip: 'The status of the alarm, that was set due to this event',
+ align: 'center',
+ valign: 'middle',
+ switchable: false,
+ sortable: true
+ },
+ {
+ field: 'duration',
+ title: 'Last Duration',
+ titleTooltip: 'The duration the alarm was at its previous state, just before this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return NETDATA.seconds4human(value, {negative_suffix: '', space: ' ', now: 'no time'});
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'non_clear_duration',
+ title: 'Raised Duration',
+ titleTooltip: 'The duration the alarm was raised, just before this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return NETDATA.seconds4human(value, {negative_suffix: '', space: ' ', now: 'no time'});
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'recipient',
+ title: 'Recipient',
+ titleTooltip: 'The recipient of this event',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'processed',
+ title: 'Processed Status',
+ titleTooltip: 'True when this event is processed',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+
+ if (value === true) {
+ return 'DONE';
+ } else {
+ return 'PENDING';
+ }
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'updated',
+ title: 'Updated Status',
+ titleTooltip: 'True when this event has been updated by another event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+
+ if (value === true) {
+ return 'UPDATED';
+ } else {
+ return 'CURRENT';
+ }
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'updated_by_id',
+ title: 'Updated By ID',
+ titleTooltip: 'The unique ID of the event that obsoleted this one',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'updates_id',
+ title: 'Updates ID',
+ titleTooltip: 'The unique ID of the event obsoleted because of this event',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return alarmid4human(value);
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'exec',
+ title: 'Script',
+ titleTooltip: 'The script to handle the event notification',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'exec_run',
+ title: 'Script Run At',
+ titleTooltip: 'The date and time the script has been ran',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return timestamp4human(value, ' ');
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'exec_code',
+ title: 'Script Return Value',
+ titleTooltip: 'The return code of the script',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+
+ if (value === 0) {
+ return 'OK (returned 0)';
+ } else {
+ return 'FAILED (with code ' + value.toString() + ')';
+ }
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'delay',
+ title: 'Script Delay',
+ titleTooltip: 'The hysteresis of the notification',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+
+ return NETDATA.seconds4human(value, {negative_suffix: '', space: ' ', now: 'no time'});
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'delay_up_to_timestamp',
+ title: 'Script Delay Run At',
+ titleTooltip: 'The date and time the script should be run, after hysteresis',
+ formatter: function (value, row, index) {
+ void (row);
+ void (index);
+ return timestamp4human(value, ' ');
+ },
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'info',
+ title: '说明',
+ titleTooltip: 'A short description of the alarm',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ },
+ {
+ field: 'source',
+ title: '警报来源',
+ titleTooltip: 'The source of configuration of the alarm',
+ align: 'center',
+ valign: 'middle',
+ visible: false,
+ sortable: true
+ }
+ ]
+ });
+ // console.log($('#alarms_log_table').bootstrapTable('getOptions'));
+ });
+ });
+}
+
+function alarmsCallback(data) {
+ var count = 0, x;
+ for (x in data.alarms) {
+ if (!data.alarms.hasOwnProperty(x)) {
+ continue;
+ }
+
+ var alarm = data.alarms[x];
+ if (alarm.status === 'WARNING' || alarm.status === 'CRITICAL') {
+ count++;
+ }
+ }
+
+ if (count > 0) {
+ document.getElementById('alarms_count_badge').innerHTML = count.toString();
+ } else {
+ document.getElementById('alarms_count_badge').innerHTML = '';
+ }
+}
+
+function initializeDynamicDashboardWithData(data) {
+ if (data !== null) {
+ options.hostname = data.hostname;
+ options.data = data;
+ options.version = data.version;
+ options.release_channel = data.release_channel;
+ netdataDashboard.os = data.os;
+
+ if (typeof data.hosts !== 'undefined') {
+ options.hosts = data.hosts;
+ }
+
+ // update the dashboard hostname
+ document.getElementById('hostname').innerHTML = '<span id="hostnametext">' + options.hostname + ((netdataSnapshotData !== null) ? ' (snap)' : '').toString() + '</span> <strong class="caret">';
+ document.getElementById('hostname').href = NETDATA.serverDefault;
+ document.getElementById('netdataVersion').innerHTML = options.version;
+
+ if (netdataSnapshotData !== null) {
+ $('#alarmsButton').hide();
+ $('#updateButton').hide();
+ // $('#loadButton').hide();
+ $('#saveButton').hide();
+ $('#printButton').hide();
+ }
+
+ // update the dashboard title
+ document.title = options.hostname + ' netdata 仪表板';
+
+ // 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);
+
+ // Ensure MyNetdata menu is rendered with latest host info #5370
+ renderMyNetdataMenu(isSignedIn() ? cloudAgents : registryAgents);
+ }
+}
+
+// an object to keep initilization configuration
+// needed due to the async nature of the XSS modal
+var initializeConfig = {
+ url: null,
+ custom_info: true,
+};
+
+function loadCustomDashboardInfo(url, callback) {
+ loadJs(url, function () {
+ $.extend(true, netdataDashboard, customDashboard);
+ callback();
+ });
+}
+
+function initializeChartsAndCustomInfo() {
+ NETDATA.alarms.callback = alarmsCallback;
+
+ // download all the charts the server knows
+ NETDATA.chartRegistry.downloadAll(initializeConfig.url, function (data) {
+ if (data !== null) {
+ if (initializeConfig.custom_info === true && typeof data.custom_info !== 'undefined' && data.custom_info !== "" && netdataSnapshotData === null) {
+ //console.log('loading custom dashboard decorations from server ' + initializeConfig.url);
+ loadCustomDashboardInfo(NETDATA.serverDefault + data.custom_info, function () {
+ initializeDynamicDashboardWithData(data);
+ });
+ } else {
+ //console.log('not loading custom dashboard decorations from server ' + initializeConfig.url);
+ initializeDynamicDashboardWithData(data);
+ }
+ }
+ });
+}
+
+function xssModalDisableXss() {
+ //console.log('disabling xss checks');
+ NETDATA.xss.enabled = false;
+ NETDATA.xss.enabled_for_data = false;
+ initializeConfig.custom_info = true;
+ initializeChartsAndCustomInfo();
+ return false;
+}
+
+function xssModalKeepXss() {
+ //console.log('keeping xss checks');
+ NETDATA.xss.enabled = true;
+ NETDATA.xss.enabled_for_data = true;
+ initializeConfig.custom_info = false;
+ initializeChartsAndCustomInfo();
+ return false;
+}
+
+function initializeDynamicDashboard(netdata_url) {
+ if (typeof netdata_url === 'undefined' || netdata_url === null) {
+ netdata_url = NETDATA.serverDefault;
+ }
+
+ initializeConfig.url = netdata_url;
+
+ // initialize clickable alarms
+ NETDATA.alarms.chart_div_offset = -50;
+ NETDATA.alarms.chart_div_id_prefix = 'chart_';
+ NETDATA.alarms.chart_div_animation_duration = 0;
+
+ NETDATA.pause(function () {
+ if (typeof netdataCheckXSS !== 'undefined' && netdataCheckXSS === true) {
+ //$("#loadOverlay").css("display","none");
+ document.getElementById('netdataXssModalServer').innerText = initializeConfig.url;
+ $('#xssModal').modal('show');
+ } else {
+ initializeChartsAndCustomInfo();
+ }
+ });
+}
+
+// ----------------------------------------------------------------------------
+
+function versionLog(msg) {
+ document.getElementById('versionCheckLog').innerHTML = msg;
+}
+
+// New way of checking for updates, based only on versions
+
+function versionsMatch(v1, v2) {
+ if (v1 == v2) {
+ return true;
+ } else {
+ let s1 = v1.split('.');
+ let s2 = v2.split('.');
+ // Check major version
+ let n1 = parseInt(s1[0].substring(1, 2), 10);
+ let n2 = parseInt(s2[0].substring(1, 2), 10);
+ if (n1 < n2) return false;
+ else if (n1 > n2) return true;
+
+ // Check minor version
+ n1 = parseInt(s1[1], 10);
+ n2 = parseInt(s2[1], 10);
+ if (n1 < n2) return false;
+ else if (n1 > n2) return true;
+
+ // Split patch: format could be e.g. 0-22-nightly
+ s1 = s1[2].split('-');
+ s2 = s2[2].split('-');
+
+ n1 = parseInt(s1[0], 10);
+ n2 = parseInt(s2[0], 10);
+ if (n1 < n2) return false;
+ else if (n1 > n2) return true;
+
+ n1 = (s1.length > 1) ? parseInt(s1[1], 10) : 0;
+ n2 = (s2.length > 1) ? parseInt(s2[1], 10) : 0;
+ if (n1 < n2) return false;
+ else return true;
+ }
+}
+
+function getGithubLatestVersion(callback) {
+ versionLog('正在从 github 下载最新版本 ID...');
+
+ $.ajax({
+ url: 'https://api.github.com/repos/netdata/netdata/releases/latest',
+ async: true,
+ cache: false
+ })
+ .done(function (data) {
+ data = data.tag_name.replace(/(\r\n|\n|\r| |\t)/gm, "");
+ versionLog('从 github 取得最新版本是 ' + data);
+ callback(data);
+ })
+ .fail(function () {
+ versionLog('从 github 下载最新版本 ID 失败。');
+ callback(null);
+ });
+}
+
+function getGCSLatestVersion(callback) {
+ versionLog('Downloading latest version id from GCS...');
+ $.ajax({
+ url: "https://www.googleapis.com/storage/v1/b/netdata-nightlies/o/latest-version.txt",
+ async: true,
+ cache: false
+ })
+ .done(function (response) {
+ $.ajax({
+ url: response.mediaLink,
+ async: true,
+ cache: false
+ })
+ .done(function (data) {
+ data = data.replace(/(\r\n|\n|\r| |\t)/gm, "");
+ versionLog('Latest nightly version from GCS is ' + data);
+ callback(data);
+ })
+ .fail(function (xhr, textStatus, errorThrown) {
+ versionLog('Failed to download the latest nightly version id from GCS!');
+ callback(null);
+ });
+ })
+ .fail(function (xhr, textStatus, errorThrown) {
+ versionLog('Failed to download the latest nightly version from GCS!');
+ callback(null);
+ });
+}
+
+
+function checkForUpdateByVersion(force, callback) {
+ if (options.release_channel === 'stable') {
+ getGithubLatestVersion(function (sha2) {
+ callback(options.version, sha2);
+ });
+ } else {
+ getGCSLatestVersion(function (sha2) {
+ callback(options.version, sha2);
+ });
+ }
+ return null;
+}
+
+function notifyForUpdate(force) {
+ versionLog('<p>正在检查更新...</p>');
+
+ var now = Date.now();
+
+ if (typeof force === 'undefined' || force !== true) {
+ var last = loadLocalStorage('last_update_check');
+
+ if (typeof last === 'string') {
+ last = parseInt(last);
+ } else {
+ last = 0;
+ }
+
+ if (now - last < 3600000 * 8) {
+ // no need to check it - too soon
+ return;
+ }
+ }
+
+ checkForUpdateByVersion(force, function (sha1, sha2) {
+ var save = false;
+
+ if (sha1 === null) {
+ save = false;
+ versionLog('<p><big>取得您的 netdata 版本失败！</big></p><p>You can always get the latest netdata from <a href="https://github.com/netdata/netdata" target="_blank">its github page</a>.</p>');
+ } else if (sha2 === null) {
+ save = false;
+ versionLog('<p><big>从 github 取得 netdata 最新版本失败。</big></p><p>您也可以从 <a href="https://github.com/netdata/netdata" target="_blank"> github</a> 取得最新 netdata 版本。</p>');
+ } else if (versionsMatch(sha1, sha2)) {
+ save = true;
+ versionLog('<p><big>您已经是最新版本的 netdata！</big></p><p>还没有更新？<br/>或许，我们还需要一些动力继续前进！</p><p>如果您还没有做好更新的准备，请您 <a href="https://github.com/netdata/netdata" target="_blank">到 github 给 netdata <b><i class="fas fa-star"></i></b></a>。</p>');
+ } else {
+ save = true;
+ var compare = 'https://learn.netdata.cloud/docs/agent/changelog/';
+ versionLog('<p><big><strong>New version of netdata available!</strong></big></p><p>Latest version: <b><code>' + sha2 + '</code></b></p><p><a href="' + compare + '" target="_blank">Click here for the changes log</a> and<br/><a href="https://github.com/netdata/netdata/tree/master/packaging/installer/UPDATE.md" target="_blank">click here for directions on updating</a> your netdata installation.</p><p>We suggest to review the changes log for new features you may be interested, or important bug fixes you may need.<br/>Keeping your netdata updated is generally a good idea.</p>');
+
+ document.getElementById('update_badge').innerHTML = '!';
+ }
+
+ if (save) {
+ saveLocalStorage('last_update_check', now.toString());
+ }
+ });
+}
+
+// ----------------------------------------------------------------------------
+// printing dashboards
+
+function showPageFooter() {
+ document.getElementById('footer').style.display = 'block';
+}
+
+function printPreflight() {
+ var url = document.location.origin.toString() + document.location.pathname.toString() + document.location.search.toString() + urlOptions.genHash() + ';mode=print';
+ var width = 990;
+ var height = screen.height * 90 / 100;
+ //console.log(url);
+ //console.log(document.location);
+ window.open(url, '', 'width=' + width.toString() + ',height=' + height.toString() + ',menubar=no,toolbar=no,personalbar=no,location=no,resizable=no,scrollbars=yes,status=no,chrome=yes,centerscreen=yes,attention=yes,dialog=yes');
+ $('#printPreflightModal').modal('hide');
+}
+
+function printPage() {
+ var print_is_rendering = true;
+
+ $('#printModal').on('hide.bs.modal', function (e) {
+ if (print_is_rendering === true) {
+ e.preventDefault();
+ return false;
+ }
+
+ return true;
+ });
+
+ $('#printModal').on('show.bs.modal', function () {
+ var print_options = {
+ stop_updates_when_focus_is_lost: false,
+ update_only_visible: false,
+ sync_selection: false,
+ eliminate_zero_dimensions: false,
+ pan_and_zoom_data_padding: false,
+ show_help: false,
+ legend_toolbox: false,
+ resize_charts: false,
+ pixels_per_point: 1
+ };
+
+ var x;
+ for (x in print_options) {
+ if (print_options.hasOwnProperty(x)) {
+ NETDATA.options.current[x] = print_options[x];
+ }
+ }
+
+ NETDATA.parseDom();
+ showPageFooter();
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.globalPanAndZoom.setMaster(NETDATA.options.targets[0], urlOptions.after, urlOptions.before);
+ // NETDATA.onresize();
+
+ var el = document.getElementById('printModalProgressBar');
+ var eltxt = document.getElementById('printModalProgressBarText');
+
+ function update_chart(idx) {
+ var state = NETDATA.options.targets[--idx];
+
+ var pcent = (NETDATA.options.targets.length - idx) * 100 / NETDATA.options.targets.length;
+ $(el).css('width', pcent + '%').attr('aria-valuenow', pcent);
+ eltxt.innerText = Math.round(pcent).toString() + '%, ' + state.id;
+
+ setTimeout(function () {
+ state.updateChart(function () {
+ NETDATA.options.targets[idx].resizeForPrint();
+
+ if (idx > 0) {
+ update_chart(idx);
+ } else {
+ print_is_rendering = false;
+ $('#printModal').modal('hide');
+ window.print();
+ window.close();
+ }
+ })
+ }, 0);
+ }
+
+ print_is_rendering = true;
+ update_chart(NETDATA.options.targets.length);
+ });
+
+ $('#printModal').modal('show');
+}
+
+// --------------------------------------------------------------------
+
+function jsonStringifyFn(obj) {
+ return JSON.stringify(obj, function (key, value) {
+ return (typeof value === 'function') ? value.toString() : value;
+ });
+}
+
+function jsonParseFn(str) {
+ return JSON.parse(str, function (key, value) {
+ if (typeof value != 'string') {
+ return value;
+ }
+ return (value.substring(0, 8) == 'function') ? eval('(' + value + ')') : value;
+ });
+}
+
+// --------------------------------------------------------------------
+
+var snapshotOptions = {
+ bytes_per_chart: 2048,
+ compressionDefault: 'pako.deflate.base64',
+
+ compressions: {
+ 'none': {
+ bytes_per_point_memory: 5.2,
+ bytes_per_point_disk: 5.6,
+
+ compress: function (s) {
+ return s;
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return s;
+ }
+ },
+
+ 'pako.deflate.base64': {
+ bytes_per_point_memory: 1.8,
+ bytes_per_point_disk: 1.9,
+
+ compress: function (s) {
+ return btoa(pako.deflate(s, {to: 'string'}));
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return pako.inflate(atob(s), {to: 'string'});
+ }
+ },
+
+ 'pako.deflate': {
+ bytes_per_point_memory: 1.4,
+ bytes_per_point_disk: 3.2,
+
+ compress: function (s) {
+ return pako.deflate(s, {to: 'string'});
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return pako.inflate(s, {to: 'string'});
+ }
+ },
+
+ 'lzstring.utf16': {
+ bytes_per_point_memory: 1.7,
+ bytes_per_point_disk: 2.6,
+
+ compress: function (s) {
+ return LZString.compressToUTF16(s);
+ },
+
+ compressed_length: function (s) {
+ return s.length * 2;
+ },
+
+ uncompress: function (s) {
+ return LZString.decompressFromUTF16(s);
+ }
+ },
+
+ 'lzstring.base64': {
+ bytes_per_point_memory: 2.1,
+ bytes_per_point_disk: 2.3,
+
+ compress: function (s) {
+ return LZString.compressToBase64(s);
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return LZString.decompressFromBase64(s);
+ }
+ },
+
+ 'lzstring.uri': {
+ bytes_per_point_memory: 2.1,
+ bytes_per_point_disk: 2.3,
+
+ compress: function (s) {
+ return LZString.compressToEncodedURIComponent(s);
+ },
+
+ compressed_length: function (s) {
+ return s.length;
+ },
+
+ uncompress: function (s) {
+ return LZString.decompressFromEncodedURIComponent(s);
+ }
+ }
+ }
+};
+
+// --------------------------------------------------------------------
+// loading snapshots
+
+function loadSnapshotModalLog(priority, msg) {
+ document.getElementById('loadSnapshotStatus').className = "alert alert-" + priority;
+ document.getElementById('loadSnapshotStatus').innerHTML = msg;
+}
+
+var tmpSnapshotData = null;
+
+function loadSnapshot() {
+ $('#loadSnapshotImport').addClass('disabled');
+
+ if (tmpSnapshotData === null) {
+ loadSnapshotPreflightEmpty();
+ loadSnapshotModalLog('danger', 'no data have been loaded');
+ return;
+ }
+
+ loadPako(function () {
+ loadLzString(function () {
+ loadSnapshotModalLog('info', 'Please wait, activating snapshot...');
+ $('#loadSnapshotModal').modal('hide');
+
+ netdataShowAlarms = false;
+ netdataRegistry = false;
+ netdataServer = tmpSnapshotData.server;
+ NETDATA.serverDefault = netdataServer;
+
+ document.getElementById('charts_div').innerHTML = '';
+ document.getElementById('sidebar').innerHTML = '';
+ NETDATA.globalReset();
+
+ if (typeof tmpSnapshotData.hash !== 'undefined') {
+ urlOptions.hash = tmpSnapshotData.hash;
+ } else {
+ urlOptions.hash = '#';
+ }
+
+ if (typeof tmpSnapshotData.info !== 'undefined') {
+ var info = jsonParseFn(tmpSnapshotData.info);
+ if (typeof info.menu !== 'undefined') {
+ netdataDashboard.menu = info.menu;
+ }
+
+ if (typeof info.submenu !== 'undefined') {
+ netdataDashboard.submenu = info.submenu;
+ }
+
+ if (typeof info.context !== 'undefined') {
+ netdataDashboard.context = info.context;
+ }
+ }
+
+ if (typeof tmpSnapshotData.compression !== 'string') {
+ tmpSnapshotData.compression = 'none';
+ }
+
+ if (typeof snapshotOptions.compressions[tmpSnapshotData.compression] === 'undefined') {
+ alert('unknown compression method: ' + tmpSnapshotData.compression);
+ tmpSnapshotData.compression = 'none';
+ }
+
+ tmpSnapshotData.uncompress = snapshotOptions.compressions[tmpSnapshotData.compression].uncompress;
+ netdataSnapshotData = tmpSnapshotData;
+
+ urlOptions.after = tmpSnapshotData.after_ms;
+ urlOptions.before = tmpSnapshotData.before_ms;
+
+ if (typeof tmpSnapshotData.highlight_after_ms !== 'undefined'
+ && tmpSnapshotData.highlight_after_ms !== null
+ && tmpSnapshotData.highlight_after_ms > 0
+ && typeof tmpSnapshotData.highlight_before_ms !== 'undefined'
+ && tmpSnapshotData.highlight_before_ms !== null
+ && tmpSnapshotData.highlight_before_ms > 0
+ ) {
+ urlOptions.highlight_after = tmpSnapshotData.highlight_after_ms;
+ urlOptions.highlight_before = tmpSnapshotData.highlight_before_ms;
+ urlOptions.highlight = true;
+ } else {
+ urlOptions.highlight_after = 0;
+ urlOptions.highlight_before = 0;
+ urlOptions.highlight = false;
+ }
+
+ netdataCheckXSS = false; // disable the modal - this does not affect XSS checks, since dashboard.js is already loaded
+ NETDATA.xss.enabled = true; // we should not do any remote requests, but if we do, check them
+ NETDATA.xss.enabled_for_data = true; // check also snapshot data - that have been excluded from the initial check, due to compression
+ loadSnapshotPreflightEmpty();
+ initializeDynamicDashboard();
+ });
+ });
+};
+
+function loadSnapshotPreflightFile(file) {
+ var filename = NETDATA.xss.string(file.name);
+ var fr = new FileReader();
+ fr.onload = function (e) {
+ document.getElementById('loadSnapshotFilename').innerHTML = filename;
+ var result = null;
+ try {
+ result = NETDATA.xss.checkAlways('snapshot', JSON.parse(e.target.result), /^(snapshot\.info|snapshot\.data)$/);
+
+ //console.log(result);
+ var date_after = new Date(result.after_ms);
+ var date_before = new Date(result.before_ms);
+
+ if (typeof result.charts_ok === 'undefined') {
+ result.charts_ok = 'unknown';
+ }
+
+ if (typeof result.charts_failed === 'undefined') {
+ result.charts_failed = 0;
+ }
+
+ if (typeof result.compression === 'undefined') {
+ result.compression = 'none';
+ }
+
+ if (typeof result.data_size === 'undefined') {
+ result.data_size = 0;
+ }
+
+ document.getElementById('loadSnapshotFilename').innerHTML = '<code>' + filename + '</code>';
+ document.getElementById('loadSnapshotHostname').innerHTML = '<b>' + result.hostname + '</b>, netdata version: <b>' + result.netdata_version.toString() + '</b>';
+ document.getElementById('loadSnapshotURL').innerHTML = result.url;
+ document.getElementById('loadSnapshotCharts').innerHTML = result.charts.charts_count.toString() + ' charts, ' + result.charts.dimensions_count.toString() + ' dimensions, ' + result.data_points.toString() + ' points per dimension, ' + Math.round(result.duration_ms / result.data_points).toString() + ' ms per point';
+ document.getElementById('loadSnapshotInfo').innerHTML = 'version: <b>' + result.snapshot_version.toString() + '</b>, includes <b>' + result.charts_ok.toString() + '</b> unique chart data queries ' + ((result.charts_failed > 0) ? ('<b>' + result.charts_failed.toString() + '</b> failed') : '').toString() + ', compressed with <code>' + result.compression.toString() + '</code>, data size ' + (Math.round(result.data_size * 100 / 1024 / 1024) / 100).toString() + ' MB';
+ document.getElementById('loadSnapshotTimeRange').innerHTML = '<b>' + NETDATA.dateTime.localeDateString(date_after) + ' ' + NETDATA.dateTime.localeTimeString(date_after) + '</b> to <b>' + NETDATA.dateTime.localeDateString(date_before) + ' ' + NETDATA.dateTime.localeTimeString(date_before) + '</b>';
+ document.getElementById('loadSnapshotComments').innerHTML = ((result.comments) ? result.comments : '').toString();
+ loadSnapshotModalLog('success', 'File loaded, click <b>Import</b> to render it!');
+ $('#loadSnapshotImport').removeClass('disabled');
+
+ tmpSnapshotData = result;
+ }
+ catch (e) {
+ console.log(e);
+ document.getElementById('loadSnapshotStatus').className = "alert alert-danger";
+ document.getElementById('loadSnapshotStatus').innerHTML = "Failed to parse this file!";
+ $('#loadSnapshotImport').addClass('disabled');
+ }
+ }
+
+ //console.log(file);
+ fr.readAsText(file);
+};
+
+function loadSnapshotPreflightEmpty() {
+ document.getElementById('loadSnapshotFilename').innerHTML = '';
+ document.getElementById('loadSnapshotHostname').innerHTML = '';
+ document.getElementById('loadSnapshotURL').innerHTML = '';
+ document.getElementById('loadSnapshotCharts').innerHTML = '';
+ document.getElementById('loadSnapshotInfo').innerHTML = '';
+ document.getElementById('loadSnapshotTimeRange').innerHTML = '';
+ document.getElementById('loadSnapshotComments').innerHTML = '';
+ loadSnapshotModalLog('success', 'Browse for a snapshot file (or drag it and drop it here), then click <b>Import</b> to render it.');
+ $('#loadSnapshotImport').addClass('disabled');
+};
+
+var loadSnapshotDragAndDropInitialized = false;
+
+function loadSnapshotDragAndDropSetup() {
+ if (loadSnapshotDragAndDropInitialized === false) {
+ loadSnapshotDragAndDropInitialized = true;
+ $('#loadSnapshotDragAndDrop')
+ .on('drag dragstart dragend dragover dragenter dragleave drop', function (e) {
+ e.preventDefault();
+ e.stopPropagation();
+ })
+ .on('drop', function (e) {
+ if (e.originalEvent.dataTransfer.files.length) {
+ loadSnapshotPreflightFile(e.originalEvent.dataTransfer.files.item(0));
+ } else {
+ loadSnapshotPreflightEmpty();
+ loadSnapshotModalLog('danger', 'No file selected');
+ }
+ });
+ }
+};
+
+function loadSnapshotPreflight() {
+ var files = document.getElementById('loadSnapshotSelectFiles').files;
+ if (files.length <= 0) {
+ loadSnapshotPreflightEmpty();
+ loadSnapshotModalLog('danger', 'No file selected');
+ return;
+ }
+
+ loadSnapshotModalLog('info', 'Loading file...');
+
+ loadSnapshotPreflightFile(files.item(0));
+}
+
+// --------------------------------------------------------------------
+// saving snapshots
+
+var saveSnapshotStop = false;
+
+function saveSnapshotCancel() {
+ saveSnapshotStop = true;
+}
+
+var saveSnapshotModalInitialized = false;
+
+function saveSnapshotModalSetup() {
+ if (saveSnapshotModalInitialized === false) {
+ saveSnapshotModalInitialized = true;
+ $('#saveSnapshotModal')
+ .on('hide.bs.modal', saveSnapshotCancel)
+ .on('show.bs.modal', saveSnapshotModalInit)
+ .on('shown.bs.modal', function () {
+ $('#saveSnapshotResolutionSlider').find(".slider-handle:first").attr("tabindex", 1);
+ document.getElementById('saveSnapshotComments').focus();
+ });
+ }
+};
+
+function saveSnapshotModalLog(priority, msg) {
+ document.getElementById('saveSnapshotStatus').className = "alert alert-" + priority;
+ document.getElementById('saveSnapshotStatus').innerHTML = msg;
+}
+
+function saveSnapshotModalShowExpectedSize() {
+ var points = Math.round(saveSnapshotViewDuration / saveSnapshotSelectedSecondsPerPoint);
+ var priority = 'info';
+ var msg = 'A moderate snapshot.';
+
+ var sizemb = Math.round(
+ (options.data.charts_count * snapshotOptions.bytes_per_chart
+ + options.data.dimensions_count * points * snapshotOptions.compressions[saveSnapshotCompression].bytes_per_point_disk)
+ * 10 / 1024 / 1024) / 10;
+
+ var memmb = Math.round(
+ (options.data.charts_count * snapshotOptions.bytes_per_chart
+ + options.data.dimensions_count * points * snapshotOptions.compressions[saveSnapshotCompression].bytes_per_point_memory)
+ * 10 / 1024 / 1024) / 10;
+
+ if (sizemb < 10) {
+ priority = 'success';
+ msg = 'A nice small snapshot!';
+ }
+ if (sizemb > 50) {
+ priority = 'warning';
+ msg = 'Will stress your browser...';
+ }
+ if (sizemb > 100) {
+ priority = 'danger';
+ msg = 'Hm... good luck...';
+ }
+
+ saveSnapshotModalLog(priority, 'The snapshot will have ' + points.toString() + ' points per dimension. Expected size on disk ' + sizemb + ' MB, at browser memory ' + memmb + ' MB.<br/>' + msg);
+}
+
+var saveSnapshotCompression = snapshotOptions.compressionDefault;
+
+function saveSnapshotSetCompression(name) {
+ saveSnapshotCompression = name;
+ document.getElementById('saveSnapshotCompressionName').innerHTML = saveSnapshotCompression;
+ saveSnapshotModalShowExpectedSize();
+}
+
+var saveSnapshotSlider = null;
+var saveSnapshotSelectedSecondsPerPoint = 1;
+var saveSnapshotViewDuration = 1;
+
+function saveSnapshotModalInit() {
+ $('#saveSnapshotModalProgressSection').hide();
+ $('#saveSnapshotResolutionRadio').show();
+ saveSnapshotModalLog('info', 'Select resolution and click <b>Save</b>');
+ $('#saveSnapshotExport').removeClass('disabled');
+
+ loadBootstrapSlider(function () {
+ saveSnapshotViewDuration = options.duration;
+ var start_ms = Math.round(Date.now() - saveSnapshotViewDuration * 1000);
+
+ if (NETDATA.globalPanAndZoom.isActive() === true) {
+ saveSnapshotViewDuration = Math.round((NETDATA.globalPanAndZoom.force_before_ms - NETDATA.globalPanAndZoom.force_after_ms) / 1000);
+ start_ms = NETDATA.globalPanAndZoom.force_after_ms;
+ }
+
+ var start_date = new Date(start_ms);
+ var yyyymmddhhssmm = start_date.getFullYear() + NETDATA.zeropad(start_date.getMonth() + 1) + NETDATA.zeropad(start_date.getDate()) + '-' + NETDATA.zeropad(start_date.getHours()) + NETDATA.zeropad(start_date.getMinutes()) + NETDATA.zeropad(start_date.getSeconds());
+
+ document.getElementById('saveSnapshotFilename').value = 'netdata-' + options.hostname.toString() + '-' + yyyymmddhhssmm.toString() + '-' + saveSnapshotViewDuration.toString() + '.snapshot';
+ saveSnapshotSetCompression(saveSnapshotCompression);
+
+ var min = options.update_every;
+ var max = Math.round(saveSnapshotViewDuration / 100);
+
+ if (NETDATA.globalPanAndZoom.isActive() === false) {
+ max = Math.round(saveSnapshotViewDuration / 50);
+ }
+
+ var view = Math.round(saveSnapshotViewDuration / Math.round($(document.getElementById('charts_div')).width() / 2));
+
+ // console.log('view duration: ' + saveSnapshotViewDuration + ', min: ' + min + ', max: ' + max + ', view: ' + view);
+
+ if (max < 10) {
+ max = 10;
+ }
+ if (max < min) {
+ max = min;
+ }
+ if (view < min) {
+ view = min;
+ }
+ if (view > max) {
+ view = max;
+ }
+
+ if (saveSnapshotSlider !== null) {
+ saveSnapshotSlider.destroy();
+ }
+
+ saveSnapshotSlider = new Slider('#saveSnapshotResolutionSlider', {
+ ticks: [min, view, max],
+ min: min,
+ max: max,
+ step: options.update_every,
+ value: view,
+ scale: (max > 100) ? 'logarithmic' : 'linear',
+ tooltip: 'always',
+ formatter: function (value) {
+ if (value < 1) {
+ value = 1;
+ }
+
+ if (value < options.data.update_every) {
+ value = options.data.update_every;
+ }
+
+ saveSnapshotSelectedSecondsPerPoint = value;
+ saveSnapshotModalShowExpectedSize();
+
+ var seconds = ' seconds ';
+ if (value === 1) {
+ seconds = ' second ';
+ }
+
+ return value + seconds + 'per point' + ((value === options.data.update_every) ? ', server default' : '').toString();
+ }
+ });
+ });
+}
+
+function saveSnapshot() {
+ loadPako(function () {
+ loadLzString(function () {
+ saveSnapshotStop = false;
+ $('#saveSnapshotModalProgressSection').show();
+ $('#saveSnapshotResolutionRadio').hide();
+ $('#saveSnapshotExport').addClass('disabled');
+
+ var filename = document.getElementById('saveSnapshotFilename').value;
+ // console.log(filename);
+ saveSnapshotModalLog('info', 'Generating snapshot as <code>' + filename.toString() + '</code>');
+
+ var save_options = {
+ stop_updates_when_focus_is_lost: false,
+ update_only_visible: false,
+ sync_selection: false,
+ eliminate_zero_dimensions: true,
+ pan_and_zoom_data_padding: false,
+ show_help: false,
+ legend_toolbox: false,
+ resize_charts: false,
+ pixels_per_point: 1
+ };
+ var backedup_options = {};
+
+ var x;
+ for (x in save_options) {
+ if (save_options.hasOwnProperty(x)) {
+ backedup_options[x] = NETDATA.options.current[x];
+ NETDATA.options.current[x] = save_options[x];
+ }
+ }
+
+ var el = document.getElementById('saveSnapshotModalProgressBar');
+ var eltxt = document.getElementById('saveSnapshotModalProgressBarText');
+
+ options.data.charts_by_name = null;
+
+ var saveData = {
+ hostname: options.hostname,
+ server: NETDATA.serverDefault,
+ netdata_version: options.data.version,
+ snapshot_version: 1,
+ after_ms: Date.now() - options.duration * 1000,
+ before_ms: Date.now(),
+ highlight_after_ms: urlOptions.highlight_after,
+ highlight_before_ms: urlOptions.highlight_before,
+ duration_ms: options.duration * 1000,
+ update_every_ms: options.update_every * 1000,
+ data_points: 0,
+ url: ((urlOptions.server !== null) ? urlOptions.server : document.location.origin.toString() + document.location.pathname.toString() + document.location.search.toString()).toString(),
+ comments: document.getElementById('saveSnapshotComments').value.toString(),
+ hash: urlOptions.hash,
+ charts: options.data,
+ info: jsonStringifyFn({
+ menu: netdataDashboard.menu,
+ submenu: netdataDashboard.submenu,
+ context: netdataDashboard.context
+ }),
+ charts_ok: 0,
+ charts_failed: 0,
+ compression: saveSnapshotCompression,
+ data_size: 0,
+ data: {}
+ };
+
+ if (typeof snapshotOptions.compressions[saveData.compression] === 'undefined') {
+ alert('unknown compression method: ' + saveData.compression);
+ saveData.compression = 'none';
+ }
+
+ var compress = snapshotOptions.compressions[saveData.compression].compress;
+ var compressed_length = snapshotOptions.compressions[saveData.compression].compressed_length;
+
+ function pack_api1_v1_chart_data(state) {
+ if (state.library_name === null || state.data === null) {
+ return;
+ }
+
+ var data = state.data;
+ state.data = null;
+ data.state = null;
+ var str = JSON.stringify(data);
+
+ if (typeof str === 'string') {
+ var cstr = compress(str);
+ saveData.data[state.chartDataUniqueID()] = cstr;
+ return compressed_length(cstr);
+ } else {
+ return 0;
+ }
+ }
+
+ var clearPanAndZoom = false;
+ if (NETDATA.globalPanAndZoom.isActive() === false) {
+ NETDATA.globalPanAndZoom.setMaster(NETDATA.options.targets[0], saveData.after_ms, saveData.before_ms);
+ clearPanAndZoom = true;
+ }
+
+ saveData.after_ms = NETDATA.globalPanAndZoom.force_after_ms;
+ saveData.before_ms = NETDATA.globalPanAndZoom.force_before_ms;
+ saveData.duration_ms = saveData.before_ms - saveData.after_ms;
+ saveData.data_points = Math.round((saveData.before_ms - saveData.after_ms) / (saveSnapshotSelectedSecondsPerPoint * 1000));
+ saveSnapshotModalLog('info', 'Generating snapshot with ' + saveData.data_points.toString() + ' data points per dimension...');
+
+ var charts_count = 0;
+ var charts_ok = 0;
+ var charts_failed = 0;
+
+ function saveSnapshotRestore() {
+ $('#saveSnapshotModal').modal('hide');
+
+ // restore the options
+ var x;
+ for (x in backedup_options) {
+ if (backedup_options.hasOwnProperty(x)) {
+ NETDATA.options.current[x] = backedup_options[x];
+ }
+ }
+
+ $(el).css('width', '0%').attr('aria-valuenow', 0);
+ eltxt.innerText = '0%';
+
+ if (clearPanAndZoom) {
+ NETDATA.globalPanAndZoom.clearMaster();
+ }
+
+ NETDATA.options.force_data_points = 0;
+ NETDATA.options.fake_chart_rendering = false;
+ NETDATA.onscroll_updater_enabled = true;
+ NETDATA.onresize();
+ NETDATA.unpause();
+
+ $('#saveSnapshotExport').removeClass('disabled');
+ }
+
+ NETDATA.globalSelectionSync.stop();
+ NETDATA.options.force_data_points = saveData.data_points;
+ NETDATA.options.fake_chart_rendering = true;
+ NETDATA.onscroll_updater_enabled = false;
+ NETDATA.abortAllRefreshes();
+
+ var size = 0;
+ var info = ' Resolution: <b>' + saveSnapshotSelectedSecondsPerPoint.toString() + ((saveSnapshotSelectedSecondsPerPoint === 1) ? ' second ' : ' seconds ').toString() + 'per point</b>.';
+
+ function update_chart(idx) {
+ if (saveSnapshotStop === true) {
+ saveSnapshotModalLog('info', 'Cancelled!');
+ saveSnapshotRestore();
+ return;
+ }
+
+ var state = NETDATA.options.targets[--idx];
+
+ var pcent = (NETDATA.options.targets.length - idx) * 100 / NETDATA.options.targets.length;
+ $(el).css('width', pcent + '%').attr('aria-valuenow', pcent);
+ eltxt.innerText = Math.round(pcent).toString() + '%, ' + state.id;
+
+ setTimeout(function () {
+ charts_count++;
+ state.isVisible(true);
+ state.current.force_after_ms = saveData.after_ms;
+ state.current.force_before_ms = saveData.before_ms;
+
+ state.updateChart(function (status, reason) {
+ state.current.force_after_ms = null;
+ state.current.force_before_ms = null;
+
+ if (status === true) {
+ charts_ok++;
+ // state.log('ok');
+ size += pack_api1_v1_chart_data(state);
+ } else {
+ charts_failed++;
+ state.log('failed to be updated: ' + reason);
+ }
+
+ saveSnapshotModalLog((charts_failed) ? 'danger' : 'info', 'Generated snapshot data size <b>' + (Math.round(size * 100 / 1024 / 1024) / 100).toString() + ' MB</b>. ' + ((charts_failed) ? (charts_failed.toString() + ' charts have failed to be downloaded') : '').toString() + info);
+
+ if (idx > 0) {
+ update_chart(idx);
+ } else {
+ saveData.charts_ok = charts_ok;
+ saveData.charts_failed = charts_failed;
+ saveData.data_size = size;
+ // console.log(saveData.compression + ': ' + (size / (options.data.dimensions_count * Math.round(saveSnapshotViewDuration / saveSnapshotSelectedSecondsPerPoint))).toString());
+
+ // save it
+ // console.log(saveData);
+ saveObjectToClient(saveData, filename);
+
+ if (charts_failed > 0) {
+ alert(charts_failed.toString() + ' failed to be downloaded');
+ }
+
+ saveSnapshotRestore();
+ saveData = null;
+ }
+ })
+ }, 0);
+ }
+
+ update_chart(NETDATA.options.targets.length);
+ });
+ });
+}
+
+// --------------------------------------------------------------------
+// activate netdata on the page
+
+function dashboardSettingsSetup() {
+ var update_options_modal = function () {
+ // console.log('update_options_modal');
+
+ var sync_option = function (option) {
+ var self = $('#' + option);
+
+ if (self.prop('checked') !== NETDATA.getOption(option)) {
+ // console.log('switching ' + option.toString());
+ self.bootstrapToggle(NETDATA.getOption(option) ? 'on' : 'off');
+ }
+ };
+
+ var theme_sync_option = function (option) {
+ var self = $('#' + option);
+
+ self.bootstrapToggle(netdataTheme === 'slate' ? 'on' : 'off');
+ };
+ var units_sync_option = function (option) {
+ var self = $('#' + option);
+
+ if (self.prop('checked') !== (NETDATA.getOption('units') === 'auto')) {
+ self.bootstrapToggle(NETDATA.getOption('units') === 'auto' ? 'on' : 'off');
+ }
+
+ if (self.prop('checked') === true) {
+ $('#settingsLocaleTempRow').show();
+ $('#settingsLocaleTimeRow').show();
+ } else {
+ $('#settingsLocaleTempRow').hide();
+ $('#settingsLocaleTimeRow').hide();
+ }
+ };
+ var temp_sync_option = function (option) {
+ var self = $('#' + option);
+
+ if (self.prop('checked') !== (NETDATA.getOption('temperature') === 'celsius')) {
+ self.bootstrapToggle(NETDATA.getOption('temperature') === 'celsius' ? 'on' : 'off');
+ }
+ };
+ var timezone_sync_option = function (option) {
+ var self = $('#' + option);
+
+ document.getElementById('browser_timezone').innerText = NETDATA.options.browser_timezone;
+ document.getElementById('server_timezone').innerText = NETDATA.options.server_timezone;
+ document.getElementById('current_timezone').innerText = (NETDATA.options.current.timezone === 'default') ? 'unset, using browser default' : NETDATA.options.current.timezone;
+
+ if (self.prop('checked') === NETDATA.dateTime.using_timezone) {
+ self.bootstrapToggle(NETDATA.dateTime.using_timezone ? 'off' : 'on');
+ }
+ };
+
+ sync_option('eliminate_zero_dimensions');
+ sync_option('destroy_on_hide');
+ sync_option('async_on_scroll');
+ sync_option('parallel_refresher');
+ sync_option('concurrent_refreshes');
+ sync_option('sync_selection');
+ sync_option('sync_pan_and_zoom');
+ sync_option('stop_updates_when_focus_is_lost');
+ sync_option('smooth_plot');
+ sync_option('pan_and_zoom_data_padding');
+ sync_option('show_help');
+ sync_option('seconds_as_time');
+ theme_sync_option('netdata_theme_control');
+ units_sync_option('units_conversion');
+ temp_sync_option('units_temp');
+ timezone_sync_option('local_timezone');
+
+ if (NETDATA.getOption('parallel_refresher') === false) {
+ $('#concurrent_refreshes_row').hide();
+ } else {
+ $('#concurrent_refreshes_row').show();
+ }
+ };
+ NETDATA.setOption('setOptionCallback', update_options_modal);
+
+ // handle options changes
+ $('#eliminate_zero_dimensions').change(function () {
+ NETDATA.setOption('eliminate_zero_dimensions', $(this).prop('checked'));
+ });
+ $('#destroy_on_hide').change(function () {
+ NETDATA.setOption('destroy_on_hide', $(this).prop('checked'));
+ });
+ $('#async_on_scroll').change(function () {
+ NETDATA.setOption('async_on_scroll', $(this).prop('checked'));
+ });
+ $('#parallel_refresher').change(function () {
+ NETDATA.setOption('parallel_refresher', $(this).prop('checked'));
+ });
+ $('#concurrent_refreshes').change(function () {
+ NETDATA.setOption('concurrent_refreshes', $(this).prop('checked'));
+ });
+ $('#sync_selection').change(function () {
+ NETDATA.setOption('sync_selection', $(this).prop('checked'));
+ });
+ $('#sync_pan_and_zoom').change(function () {
+ NETDATA.setOption('sync_pan_and_zoom', $(this).prop('checked'));
+ });
+ $('#stop_updates_when_focus_is_lost').change(function () {
+ urlOptions.update_always = !$(this).prop('checked');
+ urlOptions.hashUpdate();
+
+ NETDATA.setOption('stop_updates_when_focus_is_lost', !urlOptions.update_always);
+ });
+ $('#smooth_plot').change(function () {
+ NETDATA.setOption('smooth_plot', $(this).prop('checked'));
+ });
+ $('#pan_and_zoom_data_padding').change(function () {
+ NETDATA.setOption('pan_and_zoom_data_padding', $(this).prop('checked'));
+ });
+ $('#seconds_as_time').change(function () {
+ NETDATA.setOption('seconds_as_time', $(this).prop('checked'));
+ });
+ $('#local_timezone').change(function () {
+ if ($(this).prop('checked')) {
+ selected_server_timezone('default', true);
+ } else {
+ selected_server_timezone('default', false);
+ }
+ });
+
+ $('#units_conversion').change(function () {
+ NETDATA.setOption('units', $(this).prop('checked') ? 'auto' : 'original');
+ });
+ $('#units_temp').change(function () {
+ NETDATA.setOption('temperature', $(this).prop('checked') ? 'celsius' : 'fahrenheit');
+ });
+
+ $('#show_help').change(function () {
+ urlOptions.help = $(this).prop('checked');
+ urlOptions.hashUpdate();
+
+ NETDATA.setOption('show_help', urlOptions.help);
+ netdataReload();
+ });
+
+ // this has to be the last
+ // it reloads the page
+ $('#netdata_theme_control').change(function () {
+ urlOptions.theme = $(this).prop('checked') ? 'slate' : 'white';
+ urlOptions.hashUpdate();
+
+ if (setTheme(urlOptions.theme)) {
+ netdataReload();
+ }
+ });
+}
+
+function scrollDashboardTo() {
+ if (netdataSnapshotData !== null && typeof netdataSnapshotData.hash !== 'undefined') {
+ //console.log(netdataSnapshotData.hash);
+ scrollToId(netdataSnapshotData.hash.replace('#', ''));
+ } else {
+ // check if we have to jump to a specific section
+ scrollToId(urlOptions.hash.replace('#', ''));
+
+ if (urlOptions.chart !== null) {
+ NETDATA.alarms.scrollToChart(urlOptions.chart);
+ //urlOptions.hash = '#' + NETDATA.name2id('menu_' + charts[c].menu + '_submenu_' + charts[c].submenu);
+ //urlOptions.hash = '#chart_' + NETDATA.name2id(urlOptions.chart);
+ //console.log('hash = ' + urlOptions.hash);
+ }
+ }
+}
+
+var modalHiddenCallback = null;
+
+function scrollToChartAfterHidingModal(chart, alarmDate, alarmStatus) {
+ modalHiddenCallback = function () {
+ NETDATA.alarms.scrollToChart(chart, alarmDate);
+
+ if (['WARNING', 'CRITICAL'].includes(alarmStatus)) {
+ const currentChartState = NETDATA.options.targets.find(
+ (chartState) => chartState.id === chart,
+ )
+ const twoMinutes = 2 * 60 * 1000
+ NETDATA.globalPanAndZoom.setMaster(
+ currentChartState,
+ alarmDate - twoMinutes,
+ alarmDate + twoMinutes,
+ )
+ }
+ };
+}
+
+// ----------------------------------------------------------------------------
+
+function enableTooltipsAndPopovers() {
+ $('[data-toggle="tooltip"]').tooltip({
+ animated: 'fade',
+ trigger: 'hover',
+ html: true,
+ delay: {show: 500, hide: 0},
+ container: 'body'
+ });
+ $('[data-toggle="popover"]').popover();
+}
+
+// ----------------------------------------------------------------------------
+
+var runOnceOnDashboardLastRun = 0;
+
+function runOnceOnDashboardWithjQuery() {
+ if (runOnceOnDashboardLastRun !== 0) {
+ scrollDashboardTo();
+
+ // restore the scrollspy at the proper position
+ $(document.body).scrollspy('refresh');
+ $(document.body).scrollspy('process');
+
+ return;
+ }
+
+ runOnceOnDashboardLastRun = Date.now();
+
+ // ------------------------------------------------------------------------
+ // bootstrap modals
+
+ // prevent bootstrap modals from scrolling the page
+ // maintains the current scroll position
+ // https://stackoverflow.com/a/34754029/4525767
+
+ var scrollPos = 0;
+ var modal_depth = 0; // how many modals are currently open
+ var modal_shown = false; // set to true, if a modal is shown
+ var netdata_paused_on_modal = false; // set to true, if the modal paused netdata
+ var scrollspyOffset = $(window).height() / 3; // will be updated below - the offset of scrollspy to select an item
+
+ $('.modal')
+ .on('show.bs.modal', function () {
+ if (modal_depth === 0) {
+ scrollPos = window.scrollY;
+
+ $('body').css({
+ overflow: 'hidden',
+ position: 'fixed',
+ top: -scrollPos
+ });
+
+ modal_shown = true;
+
+ if (NETDATA.options.pauseCallback === null) {
+ NETDATA.pause(function () {
+ });
+ netdata_paused_on_modal = true;
+ } else {
+ netdata_paused_on_modal = false;
+ }
+ }
+
+ modal_depth++;
+ //console.log(urlOptions.after);
+
+ })
+ .on('hide.bs.modal', function () {
+
+ modal_depth--;
+
+ if (modal_depth <= 0) {
+ modal_depth = 0;
+
+ $('body')
+ .css({
+ overflow: '',
+ position: '',
+ top: ''
+ });
+
+ // scroll to the position we had open before the modal
+ $('html, body')
+ .animate({scrollTop: scrollPos}, 0);
+
+ // unpause netdata, if we paused it
+ if (netdata_paused_on_modal === true) {
+ NETDATA.unpause();
+ netdata_paused_on_modal = false;
+ }
+
+ // restore the scrollspy at the proper position
+ $(document.body).scrollspy('process');
+ }
+ //console.log(urlOptions.after);
+ })
+ .on('hidden.bs.modal', function () {
+ if (modal_depth === 0) {
+ modal_shown = false;
+ }
+
+ if (typeof modalHiddenCallback === 'function') {
+ modalHiddenCallback();
+ }
+
+ modalHiddenCallback = null;
+ //console.log(urlOptions.after);
+ });
+
+ // ------------------------------------------------------------------------
+ // sidebar / affix
+
+ if (shouldShowSignInBanner()) {
+ const el = document.getElementById("sign-in-banner");
+ if (el) {
+ el.style.display = "initial";
+ el.classList.add(`theme-${netdataTheme}`);
+ }
+ }
+
+ $('#sidebar')
+ .affix({
+ offset: {
+ top: (isdemo()) ? 150 : 0,
+ bottom: 0
+ }
+ })
+ .on('affixed.bs.affix', function () {
+ // fix scrolling of very long affix lists
+ // http://stackoverflow.com/questions/21691585/bootstrap-3-1-0-affix-too-long
+
+ $(this).removeAttr('style');
+ })
+ .on('affix-top.bs.affix', function () {
+ // fix bootstrap affix click bug
+ // https://stackoverflow.com/a/37847981/4525767
+
+ if (modal_shown) {
+ return false;
+ }
+ })
+ .on('activate.bs.scrollspy', function (e) {
+ // change the URL based on the current position of the screen
+
+ if (modal_shown === false) {
+ var el = $(e.target);
+ var hash = el.find('a').attr('href');
+ if (typeof hash === 'string' && hash.substring(0, 1) === '#' && urlOptions.hash.startsWith(hash + '_submenu_') === false) {
+ urlOptions.hash = hash;
+ urlOptions.hashUpdate();
+ }
+ }
+ });
+
+ Ps.initialize(document.getElementById('sidebar'), {
+ wheelSpeed: 0.5,
+ wheelPropagation: true,
+ swipePropagation: true,
+ minScrollbarLength: null,
+ maxScrollbarLength: null,
+ useBothWheelAxes: false,
+ suppressScrollX: true,
+ suppressScrollY: false,
+ scrollXMarginOffset: 0,
+ scrollYMarginOffset: 0,
+ theme: 'default'
+ });
+
+ // ------------------------------------------------------------------------
+ // scrollspy
+
+ if (scrollspyOffset > 250) {
+ scrollspyOffset = 250;
+ }
+ if (scrollspyOffset < 75) {
+ scrollspyOffset = 75;
+ }
+ document.body.setAttribute('data-offset', scrollspyOffset);
+
+ // scroll the dashboard, before activating the scrollspy, so that our
+ // hash will not be updated before we got the chance to scroll to it
+ scrollDashboardTo();
+
+ $(document.body).scrollspy({
+ target: '#sidebar',
+ offset: scrollspyOffset // controls the diff of the <hX> element to the top, to select it
+ });
+
+ // ------------------------------------------------------------------------
+ // my-netdata menu
+
+ Ps.initialize(document.getElementById('my-netdata-dropdown-content'), {
+ wheelSpeed: 1,
+ wheelPropagation: false,
+ swipePropagation: false,
+ minScrollbarLength: null,
+ maxScrollbarLength: null,
+ useBothWheelAxes: false,
+ suppressScrollX: true,
+ suppressScrollY: false,
+ scrollXMarginOffset: 0,
+ scrollYMarginOffset: 0,
+ theme: 'default'
+ });
+
+ $('#myNetdataDropdownParent')
+ .on('show.bs.dropdown', function () {
+ var hash = urlOptions.genHash();
+ $('.registry_link').each(function (idx) {
+ this.setAttribute('href', this.getAttribute("href").replace(/#.*$/, hash));
+ });
+
+ NETDATA.pause(function () {
+ });
+ })
+ .on('shown.bs.dropdown', function () {
+ Ps.update(document.getElementById('my-netdata-dropdown-content'));
+ myNetdataMenuDidShow();
+ })
+ .on('hidden.bs.dropdown', function () {
+ NETDATA.unpause();
+ });
+
+ $('#deleteRegistryModal')
+ .on('hidden.bs.modal', function () {
+ deleteRegistryGuid = null;
+ });
+
+ // ------------------------------------------------------------------------
+ // update modal
+
+ $('#updateModal')
+ .on('show.bs.modal', function () {
+ versionLog('checking, please wait...');
+ })
+ .on('shown.bs.modal', function () {
+ notifyForUpdate(true);
+ });
+
+ // ------------------------------------------------------------------------
+ // alarms modal
+
+ $('#alarmsModal')
+ .on('shown.bs.modal', function () {
+ alarmsUpdateModal();
+ })
+ .on('hidden.bs.modal', function () {
+ document.getElementById('alarms_active').innerHTML =
+ document.getElementById('alarms_all').innerHTML =
+ document.getElementById('alarms_log').innerHTML =
+ 'loading...';
+ });
+
+ // ------------------------------------------------------------------------
+
+ dashboardSettingsSetup();
+ loadSnapshotDragAndDropSetup();
+ saveSnapshotModalSetup();
+ showPageFooter();
+
+ // ------------------------------------------------------------------------
+ // https://github.com/viralpatel/jquery.shorten/blob/master/src/jquery.shorten.js
+
+ $.fn.shorten = function (settings) {
+ "use strict";
+
+ var config = {
+ showChars: 750,
+ minHideChars: 10,
+ ellipsesText: "...",
+ moreText: '<i class="fas fa-expand"></i> show more information',
+ lessText: '<i class="fas fa-compress"></i> show less information',
+ onLess: function () {
+ NETDATA.onscroll();
+ },
+ onMore: function () {
+ NETDATA.onscroll();
+ },
+ errMsg: null,
+ force: false
+ };
+
+ if (settings) {
+ $.extend(config, settings);
+ }
+
+ if ($(this).data('jquery.shorten') && !config.force) {
+ return false;
+ }
+ $(this).data('jquery.shorten', true);
+
+ $(document).off("click", '.morelink');
+
+ $(document).on({
+ click: function () {
+
+ var $this = $(this);
+ if ($this.hasClass('less')) {
+ $this.removeClass('less');
+ $this.html(config.moreText);
+ $this.parent().prev().animate({'height': '0' + '%'}, 0, function () {
+ $this.parent().prev().prev().show();
+ }).hide(0, function () {
+ config.onLess();
+ });
+ } else {
+ $this.addClass('less');
+ $this.html(config.lessText);
+ $this.parent().prev().animate({'height': '100' + '%'}, 0, function () {
+ $this.parent().prev().prev().hide();
+ }).show(0, function () {
+ config.onMore();
+ });
+ }
+ return false;
+ }
+ }, '.morelink');
+
+ return this.each(function () {
+ var $this = $(this);
+
+ var content = $this.html();
+ var contentlen = $this.text().length;
+ if (contentlen > config.showChars + config.minHideChars) {
+ var c = content.substr(0, config.showChars);
+ if (c.indexOf('<') >= 0) // If there's HTML don't want to cut it
+ {
+ var inTag = false; // I'm in a tag?
+ var bag = ''; // Put the characters to be shown here
+ var countChars = 0; // Current bag size
+ var openTags = []; // Stack for opened tags, so I can close them later
+ var tagName = null;
+
+ for (var i = 0, r = 0; r <= config.showChars; i++) {
+ if (content[i] === '<' && !inTag) {
+ inTag = true;
+
+ // This could be "tag" or "/tag"
+ tagName = content.substring(i + 1, content.indexOf('>', i));
+
+ // If its a closing tag
+ if (tagName[0] === '/') {
+
+ if (tagName !== ('/' + openTags[0])) {
+ config.errMsg = 'ERROR en HTML: the top of the stack should be the tag that closes';
+ } else {
+ openTags.shift(); // Pops the last tag from the open tag stack (the tag is closed in the retult HTML!)
+ }
+
+ } else {
+ // There are some nasty tags that don't have a close tag like <br/>
+ if (tagName.toLowerCase() !== 'br') {
+ openTags.unshift(tagName); // Add to start the name of the tag that opens
+ }
+ }
+ }
+
+ if (inTag && content[i] === '>') {
+ inTag = false;
+ }
+
+ if (inTag) {
+ bag += content.charAt(i);
+ } else {
+ // Add tag name chars to the result
+ r++;
+ if (countChars <= config.showChars) {
+ bag += content.charAt(i); // Fix to ie 7 not allowing you to reference string characters using the []
+ countChars++;
+ } else {
+ // Now I have the characters needed
+ if (openTags.length > 0) {
+ // I have unclosed tags
+
+ //console.log('They were open tags');
+ //console.log(openTags);
+ for (var j = 0; j < openTags.length; j++) {
+ //console.log('Cierro tag ' + openTags[j]);
+ bag += '</' + openTags[j] + '>'; // Close all tags that were opened
+
+ // You could shift the tag from the stack to check if you end with an empty stack, that means you have closed all open tags
+ }
+ break;
+ }
+ }
+ }
+ }
+ c = $('<div/>').html(bag + '<span class="ellip">' + config.ellipsesText + '</span>').html();
+ } else {
+ c += config.ellipsesText;
+ }
+
+ var html = '<div class="shortcontent">' + c +
+ '</div><div class="allcontent">' + content +
+ '</div><span><a href="javascript://nop/" class="morelink">' + config.moreText + '</a></span>';
+
+ $this.html(html);
+ $this.find(".allcontent").hide(); // Hide all text
+ $('.shortcontent p:last', $this).css('margin-bottom', 0); //Remove bottom margin on last paragraph as it's likely shortened
+ }
+ });
+ };
+}
+
+function finalizePage() {
+ // resize all charts - without starting the background thread
+ // this has to be done while NETDATA is paused
+ // if we ommit this, the affix menu will be wrong, since all
+ // the Dom elements are initially zero-sized
+ NETDATA.parseDom();
+
+ // ------------------------------------------------------------------------
+
+ NETDATA.globalPanAndZoom.callback = null;
+ NETDATA.globalChartUnderlay.callback = null;
+
+ if (urlOptions.pan_and_zoom === true && NETDATA.options.targets.length > 0) {
+ NETDATA.globalPanAndZoom.setMaster(NETDATA.options.targets[0], urlOptions.after, urlOptions.before);
+ }
+
+ // callback for us to track PanAndZoom operations
+ NETDATA.globalPanAndZoom.callback = urlOptions.netdataPanAndZoomCallback;
+ NETDATA.globalChartUnderlay.callback = urlOptions.netdataHighlightCallback;
+
+ // ------------------------------------------------------------------------
+
+ // let it run (update the charts)
+ NETDATA.unpause();
+
+ runOnceOnDashboardWithjQuery();
+ $(".shorten").shorten();
+ enableTooltipsAndPopovers();
+
+ if (isdemo()) {
+ // do not to give errors on netdata demo servers for 60 seconds
+ NETDATA.options.current.retries_on_data_failures = 60;
+
+ // google analytics when this is used for the home page of the demo sites
+ // this does not run on user's installations
+ setTimeout(function () {
+ (function (i, s, o, g, r, a, m) {
+ i['GoogleAnalyticsObject'] = r;
+ i[r] = i[r] || function () {
+ (i[r].q = i[r].q || []).push(arguments)
+ }, i[r].l = 1 * new Date();
+ a = s.createElement(o),
+ m = s.getElementsByTagName(o)[0];
+ a.async = 1;
+ a.src = g;
+ m.parentNode.insertBefore(a, m)
+ })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
+
+ ga('create', 'UA-64295674-3', 'auto');
+ ga('send', 'pageview', '/demosite/' + window.location.host);
+ }, 2000);
+ } else {
+ notifyForUpdate();
+ }
+
+ if (urlOptions.show_alarms === true) {
+ setTimeout(function () {
+ $('#alarmsModal').modal('show');
+ }, 1000);
+ }
+
+ NETDATA.onresizeCallback = function () {
+ Ps.update(document.getElementById('sidebar'));
+ Ps.update(document.getElementById('my-netdata-dropdown-content'));
+ };
+ NETDATA.onresizeCallback();
+
+ if (netdataSnapshotData !== null) {
+ NETDATA.globalPanAndZoom.setMaster(NETDATA.options.targets[0], netdataSnapshotData.after_ms, netdataSnapshotData.before_ms);
+ }
+
+ //if (urlOptions.nowelcome !== true) {
+ // setTimeout(function () {
+ // $('#welcomeModal').modal();
+ // }, 2000);
+ //}
+
+ // var netdataEnded = performance.now();
+ // console.log('start up time: ' + (netdataEnded - netdataStarted).toString() + ' ms');
+}
+
+function resetDashboardOptions() {
+ var help = NETDATA.options.current.show_help;
+
+ NETDATA.resetOptions();
+ if (setTheme('slate')) {
+ netdataReload();
+ }
+
+ if (help !== NETDATA.options.current.show_help) {
+ netdataReload();
+ }
+}
+
+// callback to add the dashboard info to the
+// parallel javascript downloader in netdata
+var netdataPrepCallback = function () {
+ NETDATA.requiredCSS.push({
+ url: NETDATA.serverStatic + 'css/bootstrap-toggle-2.2.2.min.css',
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ });
+
+ NETDATA.requiredJs.push({
+ url: NETDATA.serverStatic + 'lib/bootstrap-toggle-2.2.2.min.js',
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ });
+
+ NETDATA.requiredJs.push({
+ url: NETDATA.serverStatic + 'dashboard_info.js?v20181019-1',
+ async: false,
+ isAlreadyLoaded: function () {
+ return false;
+ }
+ });
+
+ if (isdemo()) {
+ document.getElementById('masthead').style.display = 'block';
+ } else {
+ if (urlOptions.update_always === true) {
+ NETDATA.setOption('stop_updates_when_focus_is_lost', !urlOptions.update_always);
+ }
+ }
+};
+
+var selected_server_timezone = function (timezone, status) {
+ //console.log('called with timezone: ' + timezone + ", status: " + ((typeof status === 'undefined')?'undefined':status).toString());
+
+ // clear the error
+ document.getElementById('timezone_error_message').innerHTML = '';
+
+ if (typeof status === 'undefined') {
+ // the user selected a timezone from the menu
+
+ NETDATA.setOption('user_set_server_timezone', timezone);
+
+ if (NETDATA.dateTime.init(timezone) === false) {
+ NETDATA.dateTime.init();
+
+ if (!$('#local_timezone').prop('checked')) {
+ $('#local_timezone').bootstrapToggle('on');
+ }
+
+ document.getElementById('timezone_error_message').innerHTML = 'Ooops! That timezone was not accepted by your browser. Please open a github issue to help us fix it.';
+ NETDATA.setOption('user_set_server_timezone', NETDATA.options.server_timezone);
+ } else {
+ if ($('#local_timezone').prop('checked')) {
+ $('#local_timezone').bootstrapToggle('off');
+ }
+ }
+ } else if (status === true) {
+ // the user wants the browser default timezone to be activated
+
+ NETDATA.dateTime.init();
+ } else {
+ // the user wants the server default timezone to be activated
+ //console.log('found ' + NETDATA.options.current.user_set_server_timezone);
+
+ if (NETDATA.options.current.user_set_server_timezone === 'default') {
+ NETDATA.options.current.user_set_server_timezone = NETDATA.options.server_timezone;
+ }
+
+ timezone = NETDATA.options.current.user_set_server_timezone;
+
+ if (NETDATA.dateTime.init(timezone) === false) {
+ NETDATA.dateTime.init();
+
+ if (!$('#local_timezone').prop('checked')) {
+ $('#local_timezone').bootstrapToggle('on');
+ }
+
+ document.getElementById('timezone_error_message').innerHTML = 'Sorry. The timezone "' + timezone.toString() + '" is not accepted by your browser. Please select one from the list.';
+ NETDATA.setOption('user_set_server_timezone', NETDATA.options.server_timezone);
+ }
+ }
+
+ document.getElementById('current_timezone').innerText = (NETDATA.options.current.timezone === 'default') ? 'unset, using browser default' : NETDATA.options.current.timezone;
+ return false;
+};
+
+// our entry point
+// var netdataStarted = performance.now();
+
+var netdataCallback = initializeDynamicDashboard;
+
+// =================================================================================================
+// netdata.cloud
+
+let registryAgents = [];
+
+let cloudAgents = [];
+
+let myNetdataMenuFilterValue = "";
+
+let cloudAccountID = null;
+
+let cloudAccountName = null;
+
+let cloudToken = null;
+
+/// Enforces a maximum string length while retaining the prefix and the postfix of
+/// the string.
+function truncateString(str, maxLength) {
+ if (str.length <= maxLength) {
+ return str;
+ }
+
+ const spanLength = Math.floor((maxLength - 3) / 2);
+ return `${str.substring(0, spanLength)}...${str.substring(str.length - spanLength)}`;
+}
+
+// -------------------------------------------------------------------------------------------------
+// netdata.cloud API Client
+// -------------------------------------------------------------------------------------------------
+
+function isValidAgent(a) {
+ return a.urls != null && a.urls.length > 0;
+}
+
+// https://github.com/netdata/hub/issues/146
+function getCloudAccountAgents() {
+ if (!isSignedIn()) {
+ return [];
+ }
+
+ return fetch(
+ `${NETDATA.registry.cloudBaseURL}/api/v1/accounts/${cloudAccountID}/agents`,
+ {
+ method: "GET",
+ mode: "cors",
+ headers: {
+ "Authorization": `Bearer ${cloudToken}`
+ }
+ }
+ ).then((response) => {
+ if (!response.ok) {
+ throw Error("Cannot fetch known accounts");
+ }
+ return response.json();
+ }).then((payload) => {
+ const agents = payload.result ? payload.result.agents : null;
+
+ if (!agents) {
+ return [];
+ }
+
+ return agents.filter((a) => isValidAgent(a)).map((a) => {
+ return {
+ "guid": a.id,
+ "name": a.name,
+ "url": a.urls[0],
+ "alternate_urls": a.urls
+ }
+ })
+ }).catch(function (error) {
+ console.log(error);
+ return null;
+ });
+}
+
+/** Updates the lastAccessTime and accessCount properties of the agent for the account. */
+function touchAgent() {
+ if (!isSignedIn()) {
+ return [];
+ }
+
+ const touchUrl = `${NETDATA.registry.cloudBaseURL}/api/v1/agents/${NETDATA.registry.machine_guid}/touch?account_id=${cloudAccountID}`;
+ return fetch(
+ touchUrl,
+ {
+ method: "post",
+ body: "",
+ mode: "cors",
+ headers: {
+ "Authorization": `Bearer ${cloudToken}`
+ }
+ }
+ ).then((response) => {
+ if (!response.ok) {
+ throw Error("Cannot touch agent" + JSON.stringify(response));
+ }
+ return response.json();
+ }).then((payload) => {
+
+ }).catch(function (error) {
+ console.log(error);
+ return null;
+ });
+}
+
+// https://github.com/netdata/hub/issues/128
+function postCloudAccountAgents(agentsToSync) {
+ if (!isSignedIn()) {
+ return [];
+ }
+
+ const maskedURL = NETDATA.registry.MASKED_DATA;
+
+ const agents = agentsToSync.map((a) => {
+ const urls = a.alternate_urls.filter((url) => url != maskedURL);
+
+ return {
+ "id": a.guid,
+ "name": a.name,
+ "urls": urls
+ }
+ }).filter((a) => isValidAgent(a))
+
+ const payload = {
+ "accountID": cloudAccountID,
+ "agents": agents,
+ "merge": false,
+ };
+
+ return fetch(
+ `${NETDATA.registry.cloudBaseURL}/api/v1/accounts/${cloudAccountID}/agents`,
+ {
+ method: "POST",
+ mode: "cors",
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ "Authorization": `Bearer ${cloudToken}`
+ },
+ body: JSON.stringify(payload)
+ }
+ ).then((response) => {
+ return response.json();
+ }).then((payload) => {
+ const agents = payload.result ? payload.result.agents : null;
+
+ if (!agents) {
+ return [];
+ }
+
+ return agents.filter((a) => isValidAgent(a)).map((a) => {
+ return {
+ "guid": a.id,
+ "name": a.name,
+ "url": a.urls[0],
+ "alternate_urls": a.urls
+ }
+ })
+ });
+}
+
+function deleteCloudAgentURL(agentID, url) {
+ if (!isSignedIn()) {
+ return [];
+ }
+
+ return fetch(
+ `${NETDATA.registry.cloudBaseURL}/api/v1/accounts/${cloudAccountID}/agents/${agentID}/url?value=${encodeURIComponent(url)}`,
+ {
+ method: "DELETE",
+ mode: "cors",
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ "Authorization": `Bearer ${cloudToken}`
+ },
+ }
+ ).then((response) => {
+ return response.json();
+ }).then((payload) => {
+ const count = payload.result ? payload.result.count : 0;
+ return count;
+ });
+}
+
+// -------------------------------------------------------------------------------------------------
+
+function signInDidClick(e) {
+ e.preventDefault();
+ e.stopPropagation();
+
+ if (!NETDATA.registry.isUsingGlobalRegistry()) {
+ // If user is using a private registry, request his consent for
+ // synchronizing with cloud.
+ showSignInModal();
+ return;
+ }
+
+ signIn();
+}
+
+function shouldShowSignInBanner() {
+ return false;
+}
+
+function closeSignInBanner() {
+ localStorage.setItem("signInBannerClosed", "true");
+ const el = document.getElementById("sign-in-banner");
+ if (el) {
+ el.style.display = "none";
+ }
+}
+
+function closeSignInBannerDidClick(e) {
+ closeSignInBanner();
+}
+
+function signOutDidClick(e) {
+ e.preventDefault();
+ e.stopPropagation();
+ signOut();
+}
+
+// -------------------------------------------------------------------------------------------------
+
+function updateMyNetdataAfterFilterChange() {
+ const machinesEl = document.getElementById("my-netdata-menu-machines")
+ machinesEl.innerHTML = renderMachines(cloudAgents);
+
+ if (options.hosts.length > 1) {
+ const streamedEl = document.getElementById("my-netdata-menu-streamed")
+ streamedEl.innerHTML = renderStreamedHosts(options);
+ }
+}
+
+function myNetdataMenuDidShow() {
+ const filterEl = document.getElementById("my-netdata-menu-filter-input");
+ if (filterEl) {
+ filterEl.focus();
+ }
+}
+
+function myNetdataFilterDidChange(e) {
+ const inputEl = e.target;
+ setTimeout(() => {
+ myNetdataMenuFilterValue = inputEl.value;
+ updateMyNetdataAfterFilterChange();
+ }, 1);
+}
+
+function myNetdataFilterClearDidClick(e) {
+ e.preventDefault();
+ e.stopPropagation();
+
+ const inputEl = document.getElementById("my-netdata-menu-filter-input");
+ inputEl.value = "";
+ myNetdataMenuFilterValue = "";
+
+ updateMyNetdataAfterFilterChange();
+
+ inputEl.focus();
+}
+
+// -------------------------------------------------------------------------------------------------
+
+function clearCloudVariables() {
+ cloudAccountID = null;
+ cloudAccountName = null;
+ cloudToken = null;
+}
+
+function clearCloudLocalStorageItems() {
+ localStorage.removeItem("cloud.baseURL");
+ localStorage.removeItem("cloud.agentID");
+ localStorage.removeItem("cloud.sync");
+}
+
+function signIn() {
+ const url = `${NETDATA.registry.cloudBaseURL}/account/sign-in-agent?id=${NETDATA.registry.machine_guid}&name=${encodeURIComponent(NETDATA.registry.hostname)}&origin=${encodeURIComponent(window.location.origin + "/")}`;
+ window.open(url);
+}
+
+function signOut() {
+ cloudSSOSignOut();
+}
+
+function handleMessage(e) {
+ switch (e.data.type) {
+ case "sign-in":
+ handleSignInMessage(e);
+ break;
+
+ case "sign-out":
+ handleSignOutMessage(e);
+ break;
+
+ default:
+ return;
+ }
+}
+
+function handleSignInMessage(e) {
+ closeSignInBanner();
+ localStorage.setItem("cloud.baseURL", NETDATA.registry.cloudBaseURL);
+
+ cloudAccountID = e.data.accountID;
+ cloudAccountName = e.data.accountName;
+ cloudToken = e.data.token;
+
+ netdataRegistryCallback(registryAgents);
+ if (e.data.redirectURI && !window.location.href.includes(e.data.redirectURI)) {
+ // lgtm false-positive - redirectURI does not come from user input, but from iframe callback
+ window.location.replace(e.data.redirectURI); // lgtm[js/client-side-unvalidated-url-redirection]
+ }
+}
+
+function handleSignOutMessage(e) {
+ clearCloudVariables();
+ renderMyNetdataMenu(registryAgents);
+}
+
+function isSignedIn() {
+ return cloudToken != null && cloudAccountID != null;
+}
+
+function sortedArraysEqual(a, b) {
+ if (a.length != b.length) return false;
+
+ for (var i = 0; i < a.length; ++i) {
+ if (a[i] !== b[i]) return false;
+ }
+
+ return true;
+}
+
+// If merging is needed returns the merged agents set, otherwise returns null.
+function mergeAgents(cloud, local) {
+ let dirty = false;
+
+ const union = new Map();
+
+ for (const cagent of cloud) {
+ union.set(cagent.guid, cagent);
+ }
+
+ for (const lagent of local) {
+ const cagent = union.get(lagent.guid);
+ if (cagent) {
+ for (const u of lagent.alternate_urls) {
+ if (u === NETDATA.registry.MASKED_DATA) { // TODO: temp until registry is updated.
+ continue;
+ }
+
+ if (!cagent.alternate_urls.includes(u)) {
+ dirty = true;
+ cagent.alternate_urls.push(u);
+ }
+ }
+ } else {
+ dirty = true;
+ union.set(lagent.guid, lagent);
+ }
+ }
+
+ if (dirty) {
+ return Array.from(union.values());
+ }
+
+ return null;
+}
+
+function showSignInModal() {
+ document.getElementById("sim-registry").innerHTML = NETDATA.registry.server;
+ $("#signInModal").modal("show");
+}
+
+function explicitlySignIn() {
+ $("#signInModal").modal("hide");
+ signIn();
+}
+
+function showSyncModal() {
+ document.getElementById("sync-registry-modal-registry").innerHTML = NETDATA.registry.server;
+ $("#syncRegistryModal").modal("show");
+}
+
+function explicitlySyncAgents() {
+ $("#syncRegistryModal").modal("hide");
+
+ const json = localStorage.getItem("cloud.sync");
+ const sync = json ? JSON.parse(json): {};
+ delete sync[cloudAccountID];
+ localStorage.setItem("cloud.sync", JSON.stringify(sync));
+
+ NETDATA.registry.init();
+}
+
+function syncAgents(callback) {
+ const json = localStorage.getItem("cloud.sync");
+ const sync = json ? JSON.parse(json): {};
+
+ const currentAgent = {
+ guid: NETDATA.registry.machine_guid,
+ name: NETDATA.registry.hostname,
+ url: NETDATA.serverDefault,
+ alternate_urls: [NETDATA.serverDefault],
+ }
+
+ const localAgents = sync[cloudAccountID]
+ ? [currentAgent]
+ : registryAgents.concat([currentAgent]);
+
+ console.log("Checking if sync is needed.", localAgents);
+
+ const agentsToSync = mergeAgents(cloudAgents, localAgents);
+
+ if ((!sync[cloudAccountID]) || agentsToSync) {
+ sync[cloudAccountID] = new Date().getTime();
+ localStorage.setItem("cloud.sync", JSON.stringify(sync));
+ }
+
+ if (agentsToSync) {
+ console.log("Synchronizing with netdata.cloud.");
+
+ postCloudAccountAgents(agentsToSync).then((agents) => {
+ // TODO: clear syncTime on error!
+ cloudAgents = agents;
+ callback(cloudAgents);
+ });
+
+ return
+ }
+
+ callback(cloudAgents);
+}
+
+let isCloudSSOInitialized = false;
+
+function cloudSSOInit() {
+ const iframeEl = document.getElementById("ssoifrm");
+ const url = `${NETDATA.registry.cloudBaseURL}/account/sso-agent?id=${NETDATA.registry.machine_guid}`;
+ iframeEl.src = url;
+ isCloudSSOInitialized = true;
+}
+
+function cloudSSOSignOut() {
+ const iframe = document.getElementById("ssoifrm");
+ const url = `${NETDATA.registry.cloudBaseURL}/account/sign-out-agent`;
+ iframe.src = url;
+}
+
+function initCloud() {
+ if (!NETDATA.registry.isCloudEnabled) {
+ clearCloudVariables();
+ clearCloudLocalStorageItems();
+ return;
+ }
+
+ if (NETDATA.registry.cloudBaseURL != localStorage.getItem("cloud.baseURL")) {
+ clearCloudVariables();
+ clearCloudLocalStorageItems();
+ if (NETDATA.registry.cloudBaseURL) {
+ localStorage.setItem("cloud.baseURL", NETDATA.registry.cloudBaseURL);
+ }
+ }
+
+ if (!isCloudSSOInitialized) {
+ cloudSSOInit();
+ }
+
+ touchAgent();
+}
+
+// This callback is called after NETDATA.registry is initialized.
+function netdataRegistryCallback(machinesArray) {
+ localStorage.setItem("cloud.agentID", NETDATA.registry.machine_guid);
+
+ initCloud();
+
+ registryAgents = machinesArray;
+
+ if (isSignedIn()) {
+ // We call getCloudAccountAgents() here because it requires that
+ // NETDATA.registry is initialized.
+ clearMyNetdataMenu();
+ getCloudAccountAgents().then((agents) => {
+ if (!agents) {
+ errorMyNetdataMenu();
+ return;
+ }
+ cloudAgents = agents;
+ syncAgents((agents) => {
+ const agentsMap = {}
+ for (const agent of agents) {
+ agentsMap[agent.guid] = agent;
+ }
+
+ NETDATA.registry.machines = agentsMap;
+ NETDATA.registry.machines_array = agents;
+
+ renderMyNetdataMenu(agents);
+ });
+ });
+ } else {
+ renderMyNetdataMenu(machinesArray)
+ }
+};
+
+// If we know the cloudBaseURL and agentID from local storage render (eagerly)
+// the account ui before receiving the definitive response from the web server.
+// This improves the perceived performance.
+function tryFastInitCloud() {
+ const baseURL = localStorage.getItem("cloud.baseURL");
+ const agentID = localStorage.getItem("cloud.agentID");
+
+ if (baseURL && agentID) {
+ NETDATA.registry.cloudBaseURL = baseURL;
+ NETDATA.registry.machine_guid = agentID;
+ NETDATA.registry.isCloudEnabled = true;
+
+ initCloud();
+ }
+}
+
+function initializeApp() {
+ window.addEventListener("message", handleMessage, false);
+
+// tryFastInitCloud();
+}
+
+if (document.readyState === "complete") {
+ initializeApp();
+} else {
+ document.addEventListener("readystatechange", () => {
+ if (document.readyState === "complete") {
+ initializeApp();
+ }
+ });
+}