[MIT License](http://rawgit.com/hhurz/tableExport.jquery.plugin/master/tableExport.js)
-- [NanoScroller](https://jamesflorentino.github.io/nanoScrollerJS/)
+- [perfect-scrollbar](https://jamesflorentino.github.io/nanoScrollerJS/)
- Copyright 2012, James Florentino
- [MIT License](https://github.com/jamesflorentino/nanoScrollerJS/blob/master/LICENSE)
+ Copyright 2016, Hyunje Alex Jun and other contributors
+ [MIT License](https://github.com/noraesae/perfect-scrollbar/blob/master/LICENSE)
- [FontAwesome](https://fortawesome.github.io/Font-Awesome/)
lib/gauge-d5260c3.min.js \
lib/jquery-2.2.4.min.js \
lib/jquery.easypiechart-97b5824.min.js \
- lib/jquery.nanoscroller-0.8.7.min.js \
+ lib/perfect-scrollbar-0.6.15.min.js \
lib/jquery.peity-3.2.0.min.js \
lib/jquery.sparkline-2.1.2.min.js \
lib/morris-0.5.1.min.js \
html,
body {
- /*font-family: Calibri,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;*/
- font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
- font-style: normal;
- font-variant: normal;
+ /*font-family: Calibri,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;*/
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-style: normal;
+ font-variant: normal;
}
.morelink {
- color: #765d9c;
- text-decoration: none;
+ color: #765d9c;
+ text-decoration: none;
}
+
.morelink:hover {
- color: #563d7c;
- text-decoration: none;
+ color: #563d7c;
+ text-decoration: none;
}
+
.morelink:focus {
- color: #765d9c;
- text-decoration: none;
+ color: #765d9c;
+ text-decoration: none;
}
.netdata-chart-alignment {
- margin-left: 55px;
+ margin-left: 55px;
}
.netdata-chart-row {
- width: 100%;
- text-align: center;
- display: flex;
- display: -webkit-flex;
- display: -moz-flex;
- align-items: baseline;
- -moz-align-items: baseline;
- -webkit-align-items: baseline;
- justify-content: center;
- -webkit-justify-content: center;
- -moz-justify-content: center;
+ width: 100%;
+ text-align: center;
+ display: flex;
+ display: -webkit-flex;
+ display: -moz-flex;
+ align-items: baseline;
+ -moz-align-items: baseline;
+ -webkit-align-items: baseline;
+ justify-content: center;
+ -webkit-justify-content: center;
+ -moz-justify-content: center;
}
.netdata-container {
- display: inline-block;
- overflow: hidden;
+ display: inline-block;
+ overflow: hidden;
- /* required for child elements to have absolute position */
- position: relative;
-
- /* width and height is given per chart with data-width and data-height */
+ /* required for child elements to have absolute position */
+ position: relative;
+
+ /* width and height is given per chart with data-width and data-height */
}
.netdata-aspect {
- position: relative;
- width: 100%;
- padding: 0px;
- margin: 0px;
+ position: relative;
+ width: 100%;
+ padding: 0px;
+ margin: 0px;
}
.netdata-container-with-legend {
- display: inline-block;
- overflow: hidden;
+ display: inline-block;
+ overflow: hidden;
+
+ /* fix minimum scrollbar issue in firefox */
+ min-height: 99px;
- /* fix minimum scrollbar issue in firefox */
- min-height: 99px;
+ /* required for child elements to have absolute position */
+ position: relative;
- /* required for child elements to have absolute position */
- position: relative;
-
- /* width and height is given per chart with data-width and data-height */
+ /* width and height is given per chart with data-width and data-height */
}
.netdata-legend-resize-handler {
- display: block;
- position: absolute;
- bottom: 0px;
- right: 0px;
- height: 15px;
- width: 30px;
- background-color: White;
- font-size: 12px;
- vertical-align: middle;
- line-height: 15px;
- cursor: ns-resize;
- color: #DDDDDD;
- text-align: center;
- overflow: hidden;
- z-index: 20;
- padding: 0px;
- margin: 0px;
+ display: block;
+ position: absolute;
+ bottom: 0px;
+ right: 0px;
+ height: 15px;
+ width: 30px;
+ background-color: White;
+ font-size: 12px;
+ vertical-align: middle;
+ line-height: 15px;
+ cursor: ns-resize;
+ color: #DDDDDD;
+ text-align: center;
+ overflow: hidden;
+ z-index: 20;
+ padding: 0px;
+ margin: 0px;
}
.netdata-legend-toolbox {
- display: block;
- position: absolute;
- bottom: 0px;
- right: 30px;
- height: 15px;
- width: 110px;
- background-color: White;
- font-size: 12px;
- vertical-align: middle;
- line-height: 15px;
- color: #DDDDDD;
- text-align: center;
- overflow: hidden;
- z-index: 20;
- padding: 0px;
- margin: 0px;
+ display: block;
+ position: absolute;
+ bottom: 0px;
+ right: 30px;
+ height: 15px;
+ width: 110px;
+ background-color: White;
+ font-size: 12px;
+ vertical-align: middle;
+ line-height: 15px;
+ color: #DDDDDD;
+ text-align: center;
+ overflow: hidden;
+ z-index: 20;
+ padding: 0px;
+ margin: 0px;
}
.netdata-legend-toolbox-button {
- display: inline-block;
- position: relative;
- height: 15px;
- width: 18px;
- background-color: White;
- font-size: 12px;
- vertical-align: middle;
- line-height: 15px;
- color: #CDCDCD;
- text-align: center;
- overflow: hidden;
- z-index: 21;
- padding: 0px;
- margin: 0px;
- cursor: pointer;
+ display: inline-block;
+ position: relative;
+ height: 15px;
+ width: 18px;
+ background-color: White;
+ font-size: 12px;
+ vertical-align: middle;
+ line-height: 15px;
+ color: #CDCDCD;
+ text-align: center;
+ overflow: hidden;
+ z-index: 21;
+ padding: 0px;
+ margin: 0px;
+ cursor: pointer;
}
.netdata-message {
- display: inline-block;
- text-align: left;
- vertical-align: top;
- font-weight: bold;
- font-size: x-small;
- width: 100%;
- height: 100%;
- overflow: hidden;
- background: inherit;
- z-index: 0;
+ display: inline-block;
+ text-align: left;
+ vertical-align: top;
+ font-weight: bold;
+ font-size: x-small;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ background: inherit;
+ z-index: 0;
}
.netdata-message.hidden {
- display: none;
+ display: none;
}
.netdata-message.icon {
- color: #F8F8F8;
- text-align: center;
- vertical-align: middle;
+ color: #F8F8F8;
+ text-align: center;
+ vertical-align: middle;
}
.netdata-chart-legend {
- position: absolute; /* within .netdata-container */
- top: 0;
- right: 0;
- background-color: white;
- overflow: hidden;
- text-overflow: ellipsis;
- line-height: 14px;
- display: block;
- width: 140px; /* --legend-width */
- height: calc(100% - 15px); /* 10px for the resize handler and 5px for the top margin */
- font-size: 10px;
- margin-top: 5px;
- text-align: left;
- /* width and height is calculated (depends on the appearance of the legend) */
+ position: absolute; /* within .netdata-container */
+ top: 0;
+ right: 0;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ line-height: 14px;
+ display: block;
+ width: 140px; /* --legend-width */
+ height: calc(100% - 15px); /* 10px for the resize handler and 5px for the top margin */
+ font-size: 10px;
+ margin-top: 5px;
+ text-align: left;
+ /* width and height is calculated (depends on the appearance of the legend) */
}
.netdata-legend-title-date {
- font-size: 10px;
- font-weight: normal;
- margin-top: 0px;
+ font-size: 10px;
+ font-weight: normal;
+ margin-top: 0px;
}
+
.netdata-legend-title-time {
- font-size: 11px;
- font-weight: bold;
- margin-top: 0px;
+ font-size: 11px;
+ font-weight: bold;
+ margin-top: 0px;
}
+
.netdata-legend-title-units {
- position: absolute;
- right: 7px;
- float: right;
- font-size: 11px;
- vertical-align: top;
- font-weight: normal;
- margin-top: 0px;
+ position: absolute;
+ right: 10px;
+ float: right;
+ font-size: 11px;
+ vertical-align: top;
+ font-weight: normal;
+ margin-top: 0px;
}
+
.netdata-legend-series {
- position: absolute;
- width: 140px; /* legend-width */
- height: calc(100% - 50px);
- overflow: hidden;
- text-overflow: ellipsis;
- line-height: 14.5px; /* line spacing at the legend */
- display: block;
- font-size: 10px;
- margin-top: 0px;
-}
-
-.netdata-legend-series > .netdata-legend-series-content {
- position : absolute;
- overflow : scroll;
- overflow-x : hidden;
- top : 0;
- right : 0;
- bottom : 0;
- left : 0;
- text-overflow: ellipsis;
-}
-.netdata-legend-series > .netdata-legend-series-content:focus {
- outline: thin dotted;
-}
-.netdata-legend-series > .netdata-legend-series-content::-webkit-scrollbar {
- display: block; /* was 'none', but chrome was hiding content with it */
-}
-.has-scrollbar > .netdata-legend-series-content::-webkit-scrollbar {
- display: block;
-}
-.netdata-legend-series > .netdata-legend-series-pane {
-/* background : rgba(0,0,0,.25);*/
- background : #DDD;
- position : absolute;
- width : 4px;
- right : 0;
- top : 0;
- bottom : 0;
-/* visibility : hidden\9; */ /* Target only IE7 and IE8 with this hack */
-/* opacity : .01; */
-/* -webkit-transition : .2s; */
-/* -moz-transition : .2s; */
-/* -o-transition : .2s; */
-/* transition : .2s; */
- -moz-border-radius : 4px;
- -webkit-border-radius : 4px;
- border-radius : 4px;
-}
-.netdata-legend-series > .netdata-legend-series-pane > .netdata-legend-series-slider {
- background : #444;
-/* background : rgba(0,0,0,.5);*/
- position : relative;
- margin : 0 1px;
- -moz-border-radius : 2px;
- -webkit-border-radius : 2px;
- border-radius : 2px;
-}
-.netdata-legend-series:hover > .netdata-legend-series-pane, .netdata-legend-series-pane.active, .netdata-legend-series-pane.flashed {
-/* visibility : visible\9; */ /* Target only IE7 and IE8 with this hack */
-/* opacity : 0.99;*/
+ position: absolute;
+ width: 140px; /* legend-width */
+ height: calc(100% - 50px);
+ overflow: hidden;
+ text-overflow: ellipsis;
+ line-height: 14.5px; /* line spacing at the legend */
+ display: block;
+ font-size: 10px;
+ margin-top: 0px;
}
.netdata-legend-name-table-line {
- display: inline-block;
- width: 13px;
- height: 4px;
- border-width: 0px;
- border-bottom-width: 2px;
- border-bottom-style: solid;
- border-bottom-color: white;
+ display: inline-block;
+ width: 13px;
+ height: 4px;
+ border-width: 0px;
+ border-bottom-width: 2px;
+ border-bottom-style: solid;
+ border-bottom-color: white;
}
+
.netdata-legend-name-table-area {
- display: inline-block;
- width: 13px;
- height: 5px;
- border-width: 1px;
- border-top-width: 1px;
- border-top-style: solid;
- border-top-color: inherit;
+ display: inline-block;
+ width: 13px;
+ height: 5px;
+ border-width: 1px;
+ border-top-width: 1px;
+ border-top-style: solid;
+ border-top-color: inherit;
}
+
.netdata-legend-name-table-stacked {
- display: inline-block;
- width: 13px;
- height: 5px;
- border-width: 1px;
- border-top-width: 1px;
- border-top-style: solid;
- border-top-color: inherit;
+ display: inline-block;
+ width: 13px;
+ height: 5px;
+ border-width: 1px;
+ border-top-width: 1px;
+ border-top-style: solid;
+ border-top-color: inherit;
}
+
.netdata-legend-name-tr {
}
+
.netdata-legend-name-td {
}
+
.netdata-legend-name {
- text-align: left;
- font-size: 11px; /* legend: dimension name size */
- font-weight: bold;
- vertical-align: bottom;
- margin-top: 0px;
- z-index: 9;
- padding: 0px;
- width: 80px !important;
- max-width: 80px !important;
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
- display: inline-block;
- cursor: pointer;
+ text-align: left;
+ font-size: 11px; /* legend: dimension name size */
+ font-weight: bold;
+ vertical-align: bottom;
+ margin-top: 0px;
+ z-index: 9;
+ padding: 0px;
+ width: 80px !important;
+ max-width: 80px !important;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ display: inline-block;
+ cursor: pointer;
}
.netdata-legend-value {
- /*margin-left: 14px;*/
- position: absolute;
- right: 7px;
- float: right;
- text-align: right;
- font-size: 11px; /* legend: dimension value size */
- font-weight: bold;
- vertical-align: bottom;
- background-color: White;
- margin-top: 0px;
- z-index: 10;
- padding: 0px;
- padding-left: 15px;
- cursor: pointer;
- /* -webkit-font-smoothing: none; */
+ /*margin-left: 14px;*/
+ position: absolute;
+ right: 10px;
+ float: right;
+ text-align: right;
+ font-size: 11px; /* legend: dimension value size */
+ font-weight: bold;
+ vertical-align: bottom;
+ background-color: White;
+ margin-top: 0px;
+ z-index: 10;
+ padding: 0px;
+ padding-left: 15px;
+ cursor: pointer;
+ /* -webkit-font-smoothing: none; */
}
+
.netdata-legend-name.not-selected {
- font-weight: normal;
- opacity: 0.3;
+ font-weight: normal;
+ opacity: 0.3;
}
.netdata-chart {
- position: absolute; /* within .netdata-container */
- top: 0; /* within .netdata-container */
- left: 0; /* within .netdata-container */
- display: inline-block;
- overflow: hidden;
- width: 100%;
- height: 100%;
- z-index: 5;
+ position: absolute; /* within .netdata-container */
+ top: 0; /* within .netdata-container */
+ left: 0; /* within .netdata-container */
+ display: inline-block;
+ overflow: hidden;
+ width: 100%;
+ height: 100%;
+ z-index: 5;
- /* width and height is calculated (depends on the appearance of the legend) */
+ /* width and height is calculated (depends on the appearance of the legend) */
}
.netdata-chart-with-legend-right {
- position: absolute; /* within .netdata-container */
- top: 0; /* within .netdata-container */
- left: 0; /* within .netdata-container */
- display: block;
- overflow: hidden;
- margin-right: 140px; /* --legend-width */
- width: calc(100% - 140px); /* --legend-width */
- height: 100%;
- z-index: 5;
- flex-grow: 1;
+ position: absolute; /* within .netdata-container */
+ top: 0; /* within .netdata-container */
+ left: 0; /* within .netdata-container */
+ display: block;
+ overflow: hidden;
+ margin-right: 140px; /* --legend-width */
+ width: calc(100% - 140px); /* --legend-width */
+ height: 100%;
+ z-index: 5;
+ flex-grow: 1;
- /* width and height is calculated (depends on the appearance of the legend) */
+ /* width and height is calculated (depends on the appearance of the legend) */
}
.netdata-peity-chart {
}
.dygraph-label-rotate-left {
- text-align: center;
- /* See http://caniuse.com/#feat=transforms2d */
- transform: rotate(90deg);
- -webkit-transform: rotate(90deg);
- -moz-transform: rotate(90deg);
- -o-transform: rotate(90deg);
- -ms-transform: rotate(90deg);
+ text-align: center;
+ /* See http://caniuse.com/#feat=transforms2d */
+ transform: rotate(90deg);
+ -webkit-transform: rotate(90deg);
+ -moz-transform: rotate(90deg);
+ -o-transform: rotate(90deg);
+ -ms-transform: rotate(90deg);
}
/* For y2-axis label */
.dygraph-label-rotate-right {
- text-align: center;
- /* See http://caniuse.com/#feat=transforms2d */
- transform: rotate(-90deg);
- -webkit-transform: rotate(-90deg);
- -moz-transform: rotate(-90deg);
- -o-transform: rotate(-90deg);
- -ms-transform: rotate(-90deg);
+ text-align: center;
+ /* See http://caniuse.com/#feat=transforms2d */
+ transform: rotate(-90deg);
+ -webkit-transform: rotate(-90deg);
+ -moz-transform: rotate(-90deg);
+ -o-transform: rotate(-90deg);
+ -ms-transform: rotate(-90deg);
}
.dygraph-title {
- text-indent: 56px;
- text-align: left;
- position: absolute;
- left: 0px;
- top: 4px;
- font-size: 11px;
- font-weight: bold;
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
+ text-indent: 56px;
+ text-align: left;
+ position: absolute;
+ left: 0px;
+ top: 4px;
+ font-size: 11px;
+ font-weight: bold;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
}
/* fix for sparkline tooltip under bootstrap */
.jqstooltip {
- width: auto !important;
- height: auto !important;
+ width: auto !important;
+ height: auto !important;
}
.easyPieChart {
- position: relative;
- text-align: center;
+ position: relative;
+ text-align: center;
}
.easyPieChart canvas {
- position: absolute;
- top: 0;
- left: 0;
+ position: absolute;
+ top: 0;
+ left: 0;
}
.easyPieChartLabel {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 100%;
- text-align: center;
- color: #666;
- font-weight: normal;
- text-shadow: #BBB 0px 0px 1px;
- /* -webkit-font-smoothing: none; */
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 100%;
+ text-align: center;
+ color: #666;
+ font-weight: normal;
+ text-shadow: #BBB 0px 0px 1px;
+ /* -webkit-font-smoothing: none; */
}
.easyPieChartTitle {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 64%;
- margin-left: 18%;
- text-align: center;
- color: #999999;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 64%;
+ margin-left: 18%;
+ text-align: center;
+ color: #999999;
+ font-weight: normal;
}
.easyPieChartUnits {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 60%;
- margin-left: 20%;
- text-align: center;
- color: #999999;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 60%;
+ margin-left: 20%;
+ text-align: center;
+ color: #999999;
+ font-weight: normal;
}
.gaugeChart {
- position: relative;
- text-align: center;
+ position: relative;
+ text-align: center;
}
.gaugeChart canvas {
- position: absolute;
- top: 0;
- left: 0;
- z-index: 0;
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: 0;
}
.gaugeChartLabel {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 100%;
- text-align: center;
- color: #FFFFFF;
- font-weight: bold;
- z-index: 1;
- text-shadow: #777 0px 0px 1px;
- /* text-shadow: #CCC 1px 1px 0px, #CCC -1px -1px 0px, #CCC 1px -1px 0px, #CCC -1px 1px 0px; */
- /* -webkit-text-stroke: 1px #777; */
- /* -webkit-font-smoothing: none; */
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 100%;
+ text-align: center;
+ color: #FFFFFF;
+ font-weight: bold;
+ z-index: 1;
+ text-shadow: #777 0px 0px 1px;
+ /* text-shadow: #CCC 1px 1px 0px, #CCC -1px -1px 0px, #CCC 1px -1px 0px, #CCC -1px 1px 0px; */
+ /* -webkit-text-stroke: 1px #777; */
+ /* -webkit-font-smoothing: none; */
}
.gaugeChartTitle {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 100%;
- text-align: center;
- color: #999999;
- font-weight: bold;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 100%;
+ text-align: center;
+ color: #999999;
+ font-weight: bold;
}
.gaugeChartUnits {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- bottom: 0;
- width: 100%;
- text-align: left;
- margin-left: 5%;
- color: #999999;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ bottom: 0;
+ width: 100%;
+ text-align: left;
+ margin-left: 5%;
+ color: #999999;
+ font-weight: normal;
}
.gaugeChartMin {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- bottom: 10%;
- width: 92%;
- margin-left: 8%;
- text-align: left;
- color: #999999;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ bottom: 10%;
+ width: 92%;
+ margin-left: 8%;
+ text-align: left;
+ color: #999999;
+ font-weight: normal;
}
.gaugeChartMax {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- bottom: 10%;
- width: 95%;
- margin-right: 5%;
- text-align: right;
- color: #999999;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ bottom: 10%;
+ width: 95%;
+ margin-right: 5%;
+ text-align: right;
+ color: #999999;
+ font-weight: normal;
}
.popover-title {
- font-weight: bold;
- font-size: 12px;
+ font-weight: bold;
+ font-size: 12px;
}
+
.popover-content {
- font-size: 11px;
+ font-size: 11px;
+}
+
+/* ----------------------------------------------------------------------------
+ perfect-scrollbar settings
+ */
+
+.ps-container {
+ -ms-touch-action: auto;
+ touch-action: auto;
+ overflow: hidden !important;
+ -ms-overflow-style: none;
+}
+
+@supports (-ms-overflow-style: none) {
+ .ps-container {
+ overflow: auto !important;
+ }
+}
+
+@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+ .ps-container {
+ overflow: auto !important;
+ }
+}
+
+.ps-container.ps-active-x > .ps-scrollbar-x-rail,
+.ps-container.ps-active-y > .ps-scrollbar-y-rail {
+ display: block;
+ background-color: transparent;
+}
+
+.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
+ background-color: transparent; /* background color when dragged away */
+ opacity: 0.9;
+}
+
+.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
+ background-color: #aaa; /* scrollbar color when dragged away */
+ height: 4px;
+}
+
+.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
+ background-color: transparent; /* background color when dragged away */
+ opacity: 0.9;
+}
+
+.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
+ background-color: #aaa; /* scrollbar color when dragged away */
+ width: 4px;
+}
+
+.ps-container > .ps-scrollbar-x-rail {
+ display: none;
+ position: absolute;
+ /* please don't change 'position' */
+ opacity: 0.2; /* the opacity when not on hover of the content */
+ -webkit-transition: background-color .2s linear, opacity .2s linear;
+ -o-transition: background-color .2s linear, opacity .2s linear;
+ -moz-transition: background-color .2s linear, opacity .2s linear;
+ transition: background-color .2s linear, opacity .2s linear;
+ bottom: 0px;
+ /* there must be 'bottom' for ps-scrollbar-x-rail */
+ height: 8px;
+}
+
+.ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
+ position: absolute;
+ /* please don't change 'position' */
+ background-color: #666; /* #aaa; the color on content hover */
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ border-radius: 6px;
+ -webkit-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
+ -o-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
+ -moz-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -webkit-border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
+ bottom: 2px;
+ /* there must be 'bottom' for ps-scrollbar-x */
+ height: 4px; /* the width of the scrollbar */
+}
+
+.ps-container > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x, .ps-container > .ps-scrollbar-x-rail:active > .ps-scrollbar-x {
+ height: 4px;
+}
+
+.ps-container > .ps-scrollbar-y-rail {
+ display: none;
+ position: absolute;
+ /* please don't change 'position' */
+ opacity: 0.2; /* the opacity when not on hover of the content */
+ -webkit-transition: background-color .2s linear, opacity .2s linear;
+ -o-transition: background-color .2s linear, opacity .2s linear;
+ -moz-transition: background-color .2s linear, opacity .2s linear;
+ transition: background-color .2s linear, opacity .2s linear;
+ right: 0;
+ /* there must be 'right' for ps-scrollbar-y-rail */
+ width: 8px;
+}
+
+.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
+ position: absolute;
+ /* please don't change 'position' */
+ background-color: #666; /* #aaa; the color on content hover */
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ border-radius: 6px;
+ -webkit-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
+ -o-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
+ -moz-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -webkit-border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
+ right: 2px;
+ /* there must be 'right' for ps-scrollbar-y */
+ width: 4px; /* the width of the scrollbar */
+}
+
+.ps-container > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y, .ps-container > .ps-scrollbar-y-rail:active > .ps-scrollbar-y {
+ width: 4px;
+}
+
+.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
+ background-color: transparent; /* background color when dragged */
+ opacity: 0.9;
+}
+
+.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
+ background-color: #bbb; /* scrollbar color when dragged */
+ height: 4px;
+}
+
+.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
+ background-color: transparent; /* background color when dragged */
+ opacity: 0.9;
+}
+
+.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
+ background-color: #bbb; /* scrollbar color when dragged */
+ width: 4px;
+}
+
+.ps-container:hover > .ps-scrollbar-x-rail,
+.ps-container:hover > .ps-scrollbar-y-rail {
+ opacity: 0.6;
+}
+
+.ps-container:hover > .ps-scrollbar-x-rail:hover {
+ background-color: transparent; /* the background color on hover of the scrollbar */
+ opacity: 0.9;
+}
+
+.ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
+ background-color: #999; /* scrollbar color on hover */
+}
+
+.ps-container:hover > .ps-scrollbar-y-rail:hover {
+ background-color: transparent; /* the background color on hover of the scrollbar */
+ opacity: 0.9;
+}
+
+.ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
+ background-color: #999; /* scrollbar color on hover */
}
<!-- <script> netdataServer = "http://box:19999"; </script> -->
<!-- load the dashboard manager - it will do the rest -->
-<script type="text/javascript" src="dashboard.js?v20161218-1"></script>
+<script type="text/javascript" src="dashboard.js?v20161229-1"></script>
// the user given dimensions of the element
this.width = self.data('width') || NETDATA.chartDefaults.width;
this.height = self.data('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) {
title_date: null,
title_time: null,
title_units: null,
- nano: null,
- nano_options: null,
+ perfect_scroller: null, // the container to apply perfect scroller to
series: null
};
else if(typeof that.library.resize === 'function') {
that.library.resize(that);
- if(that.element_legend_childs.nano !== null && that.element_legend_childs.nano_options !== null)
- $(that.element_legend_childs.nano).nanoScroller();
+ if(that.element_legend_childs.perfect_scroller !== null)
+ Ps.update(that.element_legend_childs.perfect_scroller);
maxMessageFontSize();
}
this.event_resize.chart_last_h = this.element.clientHeight;
var now = Date.now();
- if(now - this.event_resize.last <= NETDATA.options.current.double_click_speed) {
+ 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
var optimal = this.event_resize.chart_last_h
- + this.element_legend_childs.content.scrollHeight
- - this.element_legend_childs.content.clientHeight;
+ + 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)
+ 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 we do not have the original height
- // reset to the original height
- else if(this.event_resize.chart_last_h != this.event_resize.chart_original_h)
+ // 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') {
+ var parent_rect = this.element.getBoundingClientRect();
+ var content_rect = this.element_legend_childs.perfect_scroller.firstElementChild.getBoundingClientRect();
+ var 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;
title_date: document.createElement('span'),
title_time: document.createElement('span'),
title_units: document.createElement('span'),
- nano: document.createElement('div'),
- nano_options: {
- paneClass: 'netdata-legend-series-pane',
- sliderClass: 'netdata-legend-series-slider',
- contentClass: 'netdata-legend-series-content',
- enabledClass: '__enabled',
- flashedClass: '__flashed',
- activeClass: '__active',
- tabIndex: -1,
- alwaysVisible: true,
- sliderMinHeight: 10
- },
+ perfect_scroller: document.createElement('div'),
series: {}
};
this.element_legend.appendChild(document.createElement('br'));
- this.element_legend_childs.nano.className = 'netdata-legend-series';
- this.element_legend.appendChild(this.element_legend_childs.nano);
+ 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.nano.appendChild(content);
+ this.element_legend_childs.perfect_scroller.appendChild(content);
if(NETDATA.options.current.show_help === true)
$(content).popover({
title_date: null,
title_time: null,
title_units: null,
- nano: null,
- nano_options: null,
+ perfect_scroller: null,
series: {}
};
}
this.element_legend_childs.hidden = document.createElement('div');
el.appendChild(this.element_legend_childs.hidden);
- if(this.element_legend_childs.nano !== null && this.element_legend_childs.nano_options !== null)
- $(this.element_legend_childs.nano).nanoScroller(this.element_legend_childs.nano_options);
+ 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();
};
}
},
{
- url: NETDATA.serverDefault + 'lib/jquery.nanoscroller-0.8.7.min.js',
+ url: NETDATA.serverDefault + 'lib/perfect-scrollbar-0.6.15.min.js',
isAlreadyLoaded: function() { return false; }
}
];
html,
body {
- /*font-family: Calibri,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;*/
- font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
- font-style: normal;
- font-variant: normal;
- color: #878b90;
+ /*font-family: Calibri,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;*/
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-style: normal;
+ font-variant: normal;
+ color: #878b90;
}
/* fixes for default slate theme */
code {
- color: #bbb; /*#c7254e;*/
- background-color: #555; /* #f9f2f4; */
+ color: #bbb; /*#c7254e;*/
+ background-color: #555; /* #f9f2f4; */
}
.dashboard-sidebar .nav > .active > a,
.dashboard-sidebar .nav > .active:hover > a,
.dashboard-sidebar .nav > .active:focus > a {
- color: #765d9c;
- border-left: 2px solid #765d9c;
+ color: #765d9c;
+ border-left: 2px solid #765d9c;
}
.morelink {
- color: #765d9c;
- text-decoration: none;
+ color: #765d9c;
+ text-decoration: none;
}
+
.morelink:hover {
- color: #563d7c;
- text-decoration: none;
+ color: #563d7c;
+ text-decoration: none;
}
+
.morelink:focus {
- color: #765d9c;
- text-decoration: none;
+ color: #765d9c;
+ text-decoration: none;
}
.netdata-chart-alignment {
- margin-left: 55px;
+ margin-left: 55px;
}
.netdata-chart-row {
- width: 100%;
- text-align: center;
- display: flex;
- display: -webkit-flex;
- display: -moz-flex;
- align-items: flex-end;
- -moz-align-items: flex-end;
- -webkit-align-items: flex-end;
- justify-content: center;
- -moz--webkit-justify-content: center;
- -moz-justify-content: center;
+ width: 100%;
+ text-align: center;
+ display: flex;
+ display: -webkit-flex;
+ display: -moz-flex;
+ align-items: flex-end;
+ -moz-align-items: flex-end;
+ -webkit-align-items: flex-end;
+ justify-content: center;
+ -moz--webkit-justify-content: center;
+ -moz-justify-content: center;
}
.netdata-container {
- display: inline-block;
- overflow: hidden;
+ display: inline-block;
+ overflow: hidden;
- /* required for child elements to have absolute position */
- position: relative;
-
- /* width and height is given per chart with data-width and data-height */
+ /* required for child elements to have absolute position */
+ position: relative;
+
+ /* width and height is given per chart with data-width and data-height */
}
.netdata-aspect {
- position: relative;
- width: 100%;
- padding: 0px;
- margin: 0px;
+ position: relative;
+ width: 100%;
+ padding: 0px;
+ margin: 0px;
}
.netdata-container-with-legend {
- display: inline-block;
- overflow: hidden;
+ display: inline-block;
+ overflow: hidden;
+
+ /* fix minimum scrollbar issue in firefox */
+ min-height: 99px;
- /* fix minimum scrollbar issue in firefox */
- min-height: 99px;
+ /* required for child elements to have absolute position */
+ position: relative;
- /* required for child elements to have absolute position */
- position: relative;
-
- /* width and height is given per chart with data-width and data-height */
+ /* width and height is given per chart with data-width and data-height */
}
.netdata-legend-resize-handler {
- display: block;
- position: absolute;
- bottom: 0px;
- right: 0px;
- height: 15px;
- width: 30px;
- background-color: #272b30;
- font-size: 12px;
- vertical-align: middle;
- line-height: 15px;
- cursor: ns-resize;
- color: #373b40;
- text-align: center;
- overflow: hidden;
- z-index: 20;
- padding: 0px;
- margin: 0px;
+ display: block;
+ position: absolute;
+ bottom: 0px;
+ right: 0px;
+ height: 15px;
+ width: 30px;
+ background-color: #272b30;
+ font-size: 12px;
+ vertical-align: middle;
+ line-height: 15px;
+ cursor: ns-resize;
+ color: #373b40;
+ text-align: center;
+ overflow: hidden;
+ z-index: 20;
+ padding: 0px;
+ margin: 0px;
}
.netdata-legend-toolbox {
- display: block;
- position: absolute;
- bottom: 0px;
- right: 30px;
- height: 15px;
- width: 110px;
- background-color: #272b30;
- font-size: 12px;
- vertical-align: middle;
- line-height: 15px;
- color: #373b40;
- text-align: center;
- overflow: hidden;
- z-index: 20;
- padding: 0px;
- margin: 0px;
+ display: block;
+ position: absolute;
+ bottom: 0px;
+ right: 30px;
+ height: 15px;
+ width: 110px;
+ background-color: #272b30;
+ font-size: 12px;
+ vertical-align: middle;
+ line-height: 15px;
+ color: #373b40;
+ text-align: center;
+ overflow: hidden;
+ z-index: 20;
+ padding: 0px;
+ margin: 0px;
}
.netdata-legend-toolbox-button {
- display: inline-block;
- position: relative;
- height: 15px;
- width: 18px;
- background-color: #272b30;
- font-size: 12px;
- vertical-align: middle;
- line-height: 15px;
- color: #474b50;
- text-align: center;
- overflow: hidden;
- z-index: 21;
- padding: 0px;
- margin: 0px;
- cursor: pointer;
+ display: inline-block;
+ position: relative;
+ height: 15px;
+ width: 18px;
+ background-color: #272b30;
+ font-size: 12px;
+ vertical-align: middle;
+ line-height: 15px;
+ color: #474b50;
+ text-align: center;
+ overflow: hidden;
+ z-index: 21;
+ padding: 0px;
+ margin: 0px;
+ cursor: pointer;
}
.netdata-message {
- display: inline-block;
- text-align: left;
- vertical-align: top;
- font-weight: bold;
- font-size: x-small;
- width: 100%;
- height: 100%;
- overflow: hidden;
- background: inherit;
- z-index: 0;
+ display: inline-block;
+ text-align: left;
+ vertical-align: top;
+ font-weight: bold;
+ font-size: x-small;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ background: inherit;
+ z-index: 0;
}
.netdata-message.hidden {
- display: none;
+ display: none;
}
.netdata-message.icon {
- color: #2f3338;
- text-align: center;
- vertical-align: middle;
+ color: #2f3338;
+ text-align: center;
+ vertical-align: middle;
}
.netdata-chart-legend {
- position: absolute; /* within .netdata-container */
- top: 0;
- right: 0;
- background-color: #272b30;
- overflow: hidden;
- text-overflow: ellipsis;
- line-height: 14px;
- display: block;
- width: 140px; /* --legend-width */
- height: calc(100% - 15px); /* 10px for the resize handler and 5px for the top margin */
- font-size: 10px;
- margin-top: 5px;
- text-align: left;
- /* width and height is calculated (depends on the appearance of the legend) */
+ position: absolute; /* within .netdata-container */
+ top: 0;
+ right: 0;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ line-height: 14px;
+ display: block;
+ width: 140px; /* --legend-width */
+ height: calc(100% - 15px); /* 10px for the resize handler and 5px for the top margin */
+ font-size: 10px;
+ margin-top: 5px;
+ text-align: left;
+ /* width and height is calculated (depends on the appearance of the legend) */
}
.netdata-legend-title-date {
- font-size: 10px;
- font-weight: normal;
- margin-top: 0px;
+ font-size: 10px;
+ font-weight: normal;
+ margin-top: 0px;
}
+
.netdata-legend-title-time {
- font-size: 11px;
- font-weight: bold;
- margin-top: 0px;
+ font-size: 11px;
+ font-weight: bold;
+ margin-top: 0px;
}
+
.netdata-legend-title-units {
- position: absolute;
- right: 7px;
- float: right;
- font-size: 11px;
- vertical-align: top;
- font-weight: normal;
- margin-top: 0px;
+ position: absolute;
+ right: 10px;
+ float: right;
+ font-size: 11px;
+ vertical-align: top;
+ font-weight: normal;
+ margin-top: 0px;
}
+
.netdata-legend-series {
- position: absolute;
- width: 140px; /* legend-width */
- height: calc(100% - 50px);
- overflow: hidden;
- text-overflow: ellipsis;
- line-height: 14.5px; /* line spacing at the legend */
- display: block;
- font-size: 10px;
- margin-top: 0px;
-}
-
-.netdata-legend-series > .netdata-legend-series-content {
- position : absolute;
- overflow : scroll;
- overflow-x : hidden;
- top : 0;
- right : 0;
- bottom : 0;
- left : 0;
- text-overflow: ellipsis;
-}
-.netdata-legend-series > .netdata-legend-series-content:focus {
- outline: thin dotted;
-}
-.netdata-legend-series > .netdata-legend-series-content::-webkit-scrollbar {
- display: block; /* was 'none', but chrome was hidding content with it */
-}
-.has-scrollbar > .netdata-legend-series-content::-webkit-scrollbar {
- display: block;
-}
-.netdata-legend-series > .netdata-legend-series-pane {
-/* background : rgba(0,0,0,.25);*/
- background : #373b40;
- position : absolute;
- width : 4px;
- right : 0;
- top : 0;
- bottom : 0;
-/* visibility : hidden\9; */ /* Target only IE7 and IE8 with this hack */
-/* opacity : .01; */
-/* -webkit-transition : .2s; */
-/* -moz-transition : .2s; */
-/* -o-transition : .2s; */
-/* transition : .2s; */
- -moz-border-radius : 4px;
- -webkit-border-radius : 4px;
- border-radius : 4px;
-}
-.netdata-legend-series > .netdata-legend-series-pane > .netdata-legend-series-slider {
- background : #222; /* nano scroller handler color */
-/* background : rgba(0,0,0,.5);*/
- position : relative;
- margin : 0 1px;
- -moz-border-radius : 2px;
- -webkit-border-radius : 2px;
- border-radius : 2px;
-}
-.netdata-legend-series:hover > .netdata-legend-series-pane, .netdata-legend-series-pane.active, .netdata-legend-series-pane.flashed {
-/* visibility : visible\9; */ /* Target only IE7 and IE8 with this hack */
-/* opacity : 0.99;*/
+ position: absolute;
+ width: 140px; /* legend-width */
+ height: calc(100% - 50px);
+ overflow: hidden;
+ text-overflow: ellipsis;
+ line-height: 14.5px; /* line spacing at the legend */
+ display: block;
+ font-size: 10px;
+ margin-top: 0px;
}
.netdata-legend-name-table-line {
- display: inline-block;
- width: 13px;
- height: 4px;
- border-width: 0px;
- border-bottom-width: 2px;
- border-bottom-style: solid;
- border-bottom-color: #272b30;
+ display: inline-block;
+ width: 13px;
+ height: 4px;
+ border-width: 0px;
+ border-bottom-width: 2px;
+ border-bottom-style: solid;
+ border-bottom-color: #272b30;
}
+
.netdata-legend-name-table-area {
- display: inline-block;
- width: 13px;
- height: 5px;
- border-width: 1px;
- border-top-width: 1px;
- border-top-style: solid;
- border-top-color: inherit;
+ display: inline-block;
+ width: 13px;
+ height: 5px;
+ border-width: 1px;
+ border-top-width: 1px;
+ border-top-style: solid;
+ border-top-color: inherit;
}
+
.netdata-legend-name-table-stacked {
- display: inline-block;
- width: 13px;
- height: 5px;
- border-width: 1px;
- border-top-width: 1px;
- border-top-style: solid;
- border-top-color: inherit;
+ display: inline-block;
+ width: 13px;
+ height: 5px;
+ border-width: 1px;
+ border-top-width: 1px;
+ border-top-style: solid;
+ border-top-color: inherit;
}
+
.netdata-legend-name-tr {
}
+
.netdata-legend-name-td {
}
+
.netdata-legend-name {
- text-align: left;
- font-size: 11px; /* legend: dimension name size */
- font-weight: bold;
- vertical-align: bottom;
- margin-top: 0px;
- z-index: 9;
- padding: 0px;
- width: 80px !important;
- max-width: 80px !important;
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
- display: inline-block;
- cursor: pointer;
+ text-align: left;
+ font-size: 11px; /* legend: dimension name size */
+ font-weight: bold;
+ vertical-align: bottom;
+ margin-top: 0px;
+ z-index: 9;
+ padding: 0px;
+ width: 80px !important;
+ max-width: 80px !important;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ display: inline-block;
+ cursor: pointer;
}
.netdata-legend-value {
- /*margin-left: 14px;*/
- position: absolute;
- right: 7px;
- float: right;
- text-align: right;
- font-size: 11px; /* legend: dimension value size */
- font-weight: bold;
- vertical-align: bottom;
- background-color: #272b30;
- margin-top: 0px;
- z-index: 10;
- padding: 0px;
- padding-left: 15px;
- cursor: pointer;
- /* -webkit-font-smoothing: none; */
+ /*margin-left: 14px;*/
+ position: absolute;
+ right: 10px;
+ float: right;
+ text-align: right;
+ font-size: 11px; /* legend: dimension value size */
+ font-weight: bold;
+ vertical-align: bottom;
+ background-color: #272b30;
+ margin-top: 0px;
+ z-index: 10;
+ padding: 0px;
+ padding-left: 15px;
+ cursor: pointer;
+ /* -webkit-font-smoothing: none; */
}
+
.netdata-legend-name.not-selected {
- font-weight: normal;
- opacity: 0.3;
+ font-weight: normal;
+ opacity: 0.3;
}
.netdata-chart {
- position: absolute; /* within .netdata-container */
- top: 0; /* within .netdata-container */
- left: 0; /* within .netdata-container */
- display: inline-block;
- overflow: hidden;
- width: 100%;
- height: 100%;
- z-index: 5;
+ position: absolute; /* within .netdata-container */
+ top: 0; /* within .netdata-container */
+ left: 0; /* within .netdata-container */
+ display: inline-block;
+ overflow: hidden;
+ width: 100%;
+ height: 100%;
+ z-index: 5;
- /* width and height is calculated (depends on the appearance of the legend) */
+ /* width and height is calculated (depends on the appearance of the legend) */
}
.netdata-chart-with-legend-right {
- position: absolute; /* within .netdata-container */
- top: 0; /* within .netdata-container */
- left: 0; /* within .netdata-container */
- display: block;
- overflow: hidden;
- margin-right: 140px; /* --legend-width */
- width: calc(100% - 140px); /* --legend-width */
- height: 100%;
- z-index: 5;
- flex-grow: 1;
+ position: absolute; /* within .netdata-container */
+ top: 0; /* within .netdata-container */
+ left: 0; /* within .netdata-container */
+ display: block;
+ overflow: hidden;
+ margin-right: 140px; /* --legend-width */
+ width: calc(100% - 140px); /* --legend-width */
+ height: 100%;
+ z-index: 5;
+ flex-grow: 1;
- /* width and height is calculated (depends on the appearance of the legend) */
+ /* width and height is calculated (depends on the appearance of the legend) */
}
.netdata-peity-chart {
}
.dygraph-axis-label {
- color: #6c7075;
+ color: #6c7075;
}
.dygraph-label-rotate-left {
- text-align: center;
- /* See http://caniuse.com/#feat=transforms2d */
- transform: rotate(90deg);
- -webkit-transform: rotate(90deg);
- -moz-transform: rotate(90deg);
- -o-transform: rotate(90deg);
- -ms-transform: rotate(90deg);
+ text-align: center;
+ /* See http://caniuse.com/#feat=transforms2d */
+ transform: rotate(90deg);
+ -webkit-transform: rotate(90deg);
+ -moz-transform: rotate(90deg);
+ -o-transform: rotate(90deg);
+ -ms-transform: rotate(90deg);
}
/* For y2-axis label */
.dygraph-label-rotate-right {
- text-align: center;
- /* See http://caniuse.com/#feat=transforms2d */
- transform: rotate(-90deg);
- -webkit-transform: rotate(-90deg);
- -moz-transform: rotate(-90deg);
- -o-transform: rotate(-90deg);
- -ms-transform: rotate(-90deg);
+ text-align: center;
+ /* See http://caniuse.com/#feat=transforms2d */
+ transform: rotate(-90deg);
+ -webkit-transform: rotate(-90deg);
+ -moz-transform: rotate(-90deg);
+ -o-transform: rotate(-90deg);
+ -ms-transform: rotate(-90deg);
}
.dygraph-title {
- text-indent: 56px;
- text-align: left;
- position: absolute;
- left: 0px;
- top: 4px;
- font-size: 11px;
- font-weight: bold;
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
+ text-indent: 56px;
+ text-align: left;
+ position: absolute;
+ left: 0px;
+ top: 4px;
+ font-size: 11px;
+ font-weight: bold;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
}
/* fix for sparkline tooltip under bootstrap */
.jqstooltip {
- width: auto !important;
- height: auto !important;
+ width: auto !important;
+ height: auto !important;
}
.easyPieChart {
- position: relative;
- text-align: center;
+ position: relative;
+ text-align: center;
}
.easyPieChart canvas {
- position: absolute;
- top: 0;
- left: 0;
+ position: absolute;
+ top: 0;
+ left: 0;
}
.easyPieChartLabel {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 100%;
- text-align: center;
- color: #BBB;
- font-weight: normal;
- text-shadow: #272b30 0px 0px 1px;
- /* -webkit-font-smoothing: none; */
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 100%;
+ text-align: center;
+ color: #BBB;
+ font-weight: normal;
+ text-shadow: #272b30 0px 0px 1px;
+ /* -webkit-font-smoothing: none; */
}
.easyPieChartTitle {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 64%;
- margin-left: 18%;
- text-align: center;
- color: #676b70;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 64%;
+ margin-left: 18%;
+ text-align: center;
+ color: #676b70;
+ font-weight: normal;
}
.easyPieChartUnits {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 60%;
- margin-left: 20%;
- text-align: center;
- color: #676b70;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 60%;
+ margin-left: 20%;
+ text-align: center;
+ color: #676b70;
+ font-weight: normal;
}
.gaugeChart {
- position: relative;
- text-align: center;
+ position: relative;
+ text-align: center;
}
.gaugeChart canvas {
- position: absolute;
- top: 0;
- left: 0;
- z-index: 0;
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: 0;
}
.gaugeChartLabel {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 100%;
- text-align: center;
- color: #BBB;
- font-weight: bold;
- z-index: 1;
- text-shadow: #272b30 0px 0px 1px;
- /* text-shadow: #CCC 1px 1px 0px, #CCC -1px -1px 0px, #CCC 1px -1px 0px, #CCC -1px 1px 0px; */
- /* -webkit-text-stroke: 1px #777; */
- /* -webkit-font-smoothing: none; */
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 100%;
+ text-align: center;
+ color: #BBB;
+ font-weight: bold;
+ z-index: 1;
+ text-shadow: #272b30 0px 0px 1px;
+ /* text-shadow: #CCC 1px 1px 0px, #CCC -1px -1px 0px, #CCC 1px -1px 0px, #CCC -1px 1px 0px; */
+ /* -webkit-text-stroke: 1px #777; */
+ /* -webkit-font-smoothing: none; */
}
.gaugeChartTitle {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- width: 100%;
- text-align: center;
- color: #676b70;
- font-weight: bold;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ width: 100%;
+ text-align: center;
+ color: #676b70;
+ font-weight: bold;
}
.gaugeChartUnits {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- bottom: 0;
- width: 100%;
- text-align: left;
- margin-left: 5%;
- color: #676b70;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ bottom: 0;
+ width: 100%;
+ text-align: left;
+ margin-left: 5%;
+ color: #676b70;
+ font-weight: normal;
}
.gaugeChartMin {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- bottom: 10%;
- width: 92%;
- margin-left: 8%;
- text-align: left;
- color: #676b70;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ bottom: 10%;
+ width: 92%;
+ margin-left: 8%;
+ text-align: left;
+ color: #676b70;
+ font-weight: normal;
}
.gaugeChartMax {
- display: inline-block;
- position: absolute;
- float: left;
- left: 0;
- bottom: 10%;
- width: 95%;
- margin-right: 5%;
- text-align: right;
- color: #676b70;
- font-weight: normal;
+ display: inline-block;
+ position: absolute;
+ float: left;
+ left: 0;
+ bottom: 10%;
+ width: 95%;
+ margin-right: 5%;
+ text-align: right;
+ color: #676b70;
+ font-weight: normal;
}
.popover-title {
- font-weight: bold;
- font-size: 12px;
+ font-weight: bold;
+ font-size: 12px;
}
+
.popover-content {
- font-size: 11px;
+ font-size: 11px;
+}
+
+/* ----------------------------------------------------------------------------
+ perfect-scrollbar settings
+ */
+
+.ps-container {
+ -ms-touch-action: auto;
+ touch-action: auto;
+ overflow: hidden !important;
+ -ms-overflow-style: none;
+}
+
+@supports (-ms-overflow-style: none) {
+ .ps-container {
+ overflow: auto !important;
+ }
+}
+
+@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+ .ps-container {
+ overflow: auto !important;
+ }
+}
+
+.ps-container.ps-active-x > .ps-scrollbar-x-rail,
+.ps-container.ps-active-y > .ps-scrollbar-y-rail {
+ display: block;
+ background-color: transparent;
+}
+
+.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
+ background-color: transparent; /* background color when dragged away */
+ opacity: 0.9;
+}
+
+.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
+ background-color: #aaa; /* scrollbar color when dragged away */
+ height: 4px;
+}
+
+.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
+ background-color: transparent; /* background color when dragged away */
+ opacity: 0.9;
+}
+
+.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
+ background-color: #aaa; /* scrollbar color when dragged away */
+ width: 4px;
+}
+
+.ps-container > .ps-scrollbar-x-rail {
+ display: none;
+ position: absolute;
+ /* please don't change 'position' */
+ opacity: 0.2; /* the opacity when not on hover of the content */
+ -webkit-transition: background-color .2s linear, opacity .2s linear;
+ -o-transition: background-color .2s linear, opacity .2s linear;
+ -moz-transition: background-color .2s linear, opacity .2s linear;
+ transition: background-color .2s linear, opacity .2s linear;
+ bottom: 0px;
+ /* there must be 'bottom' for ps-scrollbar-x-rail */
+ height: 8px;
+}
+
+.ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
+ position: absolute;
+ /* please don't change 'position' */
+ background-color: #666; /* #aaa; the color on content hover */
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ border-radius: 6px;
+ -webkit-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
+ -o-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
+ -moz-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -webkit-border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
+ bottom: 2px;
+ /* there must be 'bottom' for ps-scrollbar-x */
+ height: 4px; /* the width of the scrollbar */
+}
+
+.ps-container > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x, .ps-container > .ps-scrollbar-x-rail:active > .ps-scrollbar-x {
+ height: 4px;
+}
+
+.ps-container > .ps-scrollbar-y-rail {
+ display: none;
+ position: absolute;
+ /* please don't change 'position' */
+ opacity: 0.2; /* the opacity when not on hover of the content */
+ -webkit-transition: background-color .2s linear, opacity .2s linear;
+ -o-transition: background-color .2s linear, opacity .2s linear;
+ -moz-transition: background-color .2s linear, opacity .2s linear;
+ transition: background-color .2s linear, opacity .2s linear;
+ right: 0;
+ /* there must be 'right' for ps-scrollbar-y-rail */
+ width: 8px;
+}
+
+.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
+ position: absolute;
+ /* please don't change 'position' */
+ background-color: #666; /* #aaa; the color on content hover */
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ border-radius: 6px;
+ -webkit-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
+ -o-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
+ -moz-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
+ transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -webkit-border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
+ right: 2px;
+ /* there must be 'right' for ps-scrollbar-y */
+ width: 4px; /* the width of the scrollbar */
+}
+
+.ps-container > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y, .ps-container > .ps-scrollbar-y-rail:active > .ps-scrollbar-y {
+ width: 4px;
+}
+
+.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
+ background-color: transparent; /* background color when dragged */
+ opacity: 0.9;
+}
+
+.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
+ background-color: #bbb; /* scrollbar color when dragged */
+ height: 4px;
+}
+
+.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
+ background-color: transparent; /* background color when dragged */
+ opacity: 0.9;
+}
+
+.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
+ background-color: #bbb; /* scrollbar color when dragged */
+ width: 4px;
+}
+
+.ps-container:hover > .ps-scrollbar-x-rail,
+.ps-container:hover > .ps-scrollbar-y-rail {
+ opacity: 0.6;
+}
+
+.ps-container:hover > .ps-scrollbar-x-rail:hover {
+ background-color: transparent; /* the background color on hover of the scrollbar */
+ opacity: 0.9;
+}
+
+.ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
+ background-color: #999; /* scrollbar color on hover */
+}
+
+.ps-container:hover > .ps-scrollbar-y-rail:hover {
+ background-color: transparent; /* the background color on hover of the scrollbar */
+ opacity: 0.9;
+}
+
+.ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
+ background-color: #999; /* scrollbar color on hover */
}
<meta property="og:title" content="netdata - real-time performance monitoring, done right!"/>
<meta property="og:description" content="Stunning real-time dashboards, blazingly fast and extremely interactive. Zero configuration, zero dependencies, zero maintenance." />
</head>
-<script type="text/javascript" src="dashboard.js?v20161218-1"></script>
+<script type="text/javascript" src="dashboard.js?v20161229-1"></script>
<body>
<div style="width: 100%; text-align: center;">
<meta property="og:description" content="Stunning real-time dashboards, blazingly fast and extremely interactive. Zero configuration, zero dependencies, zero maintenance." />
</head>
<script>var netdataTheme = 'slate';</script>
-<script type="text/javascript" src="http://my-netdata.io/dashboard.js?v20161218-1"></script>
+<script type="text/javascript" src="http://my-netdata.io/dashboard.js?v20161229-1"></script>
<body>
<div class="container" style="width: 90%; padding-top: 10px; text-align: center; color: #AAA">
and that you have chown it to be owned by netdata:netdata
-->
<!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
-<script type="text/javascript" src="dashboard.js?v20161227-1"></script>
+<script type="text/javascript" src="dashboard.js?v20161229-1"></script>
<script>
// --- OPTIONS FOR THE CHARTS --
and that you have chown it to be owned by netdata:netdata
-->
<!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
- <script type="text/javascript" src="dashboard.js?v20161218-1"></script>
+ <script type="text/javascript" src="dashboard.js?v20161229-1"></script>
<script>
// --- OPTIONS FOR THE CHARTS --
var netdataTheme = 'slate';
var netdataShowHelp = true;
</script>
-<script type="text/javascript" src="dashboard.js?v20161218-1"></script>
+<script type="text/javascript" src="dashboard.js?v20161229-1"></script>
<script>
var urlOptions = {
<i class="fa fa-circle"></i> <a href="http://www.bootstraptoggle.com/" target="_blank">Bootstrap Toggle</a>,
<i class="fa fa-copyright"></i> Copyright (c) 2011-2014 Min Hur, The New York Times Company, <a href="https://github.com/minhur/bootstrap-toggle/blob/master/LICENSE" target="_blank">MIT License</a>
- <i class="fa fa-circle"></i> <a href="https://jamesflorentino.github.io/nanoScrollerJS/" target="_blank">NanoScroller</a>,
- <i class="fa fa-copyright"></i> Copyright 2012, James Florentino, <a href="https://github.com/jamesflorentino/nanoScrollerJS/blob/master/LICENSE" target="_blank">MIT License</a>
+ <i class="fa fa-circle"></i> <a href="https://github.com/noraesae/perfect-scrollbar" target="_blank">perfect-scrollbar</a>,
+ <i class="fa fa-copyright"></i> Copyright 2016, Hyunje Alex Jun and other contributors, <a href="https://github.com/noraesae/perfect-scrollbar/blob/master/LICENSE" target="_blank">MIT License</a>
<i class="fa fa-circle"></i> <a href="https://fortawesome.github.io/Font-Awesome/" target="_blank">FontAwesome</a>,
<i class="fa fa-copyright"></i> Created by Dave Gandy, Font: <a href="http://scripts.sil.org/OFL" target="_blank">SIL OFL 1.1 License</a>, CSS: <a href="http://opensource.org/licenses/mit-license.html" target="_blank">MIT License</a>
</div>
</body>
</html>
-<script type="text/javascript" src="dashboard.js?v20161227-1"></script>
+<script type="text/javascript" src="dashboard.js?v20161229-1"></script>
+++ /dev/null
-/*! nanoScrollerJS - v0.8.7 - (c) 2015 James Florentino; Licensed MIT */
-
-!function(a){return"function"==typeof define&&define.amd?define(["jquery"],function(b){return a(b,window,document)}):"object"==typeof exports?module.exports=a(require("jquery"),window,document):a(jQuery,window,document)}(function(a,b,c){"use strict";var d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H;z={paneClass:"nano-pane",sliderClass:"nano-slider",contentClass:"nano-content",enabledClass:"has-scrollbar",flashedClass:"flashed",activeClass:"active",iOSNativeScrolling:!1,preventPageScrolling:!1,disableResize:!1,alwaysVisible:!1,flashDelay:1500,sliderMinHeight:20,sliderMaxHeight:null,documentContext:null,windowContext:null},u="scrollbar",t="scroll",l="mousedown",m="mouseenter",n="mousemove",p="mousewheel",o="mouseup",s="resize",h="drag",i="enter",w="up",r="panedown",f="DOMMouseScroll",g="down",x="wheel",j="keydown",k="keyup",v="touchmove",d="Microsoft Internet Explorer"===b.navigator.appName&&/msie 7./i.test(b.navigator.appVersion)&&b.ActiveXObject,e=null,D=b.requestAnimationFrame,y=b.cancelAnimationFrame,F=c.createElement("div").style,H=function(){var a,b,c,d,e,f;for(d=["t","webkitT","MozT","msT","OT"],a=e=0,f=d.length;f>e;a=++e)if(c=d[a],b=d[a]+"ransform",b in F)return d[a].substr(0,d[a].length-1);return!1}(),G=function(a){return H===!1?!1:""===H?a:H+a.charAt(0).toUpperCase()+a.substr(1)},E=G("transform"),B=E!==!1,A=function(){var a,b,d;return a=c.createElement("div"),b=a.style,b.position="absolute",b.width="100px",b.height="100px",b.overflow=t,b.top="-9999px",c.body.appendChild(a),d=a.offsetWidth-a.clientWidth,c.body.removeChild(a),d},C=function(){var a,c,d;return c=b.navigator.userAgent,(a=/(?=.+Mac OS X)(?=.+Firefox)/.test(c))?(d=/Firefox\/\d{2}\./.exec(c),d&&(d=d[0].replace(/\D+/g,"")),a&&+d>23):!1},q=function(){function j(d,f){this.el=d,this.options=f,e||(e=A()),this.$el=a(this.el),this.doc=a(this.options.documentContext||c),this.win=a(this.options.windowContext||b),this.body=this.doc.find("body"),this.$content=this.$el.children("."+this.options.contentClass),this.$content.attr("tabindex",this.options.tabIndex||0),this.content=this.$content[0],this.previousPosition=0,this.options.iOSNativeScrolling&&null!=this.el.style.WebkitOverflowScrolling?this.nativeScrolling():this.generate(),this.createEvents(),this.addEvents(),this.reset()}return j.prototype.preventScrolling=function(a,b){if(this.isActive)if(a.type===f)(b===g&&a.originalEvent.detail>0||b===w&&a.originalEvent.detail<0)&&a.preventDefault();else if(a.type===p){if(!a.originalEvent||!a.originalEvent.wheelDelta)return;(b===g&&a.originalEvent.wheelDelta<0||b===w&&a.originalEvent.wheelDelta>0)&&a.preventDefault()}},j.prototype.nativeScrolling=function(){this.$content.css({WebkitOverflowScrolling:"touch"}),this.iOSNativeScrolling=!0,this.isActive=!0},j.prototype.updateScrollValues=function(){var a,b;a=this.content,this.maxScrollTop=a.scrollHeight-a.clientHeight,this.prevScrollTop=this.contentScrollTop||0,this.contentScrollTop=a.scrollTop,b=this.contentScrollTop>this.previousPosition?"down":this.contentScrollTop<this.previousPosition?"up":"same",this.previousPosition=this.contentScrollTop,"same"!==b&&this.$el.trigger("update",{position:this.contentScrollTop,maximum:this.maxScrollTop,direction:b}),this.iOSNativeScrolling||(this.maxSliderTop=this.paneHeight-this.sliderHeight,this.sliderTop=0===this.maxScrollTop?0:this.contentScrollTop*this.maxSliderTop/this.maxScrollTop)},j.prototype.setOnScrollStyles=function(){var a;B?(a={},a[E]="translate(0, "+this.sliderTop+"px)"):a={top:this.sliderTop},D?(y&&this.scrollRAF&&y(this.scrollRAF),this.scrollRAF=D(function(b){return function(){return b.scrollRAF=null,b.slider.css(a)}}(this))):this.slider.css(a)},j.prototype.createEvents=function(){this.events={down:function(a){return function(b){return a.isBeingDragged=!0,a.offsetY=b.pageY-a.slider.offset().top,a.slider.is(b.target)||(a.offsetY=0),a.pane.addClass(a.options.activeClass),a.doc.bind(n,a.events[h]).bind(o,a.events[w]),a.body.bind(m,a.events[i]),!1}}(this),drag:function(a){return function(b){return a.sliderY=b.pageY-a.$el.offset().top-a.paneTop-(a.offsetY||.5*a.sliderHeight),a.scroll(),a.contentScrollTop>=a.maxScrollTop&&a.prevScrollTop!==a.maxScrollTop?a.$el.trigger("scrollend"):0===a.contentScrollTop&&0!==a.prevScrollTop&&a.$el.trigger("scrolltop"),!1}}(this),up:function(a){return function(b){return a.isBeingDragged=!1,a.pane.removeClass(a.options.activeClass),a.doc.unbind(n,a.events[h]).unbind(o,a.events[w]),a.body.unbind(m,a.events[i]),!1}}(this),resize:function(a){return function(b){a.reset()}}(this),panedown:function(a){return function(b){return a.sliderY=(b.offsetY||b.originalEvent.layerY)-.5*a.sliderHeight,a.scroll(),a.events.down(b),!1}}(this),scroll:function(a){return function(b){a.updateScrollValues(),a.isBeingDragged||(a.iOSNativeScrolling||(a.sliderY=a.sliderTop,a.setOnScrollStyles()),null!=b&&(a.contentScrollTop>=a.maxScrollTop?(a.options.preventPageScrolling&&a.preventScrolling(b,g),a.prevScrollTop!==a.maxScrollTop&&a.$el.trigger("scrollend")):0===a.contentScrollTop&&(a.options.preventPageScrolling&&a.preventScrolling(b,w),0!==a.prevScrollTop&&a.$el.trigger("scrolltop"))))}}(this),wheel:function(a){return function(b){var c;if(null!=b)return c=b.delta||b.wheelDelta||b.originalEvent&&b.originalEvent.wheelDelta||-b.detail||b.originalEvent&&-b.originalEvent.detail,c&&(a.sliderY+=-c/3),a.scroll(),!1}}(this),enter:function(a){return function(b){var c;if(a.isBeingDragged)return 1!==(b.buttons||b.which)?(c=a.events)[w].apply(c,arguments):void 0}}(this)}},j.prototype.addEvents=function(){var a;this.removeEvents(),a=this.events,this.options.disableResize||this.win.bind(s,a[s]),this.iOSNativeScrolling||(this.slider.bind(l,a[g]),this.pane.bind(l,a[r]).bind(""+p+" "+f,a[x])),this.$content.bind(""+t+" "+p+" "+f+" "+v,a[t])},j.prototype.removeEvents=function(){var a;a=this.events,this.win.unbind(s,a[s]),this.iOSNativeScrolling||(this.slider.unbind(),this.pane.unbind()),this.$content.unbind(""+t+" "+p+" "+f+" "+v,a[t])},j.prototype.generate=function(){var a,c,d,f,g,h,i;return f=this.options,h=f.paneClass,i=f.sliderClass,a=f.contentClass,(g=this.$el.children("."+h)).length||g.children("."+i).length||this.$el.append('<div class="'+h+'"><div class="'+i+'" /></div>'),this.pane=this.$el.children("."+h),this.slider=this.pane.find("."+i),0===e&&C()?(d=b.getComputedStyle(this.content,null).getPropertyValue("padding-right").replace(/[^0-9.]+/g,""),c={right:-14,paddingRight:+d+14}):e&&(c={right:-e},this.$el.addClass(f.enabledClass)),null!=c&&this.$content.css(c),this},j.prototype.restore=function(){this.stopped=!1,this.iOSNativeScrolling||this.pane.show(),this.addEvents()},j.prototype.reset=function(){var a,b,c,f,g,h,i,j,k,l,m,n;return this.iOSNativeScrolling?void(this.contentHeight=this.content.scrollHeight):(this.$el.find("."+this.options.paneClass).length||this.generate().stop(),this.stopped&&this.restore(),a=this.content,f=a.style,g=f.overflowY,d&&this.$content.css({height:this.$content.height()}),b=a.scrollHeight+e,l=parseInt(this.$el.css("max-height"),10),l>0&&(this.$el.height(""),this.$el.height(a.scrollHeight>l?l:a.scrollHeight)),i=this.pane.outerHeight(!1),k=parseInt(this.pane.css("top"),10),h=parseInt(this.pane.css("bottom"),10),j=i+k+h,n=Math.round(j/b*i),n<this.options.sliderMinHeight?n=this.options.sliderMinHeight:null!=this.options.sliderMaxHeight&&n>this.options.sliderMaxHeight&&(n=this.options.sliderMaxHeight),g===t&&f.overflowX!==t&&(n+=e),this.maxSliderTop=j-n,this.contentHeight=b,this.paneHeight=i,this.paneOuterHeight=j,this.sliderHeight=n,this.paneTop=k,this.slider.height(n),this.events.scroll(),this.pane.show(),this.isActive=!0,a.scrollHeight===a.clientHeight||this.pane.outerHeight(!0)>=a.scrollHeight&&g!==t?(this.pane.hide(),this.isActive=!1):this.el.clientHeight===a.scrollHeight&&g===t?this.slider.hide():this.slider.show(),this.pane.css({opacity:this.options.alwaysVisible?1:"",visibility:this.options.alwaysVisible?"visible":""}),c=this.$content.css("position"),("static"===c||"relative"===c)&&(m=parseInt(this.$content.css("right"),10),m&&this.$content.css({right:"",marginRight:m})),this)},j.prototype.scroll=function(){return this.isActive?(this.sliderY=Math.max(0,this.sliderY),this.sliderY=Math.min(this.maxSliderTop,this.sliderY),this.$content.scrollTop(this.maxScrollTop*this.sliderY/this.maxSliderTop),this.iOSNativeScrolling||(this.updateScrollValues(),this.setOnScrollStyles()),this):void 0},j.prototype.scrollBottom=function(a){return this.isActive?(this.$content.scrollTop(this.contentHeight-this.$content.height()-a).trigger(p),this.stop().restore(),this):void 0},j.prototype.scrollTop=function(a){return this.isActive?(this.$content.scrollTop(+a).trigger(p),this.stop().restore(),this):void 0},j.prototype.scrollTo=function(a){return this.isActive?(this.scrollTop(this.$el.find(a).get(0).offsetTop),this):void 0},j.prototype.stop=function(){return y&&this.scrollRAF&&(y(this.scrollRAF),this.scrollRAF=null),this.stopped=!0,this.removeEvents(),this.iOSNativeScrolling||this.pane.hide(),this},j.prototype.destroy=function(){return this.stopped||this.stop(),!this.iOSNativeScrolling&&this.pane.length&&this.pane.remove(),d&&this.$content.height(""),this.$content.removeAttr("tabindex"),this.$el.hasClass(this.options.enabledClass)&&(this.$el.removeClass(this.options.enabledClass),this.$content.css({right:""})),this},j.prototype.flash=function(){return!this.iOSNativeScrolling&&this.isActive?(this.reset(),this.pane.addClass(this.options.flashedClass),setTimeout(function(a){return function(){a.pane.removeClass(a.options.flashedClass)}}(this),this.options.flashDelay),this):void 0},j}(),a.fn.nanoScroller=function(b){return this.each(function(){var c,d;if((d=this.nanoscroller)||(c=a.extend({},z,b),this.nanoscroller=d=new q(this,c)),b&&"object"==typeof b){if(a.extend(d.options,b),null!=b.scrollBottom)return d.scrollBottom(b.scrollBottom);if(null!=b.scrollTop)return d.scrollTop(b.scrollTop);if(b.scrollTo)return d.scrollTo(b.scrollTo);if("bottom"===b.scroll)return d.scrollBottom(0);if("top"===b.scroll)return d.scrollTop(0);if(b.scroll&&b.scroll instanceof a)return d.scrollTo(b.scroll);if(b.stop)return d.stop();if(b.destroy)return d.destroy();if(b.flash)return d.flash()}return d.reset()})},a.fn.nanoScroller.Constructor=q});
-//# sourceMappingURL=jquery.nanoscroller.min.js.map
\ No newline at end of file
--- /dev/null
+/* perfect-scrollbar v0.6.15 */
+!function t(e,n,r){function o(i,s){if(!n[i]){if(!e[i]){var a="function"==typeof require&&require;if(!s&&a)return a(i,!0);if(l)return l(i,!0);var c=new Error("Cannot find module '"+i+"'");throw c.code="MODULE_NOT_FOUND",c}var u=n[i]={exports:{}};e[i][0].call(u.exports,function(t){var n=e[i][1][t];return o(n?n:t)},u,u.exports,t,e,n,r)}return n[i].exports}for(var l="function"==typeof require&&require,i=0;i<r.length;i++)o(r[i]);return o}({1:[function(t,e,n){"use strict";var r=t("../main");"function"==typeof define&&define.amd?define(r):(window.PerfectScrollbar=r,"undefined"==typeof window.Ps&&(window.Ps=r))},{"../main":7}],2:[function(t,e,n){"use strict";function r(t,e){var n=t.className.split(" ");n.indexOf(e)<0&&n.push(e),t.className=n.join(" ")}function o(t,e){var n=t.className.split(" "),r=n.indexOf(e);r>=0&&n.splice(r,1),t.className=n.join(" ")}n.add=function(t,e){t.classList?t.classList.add(e):r(t,e)},n.remove=function(t,e){t.classList?t.classList.remove(e):o(t,e)},n.list=function(t){return t.classList?Array.prototype.slice.apply(t.classList):t.className.split(" ")}},{}],3:[function(t,e,n){"use strict";function r(t,e){return window.getComputedStyle(t)[e]}function o(t,e,n){return"number"==typeof n&&(n=n.toString()+"px"),t.style[e]=n,t}function l(t,e){for(var n in e){var r=e[n];"number"==typeof r&&(r=r.toString()+"px"),t.style[n]=r}return t}var i={};i.e=function(t,e){var n=document.createElement(t);return n.className=e,n},i.appendTo=function(t,e){return e.appendChild(t),t},i.css=function(t,e,n){return"object"==typeof e?l(t,e):"undefined"==typeof n?r(t,e):o(t,e,n)},i.matches=function(t,e){return"undefined"!=typeof t.matches?t.matches(e):"undefined"!=typeof t.matchesSelector?t.matchesSelector(e):"undefined"!=typeof t.webkitMatchesSelector?t.webkitMatchesSelector(e):"undefined"!=typeof t.mozMatchesSelector?t.mozMatchesSelector(e):"undefined"!=typeof t.msMatchesSelector?t.msMatchesSelector(e):void 0},i.remove=function(t){"undefined"!=typeof t.remove?t.remove():t.parentNode&&t.parentNode.removeChild(t)},i.queryChildren=function(t,e){return Array.prototype.filter.call(t.childNodes,function(t){return i.matches(t,e)})},e.exports=i},{}],4:[function(t,e,n){"use strict";var r=function(t){this.element=t,this.events={}};r.prototype.bind=function(t,e){"undefined"==typeof this.events[t]&&(this.events[t]=[]),this.events[t].push(e),this.element.addEventListener(t,e,!1)},r.prototype.unbind=function(t,e){var n="undefined"!=typeof e;this.events[t]=this.events[t].filter(function(r){return!(!n||r===e)||(this.element.removeEventListener(t,r,!1),!1)},this)},r.prototype.unbindAll=function(){for(var t in this.events)this.unbind(t)};var o=function(){this.eventElements=[]};o.prototype.eventElement=function(t){var e=this.eventElements.filter(function(e){return e.element===t})[0];return"undefined"==typeof e&&(e=new r(t),this.eventElements.push(e)),e},o.prototype.bind=function(t,e,n){this.eventElement(t).bind(e,n)},o.prototype.unbind=function(t,e,n){this.eventElement(t).unbind(e,n)},o.prototype.unbindAll=function(){for(var t=0;t<this.eventElements.length;t++)this.eventElements[t].unbindAll()},o.prototype.once=function(t,e,n){var r=this.eventElement(t),o=function(t){r.unbind(e,o),n(t)};r.bind(e,o)},e.exports=o},{}],5:[function(t,e,n){"use strict";e.exports=function(){function t(){return Math.floor(65536*(1+Math.random())).toString(16).substring(1)}return function(){return t()+t()+"-"+t()+"-"+t()+"-"+t()+"-"+t()+t()+t()}}()},{}],6:[function(t,e,n){"use strict";var r=t("./class"),o=t("./dom"),l=n.toInt=function(t){return parseInt(t,10)||0},i=n.clone=function(t){if(t){if(t.constructor===Array)return t.map(i);if("object"==typeof t){var e={};for(var n in t)e[n]=i(t[n]);return e}return t}return null};n.extend=function(t,e){var n=i(t);for(var r in e)n[r]=i(e[r]);return n},n.isEditable=function(t){return o.matches(t,"input,[contenteditable]")||o.matches(t,"select,[contenteditable]")||o.matches(t,"textarea,[contenteditable]")||o.matches(t,"button,[contenteditable]")},n.removePsClasses=function(t){for(var e=r.list(t),n=0;n<e.length;n++){var o=e[n];0===o.indexOf("ps-")&&r.remove(t,o)}},n.outerWidth=function(t){return l(o.css(t,"width"))+l(o.css(t,"paddingLeft"))+l(o.css(t,"paddingRight"))+l(o.css(t,"borderLeftWidth"))+l(o.css(t,"borderRightWidth"))},n.startScrolling=function(t,e){r.add(t,"ps-in-scrolling"),"undefined"!=typeof e?r.add(t,"ps-"+e):(r.add(t,"ps-x"),r.add(t,"ps-y"))},n.stopScrolling=function(t,e){r.remove(t,"ps-in-scrolling"),"undefined"!=typeof e?r.remove(t,"ps-"+e):(r.remove(t,"ps-x"),r.remove(t,"ps-y"))},n.env={isWebKit:"WebkitAppearance"in document.documentElement.style,supportsTouch:"ontouchstart"in window||window.DocumentTouch&&document instanceof window.DocumentTouch,supportsIePointer:null!==window.navigator.msMaxTouchPoints}},{"./class":2,"./dom":3}],7:[function(t,e,n){"use strict";var r=t("./plugin/destroy"),o=t("./plugin/initialize"),l=t("./plugin/update");e.exports={initialize:o,update:l,destroy:r}},{"./plugin/destroy":9,"./plugin/initialize":17,"./plugin/update":21}],8:[function(t,e,n){"use strict";e.exports={handlers:["click-rail","drag-scrollbar","keyboard","wheel","touch"],maxScrollbarLength:null,minScrollbarLength:null,scrollXMarginOffset:0,scrollYMarginOffset:0,suppressScrollX:!1,suppressScrollY:!1,swipePropagation:!0,useBothWheelAxes:!1,wheelPropagation:!1,wheelSpeed:1,theme:"default"}},{}],9:[function(t,e,n){"use strict";var r=t("../lib/helper"),o=t("../lib/dom"),l=t("./instances");e.exports=function(t){var e=l.get(t);e&&(e.event.unbindAll(),o.remove(e.scrollbarX),o.remove(e.scrollbarY),o.remove(e.scrollbarXRail),o.remove(e.scrollbarYRail),r.removePsClasses(t),l.remove(t))}},{"../lib/dom":3,"../lib/helper":6,"./instances":18}],10:[function(t,e,n){"use strict";function r(t,e){function n(t){return t.getBoundingClientRect()}var r=function(t){t.stopPropagation()};e.event.bind(e.scrollbarY,"click",r),e.event.bind(e.scrollbarYRail,"click",function(r){var o=r.pageY-window.pageYOffset-n(e.scrollbarYRail).top,s=o>e.scrollbarYTop?1:-1;i(t,"top",t.scrollTop+s*e.containerHeight),l(t),r.stopPropagation()}),e.event.bind(e.scrollbarX,"click",r),e.event.bind(e.scrollbarXRail,"click",function(r){var o=r.pageX-window.pageXOffset-n(e.scrollbarXRail).left,s=o>e.scrollbarXLeft?1:-1;i(t,"left",t.scrollLeft+s*e.containerWidth),l(t),r.stopPropagation()})}var o=t("../instances"),l=t("../update-geometry"),i=t("../update-scroll");e.exports=function(t){var e=o.get(t);r(t,e)}},{"../instances":18,"../update-geometry":19,"../update-scroll":20}],11:[function(t,e,n){"use strict";function r(t,e){function n(n){var o=r+n*e.railXRatio,i=Math.max(0,e.scrollbarXRail.getBoundingClientRect().left)+e.railXRatio*(e.railXWidth-e.scrollbarXWidth);o<0?e.scrollbarXLeft=0:o>i?e.scrollbarXLeft=i:e.scrollbarXLeft=o;var s=l.toInt(e.scrollbarXLeft*(e.contentWidth-e.containerWidth)/(e.containerWidth-e.railXRatio*e.scrollbarXWidth))-e.negativeScrollAdjustment;c(t,"left",s)}var r=null,o=null,s=function(e){n(e.pageX-o),a(t),e.stopPropagation(),e.preventDefault()},u=function(){l.stopScrolling(t,"x"),e.event.unbind(e.ownerDocument,"mousemove",s)};e.event.bind(e.scrollbarX,"mousedown",function(n){o=n.pageX,r=l.toInt(i.css(e.scrollbarX,"left"))*e.railXRatio,l.startScrolling(t,"x"),e.event.bind(e.ownerDocument,"mousemove",s),e.event.once(e.ownerDocument,"mouseup",u),n.stopPropagation(),n.preventDefault()})}function o(t,e){function n(n){var o=r+n*e.railYRatio,i=Math.max(0,e.scrollbarYRail.getBoundingClientRect().top)+e.railYRatio*(e.railYHeight-e.scrollbarYHeight);o<0?e.scrollbarYTop=0:o>i?e.scrollbarYTop=i:e.scrollbarYTop=o;var s=l.toInt(e.scrollbarYTop*(e.contentHeight-e.containerHeight)/(e.containerHeight-e.railYRatio*e.scrollbarYHeight));c(t,"top",s)}var r=null,o=null,s=function(e){n(e.pageY-o),a(t),e.stopPropagation(),e.preventDefault()},u=function(){l.stopScrolling(t,"y"),e.event.unbind(e.ownerDocument,"mousemove",s)};e.event.bind(e.scrollbarY,"mousedown",function(n){o=n.pageY,r=l.toInt(i.css(e.scrollbarY,"top"))*e.railYRatio,l.startScrolling(t,"y"),e.event.bind(e.ownerDocument,"mousemove",s),e.event.once(e.ownerDocument,"mouseup",u),n.stopPropagation(),n.preventDefault()})}var l=t("../../lib/helper"),i=t("../../lib/dom"),s=t("../instances"),a=t("../update-geometry"),c=t("../update-scroll");e.exports=function(t){var e=s.get(t);r(t,e),o(t,e)}},{"../../lib/dom":3,"../../lib/helper":6,"../instances":18,"../update-geometry":19,"../update-scroll":20}],12:[function(t,e,n){"use strict";function r(t,e){function n(n,r){var o=t.scrollTop;if(0===n){if(!e.scrollbarYActive)return!1;if(0===o&&r>0||o>=e.contentHeight-e.containerHeight&&r<0)return!e.settings.wheelPropagation}var l=t.scrollLeft;if(0===r){if(!e.scrollbarXActive)return!1;if(0===l&&n<0||l>=e.contentWidth-e.containerWidth&&n>0)return!e.settings.wheelPropagation}return!0}var r=!1;e.event.bind(t,"mouseenter",function(){r=!0}),e.event.bind(t,"mouseleave",function(){r=!1});var i=!1;e.event.bind(e.ownerDocument,"keydown",function(c){if(!(c.isDefaultPrevented&&c.isDefaultPrevented()||c.defaultPrevented)){var u=l.matches(e.scrollbarX,":focus")||l.matches(e.scrollbarY,":focus");if(r||u){var d=document.activeElement?document.activeElement:e.ownerDocument.activeElement;if(d){if("IFRAME"===d.tagName)d=d.contentDocument.activeElement;else for(;d.shadowRoot;)d=d.shadowRoot.activeElement;if(o.isEditable(d))return}var p=0,f=0;switch(c.which){case 37:p=c.metaKey?-e.contentWidth:c.altKey?-e.containerWidth:-30;break;case 38:f=c.metaKey?e.contentHeight:c.altKey?e.containerHeight:30;break;case 39:p=c.metaKey?e.contentWidth:c.altKey?e.containerWidth:30;break;case 40:f=c.metaKey?-e.contentHeight:c.altKey?-e.containerHeight:-30;break;case 33:f=90;break;case 32:f=c.shiftKey?90:-90;break;case 34:f=-90;break;case 35:f=c.ctrlKey?-e.contentHeight:-e.containerHeight;break;case 36:f=c.ctrlKey?t.scrollTop:e.containerHeight;break;default:return}a(t,"top",t.scrollTop-f),a(t,"left",t.scrollLeft+p),s(t),i=n(p,f),i&&c.preventDefault()}}})}var o=t("../../lib/helper"),l=t("../../lib/dom"),i=t("../instances"),s=t("../update-geometry"),a=t("../update-scroll");e.exports=function(t){var e=i.get(t);r(t,e)}},{"../../lib/dom":3,"../../lib/helper":6,"../instances":18,"../update-geometry":19,"../update-scroll":20}],13:[function(t,e,n){"use strict";function r(t,e){function n(n,r){var o=t.scrollTop;if(0===n){if(!e.scrollbarYActive)return!1;if(0===o&&r>0||o>=e.contentHeight-e.containerHeight&&r<0)return!e.settings.wheelPropagation}var l=t.scrollLeft;if(0===r){if(!e.scrollbarXActive)return!1;if(0===l&&n<0||l>=e.contentWidth-e.containerWidth&&n>0)return!e.settings.wheelPropagation}return!0}function r(t){var e=t.deltaX,n=-1*t.deltaY;return"undefined"!=typeof e&&"undefined"!=typeof n||(e=-1*t.wheelDeltaX/6,n=t.wheelDeltaY/6),t.deltaMode&&1===t.deltaMode&&(e*=10,n*=10),e!==e&&n!==n&&(e=0,n=t.wheelDelta),t.shiftKey?[-n,-e]:[e,n]}function o(e,n){var r=t.querySelector("textarea:hover, select[multiple]:hover, .ps-child:hover");if(r){if(!window.getComputedStyle(r).overflow.match(/(scroll|auto)/))return!1;var o=r.scrollHeight-r.clientHeight;if(o>0&&!(0===r.scrollTop&&n>0||r.scrollTop===o&&n<0))return!0;var l=r.scrollLeft-r.clientWidth;if(l>0&&!(0===r.scrollLeft&&e<0||r.scrollLeft===l&&e>0))return!0}return!1}function s(s){var c=r(s),u=c[0],d=c[1];o(u,d)||(a=!1,e.settings.useBothWheelAxes?e.scrollbarYActive&&!e.scrollbarXActive?(d?i(t,"top",t.scrollTop-d*e.settings.wheelSpeed):i(t,"top",t.scrollTop+u*e.settings.wheelSpeed),a=!0):e.scrollbarXActive&&!e.scrollbarYActive&&(u?i(t,"left",t.scrollLeft+u*e.settings.wheelSpeed):i(t,"left",t.scrollLeft-d*e.settings.wheelSpeed),a=!0):(i(t,"top",t.scrollTop-d*e.settings.wheelSpeed),i(t,"left",t.scrollLeft+u*e.settings.wheelSpeed)),l(t),a=a||n(u,d),a&&(s.stopPropagation(),s.preventDefault()))}var a=!1;"undefined"!=typeof window.onwheel?e.event.bind(t,"wheel",s):"undefined"!=typeof window.onmousewheel&&e.event.bind(t,"mousewheel",s)}var o=t("../instances"),l=t("../update-geometry"),i=t("../update-scroll");e.exports=function(t){var e=o.get(t);r(t,e)}},{"../instances":18,"../update-geometry":19,"../update-scroll":20}],14:[function(t,e,n){"use strict";function r(t,e){e.event.bind(t,"scroll",function(){l(t)})}var o=t("../instances"),l=t("../update-geometry");e.exports=function(t){var e=o.get(t);r(t,e)}},{"../instances":18,"../update-geometry":19}],15:[function(t,e,n){"use strict";function r(t,e){function n(){var t=window.getSelection?window.getSelection():document.getSelection?document.getSelection():"";return 0===t.toString().length?null:t.getRangeAt(0).commonAncestorContainer}function r(){c||(c=setInterval(function(){return l.get(t)?(s(t,"top",t.scrollTop+u.top),s(t,"left",t.scrollLeft+u.left),void i(t)):void clearInterval(c)},50))}function a(){c&&(clearInterval(c),c=null),o.stopScrolling(t)}var c=null,u={top:0,left:0},d=!1;e.event.bind(e.ownerDocument,"selectionchange",function(){t.contains(n())?d=!0:(d=!1,a())}),e.event.bind(window,"mouseup",function(){d&&(d=!1,a())}),e.event.bind(window,"keyup",function(){d&&(d=!1,a())}),e.event.bind(window,"mousemove",function(e){if(d){var n={x:e.pageX,y:e.pageY},l={left:t.offsetLeft,right:t.offsetLeft+t.offsetWidth,top:t.offsetTop,bottom:t.offsetTop+t.offsetHeight};n.x<l.left+3?(u.left=-5,o.startScrolling(t,"x")):n.x>l.right-3?(u.left=5,o.startScrolling(t,"x")):u.left=0,n.y<l.top+3?(l.top+3-n.y<5?u.top=-5:u.top=-20,o.startScrolling(t,"y")):n.y>l.bottom-3?(n.y-l.bottom+3<5?u.top=5:u.top=20,o.startScrolling(t,"y")):u.top=0,0===u.top&&0===u.left?a():r()}})}var o=t("../../lib/helper"),l=t("../instances"),i=t("../update-geometry"),s=t("../update-scroll");e.exports=function(t){var e=l.get(t);r(t,e)}},{"../../lib/helper":6,"../instances":18,"../update-geometry":19,"../update-scroll":20}],16:[function(t,e,n){"use strict";function r(t,e,n,r){function o(n,r){var o=t.scrollTop,l=t.scrollLeft,i=Math.abs(n),s=Math.abs(r);if(s>i){if(r<0&&o===e.contentHeight-e.containerHeight||r>0&&0===o)return!e.settings.swipePropagation}else if(i>s&&(n<0&&l===e.contentWidth-e.containerWidth||n>0&&0===l))return!e.settings.swipePropagation;return!0}function a(e,n){s(t,"top",t.scrollTop-n),s(t,"left",t.scrollLeft-e),i(t)}function c(){w=!0}function u(){w=!1}function d(t){return t.targetTouches?t.targetTouches[0]:t}function p(t){return!(!t.targetTouches||1!==t.targetTouches.length)||!(!t.pointerType||"mouse"===t.pointerType||t.pointerType===t.MSPOINTER_TYPE_MOUSE)}function f(t){if(p(t)){Y=!0;var e=d(t);g.pageX=e.pageX,g.pageY=e.pageY,v=(new Date).getTime(),null!==y&&clearInterval(y),t.stopPropagation()}}function h(t){if(!Y&&e.settings.swipePropagation&&f(t),!w&&Y&&p(t)){var n=d(t),r={pageX:n.pageX,pageY:n.pageY},l=r.pageX-g.pageX,i=r.pageY-g.pageY;a(l,i),g=r;var s=(new Date).getTime(),c=s-v;c>0&&(m.x=l/c,m.y=i/c,v=s),o(l,i)&&(t.stopPropagation(),t.preventDefault())}}function b(){!w&&Y&&(Y=!1,clearInterval(y),y=setInterval(function(){return l.get(t)&&(m.x||m.y)?Math.abs(m.x)<.01&&Math.abs(m.y)<.01?void clearInterval(y):(a(30*m.x,30*m.y),m.x*=.8,void(m.y*=.8)):void clearInterval(y)},10))}var g={},v=0,m={},y=null,w=!1,Y=!1;n&&(e.event.bind(window,"touchstart",c),e.event.bind(window,"touchend",u),e.event.bind(t,"touchstart",f),e.event.bind(t,"touchmove",h),e.event.bind(t,"touchend",b)),r&&(window.PointerEvent?(e.event.bind(window,"pointerdown",c),e.event.bind(window,"pointerup",u),e.event.bind(t,"pointerdown",f),e.event.bind(t,"pointermove",h),e.event.bind(t,"pointerup",b)):window.MSPointerEvent&&(e.event.bind(window,"MSPointerDown",c),e.event.bind(window,"MSPointerUp",u),e.event.bind(t,"MSPointerDown",f),e.event.bind(t,"MSPointerMove",h),e.event.bind(t,"MSPointerUp",b)))}var o=t("../../lib/helper"),l=t("../instances"),i=t("../update-geometry"),s=t("../update-scroll");e.exports=function(t){if(o.env.supportsTouch||o.env.supportsIePointer){var e=l.get(t);r(t,e,o.env.supportsTouch,o.env.supportsIePointer)}}},{"../../lib/helper":6,"../instances":18,"../update-geometry":19,"../update-scroll":20}],17:[function(t,e,n){"use strict";var r=t("../lib/helper"),o=t("../lib/class"),l=t("./instances"),i=t("./update-geometry"),s={"click-rail":t("./handler/click-rail"),"drag-scrollbar":t("./handler/drag-scrollbar"),keyboard:t("./handler/keyboard"),wheel:t("./handler/mouse-wheel"),touch:t("./handler/touch"),selection:t("./handler/selection")},a=t("./handler/native-scroll");e.exports=function(t,e){e="object"==typeof e?e:{},o.add(t,"ps-container");var n=l.add(t);n.settings=r.extend(n.settings,e),o.add(t,"ps-theme-"+n.settings.theme),n.settings.handlers.forEach(function(e){s[e](t)}),a(t),i(t)}},{"../lib/class":2,"../lib/helper":6,"./handler/click-rail":10,"./handler/drag-scrollbar":11,"./handler/keyboard":12,"./handler/mouse-wheel":13,"./handler/native-scroll":14,"./handler/selection":15,"./handler/touch":16,"./instances":18,"./update-geometry":19}],18:[function(t,e,n){"use strict";function r(t){function e(){a.add(t,"ps-focus")}function n(){a.remove(t,"ps-focus")}var r=this;r.settings=s.clone(c),r.containerWidth=null,r.containerHeight=null,r.contentWidth=null,r.contentHeight=null,r.isRtl="rtl"===u.css(t,"direction"),r.isNegativeScroll=function(){var e=t.scrollLeft,n=null;return t.scrollLeft=-1,n=t.scrollLeft<0,t.scrollLeft=e,n}(),r.negativeScrollAdjustment=r.isNegativeScroll?t.scrollWidth-t.clientWidth:0,r.event=new d,r.ownerDocument=t.ownerDocument||document,r.scrollbarXRail=u.appendTo(u.e("div","ps-scrollbar-x-rail"),t),r.scrollbarX=u.appendTo(u.e("div","ps-scrollbar-x"),r.scrollbarXRail),r.scrollbarX.setAttribute("tabindex",0),r.event.bind(r.scrollbarX,"focus",e),r.event.bind(r.scrollbarX,"blur",n),r.scrollbarXActive=null,r.scrollbarXWidth=null,r.scrollbarXLeft=null,r.scrollbarXBottom=s.toInt(u.css(r.scrollbarXRail,"bottom")),r.isScrollbarXUsingBottom=r.scrollbarXBottom===r.scrollbarXBottom,r.scrollbarXTop=r.isScrollbarXUsingBottom?null:s.toInt(u.css(r.scrollbarXRail,"top")),r.railBorderXWidth=s.toInt(u.css(r.scrollbarXRail,"borderLeftWidth"))+s.toInt(u.css(r.scrollbarXRail,"borderRightWidth")),u.css(r.scrollbarXRail,"display","block"),r.railXMarginWidth=s.toInt(u.css(r.scrollbarXRail,"marginLeft"))+s.toInt(u.css(r.scrollbarXRail,"marginRight")),u.css(r.scrollbarXRail,"display",""),r.railXWidth=null,r.railXRatio=null,r.scrollbarYRail=u.appendTo(u.e("div","ps-scrollbar-y-rail"),t),r.scrollbarY=u.appendTo(u.e("div","ps-scrollbar-y"),r.scrollbarYRail),r.scrollbarY.setAttribute("tabindex",0),r.event.bind(r.scrollbarY,"focus",e),r.event.bind(r.scrollbarY,"blur",n),r.scrollbarYActive=null,r.scrollbarYHeight=null,r.scrollbarYTop=null,r.scrollbarYRight=s.toInt(u.css(r.scrollbarYRail,"right")),r.isScrollbarYUsingRight=r.scrollbarYRight===r.scrollbarYRight,r.scrollbarYLeft=r.isScrollbarYUsingRight?null:s.toInt(u.css(r.scrollbarYRail,"left")),r.scrollbarYOuterWidth=r.isRtl?s.outerWidth(r.scrollbarY):null,r.railBorderYWidth=s.toInt(u.css(r.scrollbarYRail,"borderTopWidth"))+s.toInt(u.css(r.scrollbarYRail,"borderBottomWidth")),u.css(r.scrollbarYRail,"display","block"),r.railYMarginHeight=s.toInt(u.css(r.scrollbarYRail,"marginTop"))+s.toInt(u.css(r.scrollbarYRail,"marginBottom")),u.css(r.scrollbarYRail,"display",""),r.railYHeight=null,r.railYRatio=null}function o(t){return t.getAttribute("data-ps-id")}function l(t,e){t.setAttribute("data-ps-id",e)}function i(t){t.removeAttribute("data-ps-id")}var s=t("../lib/helper"),a=t("../lib/class"),c=t("./default-setting"),u=t("../lib/dom"),d=t("../lib/event-manager"),p=t("../lib/guid"),f={};n.add=function(t){var e=p();return l(t,e),f[e]=new r(t),f[e]},n.remove=function(t){delete f[o(t)],i(t)},n.get=function(t){return f[o(t)]}},{"../lib/class":2,"../lib/dom":3,"../lib/event-manager":4,"../lib/guid":5,"../lib/helper":6,"./default-setting":8}],19:[function(t,e,n){"use strict";function r(t,e){return t.settings.minScrollbarLength&&(e=Math.max(e,t.settings.minScrollbarLength)),t.settings.maxScrollbarLength&&(e=Math.min(e,t.settings.maxScrollbarLength)),e}function o(t,e){var n={width:e.railXWidth};e.isRtl?n.left=e.negativeScrollAdjustment+t.scrollLeft+e.containerWidth-e.contentWidth:n.left=t.scrollLeft,e.isScrollbarXUsingBottom?n.bottom=e.scrollbarXBottom-t.scrollTop:n.top=e.scrollbarXTop+t.scrollTop,s.css(e.scrollbarXRail,n);var r={top:t.scrollTop,height:e.railYHeight};e.isScrollbarYUsingRight?e.isRtl?r.right=e.contentWidth-(e.negativeScrollAdjustment+t.scrollLeft)-e.scrollbarYRight-e.scrollbarYOuterWidth:r.right=e.scrollbarYRight-t.scrollLeft:e.isRtl?r.left=e.negativeScrollAdjustment+t.scrollLeft+2*e.containerWidth-e.contentWidth-e.scrollbarYLeft-e.scrollbarYOuterWidth:r.left=e.scrollbarYLeft+t.scrollLeft,s.css(e.scrollbarYRail,r),s.css(e.scrollbarX,{left:e.scrollbarXLeft,width:e.scrollbarXWidth-e.railBorderXWidth}),s.css(e.scrollbarY,{top:e.scrollbarYTop,height:e.scrollbarYHeight-e.railBorderYWidth})}var l=t("../lib/helper"),i=t("../lib/class"),s=t("../lib/dom"),a=t("./instances"),c=t("./update-scroll");e.exports=function(t){var e=a.get(t);e.containerWidth=t.clientWidth,e.containerHeight=t.clientHeight,e.contentWidth=t.scrollWidth,e.contentHeight=t.scrollHeight;var n;t.contains(e.scrollbarXRail)||(n=s.queryChildren(t,".ps-scrollbar-x-rail"),n.length>0&&n.forEach(function(t){s.remove(t)}),s.appendTo(e.scrollbarXRail,t)),t.contains(e.scrollbarYRail)||(n=s.queryChildren(t,".ps-scrollbar-y-rail"),n.length>0&&n.forEach(function(t){s.remove(t)}),s.appendTo(e.scrollbarYRail,t)),!e.settings.suppressScrollX&&e.containerWidth+e.settings.scrollXMarginOffset<e.contentWidth?(e.scrollbarXActive=!0,e.railXWidth=e.containerWidth-e.railXMarginWidth,e.railXRatio=e.containerWidth/e.railXWidth,e.scrollbarXWidth=r(e,l.toInt(e.railXWidth*e.containerWidth/e.contentWidth)),e.scrollbarXLeft=l.toInt((e.negativeScrollAdjustment+t.scrollLeft)*(e.railXWidth-e.scrollbarXWidth)/(e.contentWidth-e.containerWidth))):e.scrollbarXActive=!1,!e.settings.suppressScrollY&&e.containerHeight+e.settings.scrollYMarginOffset<e.contentHeight?(e.scrollbarYActive=!0,e.railYHeight=e.containerHeight-e.railYMarginHeight,e.railYRatio=e.containerHeight/e.railYHeight,e.scrollbarYHeight=r(e,l.toInt(e.railYHeight*e.containerHeight/e.contentHeight)),e.scrollbarYTop=l.toInt(t.scrollTop*(e.railYHeight-e.scrollbarYHeight)/(e.contentHeight-e.containerHeight))):e.scrollbarYActive=!1,e.scrollbarXLeft>=e.railXWidth-e.scrollbarXWidth&&(e.scrollbarXLeft=e.railXWidth-e.scrollbarXWidth),e.scrollbarYTop>=e.railYHeight-e.scrollbarYHeight&&(e.scrollbarYTop=e.railYHeight-e.scrollbarYHeight),o(t,e),e.scrollbarXActive?i.add(t,"ps-active-x"):(i.remove(t,"ps-active-x"),e.scrollbarXWidth=0,e.scrollbarXLeft=0,c(t,"left",0)),e.scrollbarYActive?i.add(t,"ps-active-y"):(i.remove(t,"ps-active-y"),e.scrollbarYHeight=0,e.scrollbarYTop=0,c(t,"top",0))}},{"../lib/class":2,"../lib/dom":3,"../lib/helper":6,"./instances":18,"./update-scroll":20}],20:[function(t,e,n){"use strict";var r,o,l=t("./instances"),i=function(t){var e=document.createEvent("Event");return e.initEvent(t,!0,!0),e};e.exports=function(t,e,n){if("undefined"==typeof t)throw"You must provide an element to the update-scroll function";if("undefined"==typeof e)throw"You must provide an axis to the update-scroll function";if("undefined"==typeof n)throw"You must provide a value to the update-scroll function";"top"===e&&n<=0&&(t.scrollTop=n=0,t.dispatchEvent(i("ps-y-reach-start"))),"left"===e&&n<=0&&(t.scrollLeft=n=0,t.dispatchEvent(i("ps-x-reach-start")));var s=l.get(t);"top"===e&&n>=s.contentHeight-s.containerHeight&&(n=s.contentHeight-s.containerHeight,n-t.scrollTop<=1?n=t.scrollTop:t.scrollTop=n,t.dispatchEvent(i("ps-y-reach-end"))),"left"===e&&n>=s.contentWidth-s.containerWidth&&(n=s.contentWidth-s.containerWidth,n-t.scrollLeft<=1?n=t.scrollLeft:t.scrollLeft=n,t.dispatchEvent(i("ps-x-reach-end"))),r||(r=t.scrollTop),o||(o=t.scrollLeft),"top"===e&&n<r&&t.dispatchEvent(i("ps-scroll-up")),"top"===e&&n>r&&t.dispatchEvent(i("ps-scroll-down")),"left"===e&&n<o&&t.dispatchEvent(i("ps-scroll-left")),"left"===e&&n>o&&t.dispatchEvent(i("ps-scroll-right")),"top"===e&&(t.scrollTop=r=n,t.dispatchEvent(i("ps-scroll-y"))),"left"===e&&(t.scrollLeft=o=n,t.dispatchEvent(i("ps-scroll-x")))}},{"./instances":18}],21:[function(t,e,n){"use strict";var r=t("../lib/helper"),o=t("../lib/dom"),l=t("./instances"),i=t("./update-geometry"),s=t("./update-scroll");e.exports=function(t){var e=l.get(t);e&&(e.negativeScrollAdjustment=e.isNegativeScroll?t.scrollWidth-t.clientWidth:0,o.css(e.scrollbarXRail,"display","block"),o.css(e.scrollbarYRail,"display","block"),e.railXMarginWidth=r.toInt(o.css(e.scrollbarXRail,"marginLeft"))+r.toInt(o.css(e.scrollbarXRail,"marginRight")),e.railYMarginHeight=r.toInt(o.css(e.scrollbarYRail,"marginTop"))+r.toInt(o.css(e.scrollbarYRail,"marginBottom")),o.css(e.scrollbarXRail,"display","none"),o.css(e.scrollbarYRail,"display","none"),i(t),s(t,"top",t.scrollTop),s(t,"left",t.scrollLeft),o.css(e.scrollbarXRail,"display",""),o.css(e.scrollbarYRail,"display",""))}},{"../lib/dom":3,"../lib/helper":6,"./instances":18,"./update-geometry":19,"./update-scroll":20}]},{},[1]);
\ No newline at end of file
and that you have chown it to be owned by netdata:netdata
-->
<!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
-<script type="text/javascript" src="dashboard.js?v20161218-1"></script>
+<script type="text/javascript" src="dashboard.js?v20161229-1"></script>
<script>
// Set options for TV operation
and that you have chown it to be owned by netdata:netdata
-->
<!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
-<script type="text/javascript" src="dashboard.js?v20161218-1"></script>
+<script type="text/javascript" src="dashboard.js?v20161229-1"></script>
<script>
// Set options for TV operation
projects / netdata.git / commitdiff