You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flink.apache.org by gr...@apache.org on 2017/05/10 17:10:35 UTC

[9/9] flink git commit: [FLINK-5831] [webui] order, search and filter metrics

[FLINK-5831] [webui] order, search and filter metrics

This closes #3369


Project: http://git-wip-us.apache.org/repos/asf/flink/repo
Commit: http://git-wip-us.apache.org/repos/asf/flink/commit/140c4eea
Tree: http://git-wip-us.apache.org/repos/asf/flink/tree/140c4eea
Diff: http://git-wip-us.apache.org/repos/asf/flink/diff/140c4eea

Branch: refs/heads/release-1.3
Commit: 140c4eea17fa40c496179318f378960342362da7
Parents: 4882f36
Author: paul <ne...@gmail.com>
Authored: Mon Feb 20 10:28:14 2017 +0100
Committer: Greg Hogan <co...@greghogan.com>
Committed: Wed May 10 12:43:33 2017 -0400

----------------------------------------------------------------------
 .../partials/jobs/job.plan.node-list.metrics.jade |  7 ++++++-
 .../app/scripts/common/filters.coffee             |  6 ++++++
 .../app/scripts/modules/jobs/jobs.ctrl.coffee     | 12 +++++++++++-
 .../web-dashboard/app/styles/metric.styl          | 18 ++++++++++++++++--
 flink-runtime-web/web-dashboard/web/css/index.css |  2 +-
 .../web-dashboard/web/js/hs/index.js              |  4 ++--
 flink-runtime-web/web-dashboard/web/js/index.js   |  4 ++--
 .../partials/jobs/job.plan.node-list.metrics.html |  6 +++++-
 8 files changed, 49 insertions(+), 10 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flink/blob/140c4eea/flink-runtime-web/web-dashboard/app/partials/jobs/job.plan.node-list.metrics.jade
----------------------------------------------------------------------
diff --git a/flink-runtime-web/web-dashboard/app/partials/jobs/job.plan.node-list.metrics.jade b/flink-runtime-web/web-dashboard/app/partials/jobs/job.plan.node-list.metrics.jade
index f3ec8dc..a1d22e3 100644
--- a/flink-runtime-web/web-dashboard/app/partials/jobs/job.plan.node-list.metrics.jade
+++ b/flink-runtime-web/web-dashboard/app/partials/jobs/job.plan.node-list.metrics.jade
@@ -28,7 +28,12 @@ nav.navbar.navbar-default.navbar-secondary-additional.navbar-secondary-additiona
       | &nbsp;
       span.caret
     ul.dropdown-menu.dropdown-menu-right.metric-menu
-      li(ng-repeat="metric in availableMetrics track by $index")
+      section(class="search")
+        label(for="search-input")
+          i(class="fa fa-search" aria-hidden="true")
+            span(class="sr-only") Search icons
+        input(type="text" ng-model="metricsFilterQuery" class="metrics-filter" placeholder="Search available metrics...")
+      li(ng-repeat="metric in availableMetrics | searchMetrics:metricsFilterQuery track by $index")
         a(ng-click="addMetric(metric)") {{ metric.id | limit }}
 
   .dropdown.add-metrics(ng-if="!availableMetrics.length")

http://git-wip-us.apache.org/repos/asf/flink/blob/140c4eea/flink-runtime-web/web-dashboard/app/scripts/common/filters.coffee
----------------------------------------------------------------------
diff --git a/flink-runtime-web/web-dashboard/app/scripts/common/filters.coffee b/flink-runtime-web/web-dashboard/app/scripts/common/filters.coffee
index e2b8339..211139f 100644
--- a/flink-runtime-web/web-dashboard/app/scripts/common/filters.coffee
+++ b/flink-runtime-web/web-dashboard/app/scripts/common/filters.coffee
@@ -132,3 +132,9 @@ angular.module('flinkApp')
         return_val = value
     return return_val
 ]
+
+.filter "searchMetrics", ->
+  (availableMetrics, query)->
+    queryRegex = new RegExp(query, "gi")
+    return (metric for metric in availableMetrics when metric.id.match(queryRegex))
+

http://git-wip-us.apache.org/repos/asf/flink/blob/140c4eea/flink-runtime-web/web-dashboard/app/scripts/modules/jobs/jobs.ctrl.coffee
----------------------------------------------------------------------
diff --git a/flink-runtime-web/web-dashboard/app/scripts/modules/jobs/jobs.ctrl.coffee b/flink-runtime-web/web-dashboard/app/scripts/modules/jobs/jobs.ctrl.coffee
index d4315ea..ebe8e98 100644
--- a/flink-runtime-web/web-dashboard/app/scripts/modules/jobs/jobs.ctrl.coffee
+++ b/flink-runtime-web/web-dashboard/app/scripts/modules/jobs/jobs.ctrl.coffee
@@ -353,13 +353,23 @@ angular.module('flinkApp')
       $scope.vertex = data
 
     MetricsService.getAvailableMetrics($scope.jobid, $scope.nodeid).then (data) ->
-      $scope.availableMetrics = data
+      $scope.availableMetrics = data.sort(alphabeticalSortById)
       $scope.metrics = MetricsService.getMetricsSetup($scope.jobid, $scope.nodeid).names
 
       MetricsService.registerObserver($scope.jobid, $scope.nodeid, (data) ->
         $scope.$broadcast "metrics:data:update", data.timestamp, data.values
       )
 
+  alphabeticalSortById = (a, b) ->
+    A = a.id.toLowerCase()
+    B = b.id.toLowerCase()
+    if A < B
+      return -1
+    else if A > B
+      return 1
+    else
+      return 0
+
   $scope.dropped = (event, index, item, external, type) ->
 
     MetricsService.orderMetrics($scope.jobid, $scope.nodeid, item, index)

http://git-wip-us.apache.org/repos/asf/flink/blob/140c4eea/flink-runtime-web/web-dashboard/app/styles/metric.styl
----------------------------------------------------------------------
diff --git a/flink-runtime-web/web-dashboard/app/styles/metric.styl b/flink-runtime-web/web-dashboard/app/styles/metric.styl
index 94c4948..ec0afaf 100644
--- a/flink-runtime-web/web-dashboard/app/styles/metric.styl
+++ b/flink-runtime-web/web-dashboard/app/styles/metric.styl
@@ -38,9 +38,23 @@
 
       .metric-menu
         max-height: 300px
-        max-width: 900px
+        width: 300px
         overflow-y: scroll
-        text-align: right
+        text-align: left
+
+  .search
+    label
+      position: absolute;
+      top: 15px
+      left: 22px
+    input.metrics-filter
+      height: 30px
+      padding: 5px 5px 5px 25px
+      margin: 5px 5px 5px 15px
+      width: 90%
+      border-radius: 5px
+      border: 1px solid #999
+      box-shadow: none
 
 $metric-row-height = 180px + 85px
 

http://git-wip-us.apache.org/repos/asf/flink/blob/140c4eea/flink-runtime-web/web-dashboard/web/css/index.css
----------------------------------------------------------------------
diff --git a/flink-runtime-web/web-dashboard/web/css/index.css b/flink-runtime-web/web-dashboard/web/css/index.css
index db615b1..6429736 100644
--- a/flink-runtime-web/web-dashboard/web/css/index.css
+++ b/flink-runtime-web/web-dashboard/web/css/index.css
@@ -1 +1 @@
-#main,#sidebar,body,html{height:100%}#content,#sidebar{-webkit-transition:.4s;-moz-transition:.4s;-o-transition:.4s;-ms-transition:.4s}.gutter{background-color:transparent;background-repeat:no-repeat;background-position:50%}.gutter-vertical{cursor:row-resize;background-image:url(../images/grips/horizontal.png)}#sidebar{overflow:hidden;position:fixed;left:-250px;top:0;bottom:0;width:250px;background:#151515;transition:.4s;-webkit-box-shadow:inset -10px 0 10px rgba(0,0,0,.2);box-shadow:inset -10px 0 10px rgba(0,0,0,.2)}#sidebar.sidebar-visible{left:0}#sidebar .logo{width:auto;height:22px}#sidebar .logo img{display:inline-block}#sidebar .navbar-static-top{overflow:hidden;height:51px}#sidebar .navbar-static-top .navbar-header{width:100%}#sidebar .navbar-brand.navbar-brand-text{font-size:14px;font-weight:700;color:#fff;padding-left:0}#sidebar .nav>li>a{color:#aaa;margin-bottom:1px}#sidebar .nav>li>a:focus,#sidebar .nav>li>a:hover{background-color:rgba(40,40,40,.5)}#sidebar .nav>li>a.acti
 ve{background-color:rgba(100,100,100,.5)}#content{background-color:#fff;margin-left:0;padding-top:70px;height:100%;transition:.4s}.table .table,.table.table-inner{background-color:transparent}#content .navbar-main,#content .navbar-main-additional{-webkit-transition:.4s;-moz-transition:.4s;-o-transition:.4s;-ms-transition:.4s;transition:.4s}#content .navbar-main-additional{margin-top:51px;border-bottom:none;padding:0 20px}#content .navbar-main-additional .nav-tabs{margin:0 -20px;padding:0 20px}#content .navbar-secondary-additional{border:none;padding:0 20px;margin-bottom:0}#content .navbar-secondary-additional .nav-tabs{margin:0 -20px}#content.sidebar-visible{margin-left:250px}#content.sidebar-visible .navbar-main,#content.sidebar-visible .navbar-main-additional{left:250px}#content #fold-button{display:inline-block;margin-left:20px}#content #content-inner{padding:0 20px 20px}#content #content-inner.has-navbar-main-additional{padding-top:42px}.table#add-file-table span.btn,.table#job-
 submit-table td>span.btn{padding:2px 4px;font-size:14px}.page-header{margin:0 0 20px}.nav>li>a,.nav>li>a:focus,.nav>li>a:hover{color:#aaa;background-color:transparent;border-bottom:2px solid transparent}.nav>li.active>a,.nav>li.active>a:focus,.nav>li.active>a:hover{color:#000;border-bottom:2px solid #000}.nav.nav-tabs{margin-bottom:20px}.table th{font-weight:400;color:#999}.table td.td-long{width:20%;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word}.table.table-clickable tr{cursor:pointer}.table.table-properties{table-layout:fixed;white-space:nowrap}.table.table-properties td{width:50%;white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis}.table.table-body-hover>tbody{border-top:none;border-left:2px solid transparent}.table.table-body-hover>tbody.active{border-left:2px solid #000}.table.table-body-hover>tbody.active td.tab-column li.active,.table.table-body-hover>tbody.active td:not(.tab-c
 olumn),.table.table-body-hover>tbody:hover td.tab-column li.active,.table.table-body-hover>tbody:hover td:not(.tab-column){background-color:#f0f0f0}.table.table-activable td.tab-column,.table.table-activable th.tab-column{border-top:none;width:47px}.table.table-activable td.tab-column{border-right:1px solid #ddd}.table.table-activable td{position:relative}.table.table-no-border td,.table.table-no-border th{border-top:none!important}.table#job-submit-table{table-layout:fixed;white-space:nowrap}.table#job-submit-table td.td-large{width:40%}.table#job-submit-table td{width:15%}.table#job-submit-table td>input{height:28px;font-size:14px}.table#add-file-table{table-layout:fixed}.table#add-file-table span.btn{position:relative;overflow:hidden;border-radius:2px;margin-top:-3px}.table#add-file-table td#add-file-button{width:100px}.table#add-file-table td#add-file-button input[type=file]{position:absolute;top:0;right:0;min-width:100%;min-height:100%;opacity:0;-ms-filter:"progid:DXImageTransf
 orm.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);outline:0;cursor:inherit;display:block}.timeline-canvas .timeline-insidelabel,.timeline-canvas .timeline-series,svg.graph .node{cursor:pointer}.table#add-file-table td#add-file-name{width:250px;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.table#add-file-table td#add-file-status{width:100%}.table#add-file-table td#add-file-status span.btn-progress-bar{padding:0!important;width:100%;background-color:#f5f5f5;text-align:left}.table#add-file-table td#add-file-status span.btn-progress{padding:2px;font-size:10px}.table span.error-area{color:red}.table span.row-button{padding:1px 2px;margin:0;border:none!important}.table .small-label{text-transform:uppercase;font-size:13px;color:#999}span.icon-wrapper{width:1.2em;display:inline-block}.panel.panel-dashboard .huge{font-size:28px}.panel.panel-lg{font-size:16px}.panel.panel-lg .badge{font-size:14px}.navbar-secondary{overflow:auto}.navbar-main .navbar
 -title,.navbar-main .navbar-title-job,.navbar-main .panel-title,.navbar-main-additional .navbar-title,.navbar-main-additional .navbar-title-job,.navbar-main-additional .panel-title,.navbar-secondary .navbar-title,.navbar-secondary .navbar-title-job,.navbar-secondary .panel-title,.navbar-secondary-additional .navbar-title,.navbar-secondary-additional .navbar-title-job,.navbar-secondary-additional .panel-title,.panel.panel-multi .navbar-title,.panel.panel-multi .navbar-title-job,.panel.panel-multi .panel-title{float:left;font-size:18px;padding:12px 20px 13px 10px;color:#333;display:inline-block}.navbar-main .navbar-info,.navbar-main .panel-info,.navbar-main-additional .navbar-info,.navbar-main-additional .panel-info,.navbar-secondary .navbar-info,.navbar-secondary .panel-info,.navbar-secondary-additional .navbar-info,.navbar-secondary-additional .panel-info,.panel.panel-multi .navbar-info,.panel.panel-multi .panel-info{float:left;font-size:14px;padding:15px;color:#999;display:inline-b
 lock;border-right:1px solid #e7e7e7;overflow:hidden}.navbar-main .navbar-info .overflow,.navbar-main .panel-info .overflow,.navbar-main-additional .navbar-info .overflow,.navbar-main-additional .panel-info .overflow,.navbar-secondary .navbar-info .overflow,.navbar-secondary .panel-info .overflow,.navbar-secondary-additional .navbar-info .overflow,.navbar-secondary-additional .panel-info .overflow,.panel.panel-multi .navbar-info .overflow,.panel.panel-multi .panel-info .overflow{position:absolute;display:block;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;height:22px;line-height:22px;vertical-align:middle}.navbar-main .navbar-info.first,.navbar-main .panel-info.first,.navbar-main-additional .navbar-info.first,.navbar-main-additional .panel-info.first,.navbar-secondary .navbar-info.first,.navbar-secondary .panel-info.first,.navbar-secondary-additional .navbar-info.first,.navbar-secondary-additional .panel-info.first,.panel.panel-multi .navbar-info.first,.panel.panel
 -multi .panel-info.first{border-left:1px solid #e7e7e7}.navbar-main .navbar-info.last,.navbar-main .panel-info.last,.navbar-main-additional .navbar-info.last,.navbar-main-additional .panel-info.last,.navbar-secondary .navbar-info.last,.navbar-secondary .panel-info.last,.navbar-secondary-additional .navbar-info.last,.navbar-secondary-additional .panel-info.last,.panel.panel-multi .navbar-info.last,.panel.panel-multi .panel-info.last{border-right:none}.panel.panel-multi .panel-heading{padding:0}.panel.panel-multi .panel-heading .panel-info.thin{padding:8px 10px}.panel.panel-multi .panel-body{padding:10px;background-color:#fdfdfd;color:#999;font-size:13px}.panel.panel-multi .panel-body.clean{color:inherit;font-size:inherit}.navbar-main-additional,.navbar-secondary-additional{min-height:40px;background-color:#fdfdfd}.navbar-main-additional .navbar-info,.navbar-secondary-additional .navbar-info{font-size:13px;padding:10px 15px}.nav-top-affix.affix{width:100%;top:50px;margin-left:-20px;pa
 dding-left:20px;margin-right:-20px;padding-right:20px;background-color:#fff;z-index:1}.badge-default[href]:focus,.badge-default[href]:hover{background-color:grey}.badge-primary{background-color:#428bca}.badge-primary[href]:focus,.badge-primary[href]:hover{background-color:#3071a9}.badge-success{background-color:#5cb85c}.badge-success[href]:focus,.badge-success[href]:hover{background-color:#449d44}.badge-info{background-color:#5bc0de}.badge-info[href]:focus,.badge-info[href]:hover{background-color:#31b0d5}.badge-warning{background-color:#f0ad4e}.badge-warning[href]:focus,.badge-warning[href]:hover{background-color:#ec971f}.badge-danger{background-color:#d9534f}.badge-danger[href]:focus,.badge-danger[href]:hover{background-color:#c9302c}.indicator{display:inline-block;margin-right:15px}.indicator.indicator-primary{color:#428bca}.indicator.indicator-success{color:#5cb85c}.indicator.indicator-info{color:#5bc0de}.indicator.indicator-warning{color:#f0ad4e}.indicator.indicator-danger{color
 :#d9534f}pre.exception{border:none;background-color:transparent;padding:0;margin:0}pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word}.nav-tabs.tabs-vertical{position:absolute;left:0;top:0;border-bottom:none;z-index:100}.nav-tabs.tabs-vertical li{float:none;margin-bottom:0;margin-right:-1px}.nav-tabs.tabs-vertical li>a{margin-right:0;border-radius:0;border-bottom:none;border-left:2px solid transparent}.nav-tabs.tabs-vertical li.active>a,.nav-tabs.tabs-vertical li>a:focus,.nav-tabs.tabs-vertical li>a:hover{border-bottom:none;border-left:2px solid #000}.navbar-main .navbar-title,.navbar-main-additional .navbar-title,.navbar-secondary .navbar-title,.navbar-secondary-additional .navbar-title{padding:12px 20px 13px}.navbar-main .navbar-title-job{padding:8px 20px}.navbar-main .navbar-title-job .indicator-primary{padding:8px 0 0}.navbar-main .navbar-title-job .no-padding{padding:0}.navbar-main .navbar-title-job .no-margin{m
 argin:0}.navbar-main .navbar-title-job .job-name{font-size:14px}.navbar-main .navbar-title-job .job-id{color:#999;font-size:11px}.checkpoint-overview a,svg.graph .node h4{color:#000}livechart{width:30%;height:30%;text-align:center}.canvas-wrapper{border:1px solid #ddd;position:relative;margin-bottom:20px;height:100%}.canvas-wrapper .main-canvas{height:100%;overflow:hidden}.canvas-wrapper .main-canvas .zoom-buttons{position:absolute;top:10px;right:10px}.label-group .label{display:inline-block;padding-left:.4em;padding-right:.4em;margin:0;border-right:1px solid #fff;border-radius:0}.label-group .label.label-black{background-color:#000}.navbar-info-button{padding:3px 4px;font-size:12px;font-family:inherit;margin-top:-2px}svg.graph .edge-label,svg.graph text{font-size:14px}.checkpoints-view{padding-top:1em}.subtask-details .blank{height:2em}.checkpoint-overview td span{padding-left:2em}svg.graph{overflow:hidden;height:100%;width:100%!important}svg.graph g.type-TK>rect{fill:#00ffd0}svg.g
 raph text{font-weight:300}svg.graph .node>rect{stroke:#999;stroke-width:5px;fill:#fff;margin:0;padding:0}svg.graph .node[active]>rect{fill:#eee}svg.graph .node.node-mirror>rect{stroke:#a8a8a8}svg.graph .node.node-iteration>rect{stroke:#cd3333}svg.graph .node.node-source>rect{stroke:#4ce199}svg.graph .node.node-sink>rect{stroke:#e6ec8b}svg.graph .node.node-normal>rect{stroke:#3fb6d8}svg.graph .node h5{color:#999}svg.graph .edgeLabel rect{fill:#fff}svg.graph .edgePath path{stroke:#333;stroke-width:2px;fill:#333}svg.graph .label{color:#777;margin:0}svg.graph .node-label{display:block;margin:0;text-decoration:none}.timeline{overflow:hidden}.timeline-canvas{overflow:hidden;padding:10px}.timeline-canvas .bar-container{overflow:hidden}.timeline-canvas.secondary .timeline-insidelabel,.timeline-canvas.secondary .timeline-series{cursor:auto}#content .navbar-secondary-additional.navbar-secondary-additional-2 .add-metrics a,.show-pointer{cursor:pointer}.qtip-timeline-bar{font-size:14px;line-hei
 ght:1.4}#content .navbar-secondary-additional.navbar-secondary-additional-2{margin:-10px -10px 10px;padding:0;border-bottom:1px solid #e4e4e4}#content .navbar-secondary-additional.navbar-secondary-additional-2 .navbar-info{padding-top:12px;padding-bottom:12px}#content .navbar-secondary-additional.navbar-secondary-additional-2 .add-metrics{margin-right:15px;float:right}#content .navbar-secondary-additional.navbar-secondary-additional-2 .add-metrics .btn{margin-top:5px;margin-bottom:5px}#content .navbar-secondary-additional.navbar-secondary-additional-2 .metric-menu{max-height:300px;max-width:900px;overflow-y:scroll;text-align:right}.metric-row{margin:0;min-height:275px;padding:0;list-style-type:none}.metric-row .metric-col{background-color:transparent;width:33.33%;float:left}.metric-row .metric-col.big{width:100%}.metric-row .metric-col .panel{margin-left:5px;margin-right:5px;min-height:265px;margin-bottom:10px}.metric-row .metric-col .panel .panel-body{background-color:transparent;h
 eight:265px;position:relative}.metric-row .metric-col .panel .panel-body .metric-numeric{text-align:center;margin-top:75px;font-size:40px;font-weight:700}.metric-row .metric-col .panel .panel-heading{padding:0 10px;background-color:transparent;height:41px;line-height:41px;position:relative;overflow:hidden;cursor:pointer}.metric-row .metric-col .panel .panel-heading .metric-title{padding:10px 0}.metric-row .metric-col .panel .panel-heading .buttons{position:absolute;top:0;right:0;padding:0 10px;background-color:#fff}.metric-row .metric-col.dndDraggingSource{display:none}.metric-row .dndPlaceholder{position:relative;background-color:#f0f0f0;min-height:305px;display:block;width:33.33%;float:left;margin-bottom:10px;border-radius:5px}.p-info{padding-left:5px;padding-right:5px}@media (min-width:1024px) and (max-width:1279px){#content #fold-button,#sidebar .navbar-static-top .navbar-brand-text{display:none}#sidebar{left:0;width:160px}#content{margin-left:160px}#content .navbar-main,#conten
 t .navbar-main-additional{left:160px}.table td.td-long{width:20%}}@media (min-width:1280px){#sidebar{left:0}#content{margin-left:250px}#content #fold-button{display:none}#content .navbar-main,#content .navbar-main-additional{left:250px}.table td.td-long{width:30%}}.legend-box{font-size:10px;width:2em}#total-mem{background-color:#7cb5ec}#heap-mem{background-color:#434348}#non-heap-mem{background-color:#90ed7d}#fetch-plan,#job-submit{width:100px}#content-inner,#details,#node-details{height:100%}#job-panel{overflow-y:auto}
\ No newline at end of file
+#main,#sidebar,body,html{height:100%}#content,#sidebar{-webkit-transition:.4s;-moz-transition:.4s;-o-transition:.4s;-ms-transition:.4s}.gutter{background-color:transparent;background-repeat:no-repeat;background-position:50%}.gutter-vertical{cursor:row-resize;background-image:url(../images/grips/horizontal.png)}#sidebar{overflow:hidden;position:fixed;left:-250px;top:0;bottom:0;width:250px;background:#151515;transition:.4s;-webkit-box-shadow:inset -10px 0 10px rgba(0,0,0,.2);box-shadow:inset -10px 0 10px rgba(0,0,0,.2)}#sidebar.sidebar-visible{left:0}#sidebar .logo{width:auto;height:22px}#sidebar .logo img{display:inline-block}#sidebar .navbar-static-top{overflow:hidden;height:51px}#sidebar .navbar-static-top .navbar-header{width:100%}#sidebar .navbar-brand.navbar-brand-text{font-size:14px;font-weight:700;color:#fff;padding-left:0}#sidebar .nav>li>a{color:#aaa;margin-bottom:1px}#sidebar .nav>li>a:focus,#sidebar .nav>li>a:hover{background-color:rgba(40,40,40,.5)}#sidebar .nav>li>a.acti
 ve{background-color:rgba(100,100,100,.5)}#content{background-color:#fff;margin-left:0;padding-top:70px;height:100%;transition:.4s}.table .table,.table.table-inner{background-color:transparent}#content .navbar-main,#content .navbar-main-additional{-webkit-transition:.4s;-moz-transition:.4s;-o-transition:.4s;-ms-transition:.4s;transition:.4s}#content .navbar-main-additional{margin-top:51px;border-bottom:none;padding:0 20px}#content .navbar-main-additional .nav-tabs{margin:0 -20px;padding:0 20px}#content .navbar-secondary-additional{border:none;padding:0 20px;margin-bottom:0}#content .navbar-secondary-additional .nav-tabs{margin:0 -20px}#content.sidebar-visible{margin-left:250px}#content.sidebar-visible .navbar-main,#content.sidebar-visible .navbar-main-additional{left:250px}#content #fold-button{display:inline-block;margin-left:20px}#content #content-inner{padding:0 20px 20px}#content #content-inner.has-navbar-main-additional{padding-top:42px}.table#add-file-table span.btn,.table#job-
 submit-table td>span.btn{padding:2px 4px;font-size:14px}.page-header{margin:0 0 20px}.nav>li>a,.nav>li>a:focus,.nav>li>a:hover{color:#aaa;background-color:transparent;border-bottom:2px solid transparent}.nav>li.active>a,.nav>li.active>a:focus,.nav>li.active>a:hover{color:#000;border-bottom:2px solid #000}.nav.nav-tabs{margin-bottom:20px}.table th{font-weight:400;color:#999}.table td.td-long{width:20%;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word}.table.table-clickable tr{cursor:pointer}.table.table-properties{table-layout:fixed;white-space:nowrap}.table.table-properties td{width:50%;white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis}.table.table-body-hover>tbody{border-top:none;border-left:2px solid transparent}.table.table-body-hover>tbody.active{border-left:2px solid #000}.table.table-body-hover>tbody.active td.tab-column li.active,.table.table-body-hover>tbody.active td:not(.tab-c
 olumn),.table.table-body-hover>tbody:hover td.tab-column li.active,.table.table-body-hover>tbody:hover td:not(.tab-column){background-color:#f0f0f0}.table.table-activable td.tab-column,.table.table-activable th.tab-column{border-top:none;width:47px}.table.table-activable td.tab-column{border-right:1px solid #ddd}.table.table-activable td{position:relative}.table.table-no-border td,.table.table-no-border th{border-top:none!important}.table#job-submit-table{table-layout:fixed;white-space:nowrap}.table#job-submit-table td.td-large{width:40%}.table#job-submit-table td{width:15%}.table#job-submit-table td>input{height:28px;font-size:14px}.table#add-file-table{table-layout:fixed}.table#add-file-table span.btn{position:relative;overflow:hidden;border-radius:2px;margin-top:-3px}.table#add-file-table td#add-file-button{width:100px}.table#add-file-table td#add-file-button input[type=file]{position:absolute;top:0;right:0;min-width:100%;min-height:100%;opacity:0;-ms-filter:"progid:DXImageTransf
 orm.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);outline:0;cursor:inherit;display:block}.timeline-canvas .timeline-insidelabel,.timeline-canvas .timeline-series,svg.graph .node{cursor:pointer}.table#add-file-table td#add-file-name{width:250px;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.table#add-file-table td#add-file-status{width:100%}.table#add-file-table td#add-file-status span.btn-progress-bar{padding:0!important;width:100%;background-color:#f5f5f5;text-align:left}.table#add-file-table td#add-file-status span.btn-progress{padding:2px;font-size:10px}.table span.error-area{color:red}.table span.row-button{padding:1px 2px;margin:0;border:none!important}.table .small-label{text-transform:uppercase;font-size:13px;color:#999}span.icon-wrapper{width:1.2em;display:inline-block}.panel.panel-dashboard .huge{font-size:28px}.panel.panel-lg{font-size:16px}.panel.panel-lg .badge{font-size:14px}.navbar-secondary{overflow:auto}.navbar-main .navbar
 -title,.navbar-main .navbar-title-job,.navbar-main .panel-title,.navbar-main-additional .navbar-title,.navbar-main-additional .navbar-title-job,.navbar-main-additional .panel-title,.navbar-secondary .navbar-title,.navbar-secondary .navbar-title-job,.navbar-secondary .panel-title,.navbar-secondary-additional .navbar-title,.navbar-secondary-additional .navbar-title-job,.navbar-secondary-additional .panel-title,.panel.panel-multi .navbar-title,.panel.panel-multi .navbar-title-job,.panel.panel-multi .panel-title{float:left;font-size:18px;padding:12px 20px 13px 10px;color:#333;display:inline-block}.navbar-main .navbar-info,.navbar-main .panel-info,.navbar-main-additional .navbar-info,.navbar-main-additional .panel-info,.navbar-secondary .navbar-info,.navbar-secondary .panel-info,.navbar-secondary-additional .navbar-info,.navbar-secondary-additional .panel-info,.panel.panel-multi .navbar-info,.panel.panel-multi .panel-info{float:left;font-size:14px;padding:15px;color:#999;display:inline-b
 lock;border-right:1px solid #e7e7e7;overflow:hidden}.navbar-main .navbar-info .overflow,.navbar-main .panel-info .overflow,.navbar-main-additional .navbar-info .overflow,.navbar-main-additional .panel-info .overflow,.navbar-secondary .navbar-info .overflow,.navbar-secondary .panel-info .overflow,.navbar-secondary-additional .navbar-info .overflow,.navbar-secondary-additional .panel-info .overflow,.panel.panel-multi .navbar-info .overflow,.panel.panel-multi .panel-info .overflow{position:absolute;display:block;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;height:22px;line-height:22px;vertical-align:middle}.navbar-main .navbar-info.first,.navbar-main .panel-info.first,.navbar-main-additional .navbar-info.first,.navbar-main-additional .panel-info.first,.navbar-secondary .navbar-info.first,.navbar-secondary .panel-info.first,.navbar-secondary-additional .navbar-info.first,.navbar-secondary-additional .panel-info.first,.panel.panel-multi .navbar-info.first,.panel.panel
 -multi .panel-info.first{border-left:1px solid #e7e7e7}.navbar-main .navbar-info.last,.navbar-main .panel-info.last,.navbar-main-additional .navbar-info.last,.navbar-main-additional .panel-info.last,.navbar-secondary .navbar-info.last,.navbar-secondary .panel-info.last,.navbar-secondary-additional .navbar-info.last,.navbar-secondary-additional .panel-info.last,.panel.panel-multi .navbar-info.last,.panel.panel-multi .panel-info.last{border-right:none}.panel.panel-multi .panel-heading{padding:0}.panel.panel-multi .panel-heading .panel-info.thin{padding:8px 10px}.panel.panel-multi .panel-body{padding:10px;background-color:#fdfdfd;color:#999;font-size:13px}.panel.panel-multi .panel-body.clean{color:inherit;font-size:inherit}.navbar-main-additional,.navbar-secondary-additional{min-height:40px;background-color:#fdfdfd}.navbar-main-additional .navbar-info,.navbar-secondary-additional .navbar-info{font-size:13px;padding:10px 15px}.nav-top-affix.affix{width:100%;top:50px;margin-left:-20px;pa
 dding-left:20px;margin-right:-20px;padding-right:20px;background-color:#fff;z-index:1}.badge-default[href]:focus,.badge-default[href]:hover{background-color:grey}.badge-primary{background-color:#428bca}.badge-primary[href]:focus,.badge-primary[href]:hover{background-color:#3071a9}.badge-success{background-color:#5cb85c}.badge-success[href]:focus,.badge-success[href]:hover{background-color:#449d44}.badge-info{background-color:#5bc0de}.badge-info[href]:focus,.badge-info[href]:hover{background-color:#31b0d5}.badge-warning{background-color:#f0ad4e}.badge-warning[href]:focus,.badge-warning[href]:hover{background-color:#ec971f}.badge-danger{background-color:#d9534f}.badge-danger[href]:focus,.badge-danger[href]:hover{background-color:#c9302c}.indicator{display:inline-block;margin-right:15px}.indicator.indicator-primary{color:#428bca}.indicator.indicator-success{color:#5cb85c}.indicator.indicator-info{color:#5bc0de}.indicator.indicator-warning{color:#f0ad4e}.indicator.indicator-danger{color
 :#d9534f}pre.exception{border:none;background-color:transparent;padding:0;margin:0}pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word}.nav-tabs.tabs-vertical{position:absolute;left:0;top:0;border-bottom:none;z-index:100}.nav-tabs.tabs-vertical li{float:none;margin-bottom:0;margin-right:-1px}.nav-tabs.tabs-vertical li>a{margin-right:0;border-radius:0;border-bottom:none;border-left:2px solid transparent}.nav-tabs.tabs-vertical li.active>a,.nav-tabs.tabs-vertical li>a:focus,.nav-tabs.tabs-vertical li>a:hover{border-bottom:none;border-left:2px solid #000}.navbar-main .navbar-title,.navbar-main-additional .navbar-title,.navbar-secondary .navbar-title,.navbar-secondary-additional .navbar-title{padding:12px 20px 13px}.navbar-main .navbar-title-job{padding:8px 20px}.navbar-main .navbar-title-job .indicator-primary{padding:8px 0 0}.navbar-main .navbar-title-job .no-padding{padding:0}.navbar-main .navbar-title-job .no-margin{m
 argin:0}.navbar-main .navbar-title-job .job-name{font-size:14px}.navbar-main .navbar-title-job .job-id{color:#999;font-size:11px}.checkpoint-overview a,svg.graph .node h4{color:#000}livechart{width:30%;height:30%;text-align:center}.canvas-wrapper{border:1px solid #ddd;position:relative;margin-bottom:20px;height:100%}.canvas-wrapper .main-canvas{height:100%;overflow:hidden}.canvas-wrapper .main-canvas .zoom-buttons{position:absolute;top:10px;right:10px}.label-group .label{display:inline-block;padding-left:.4em;padding-right:.4em;margin:0;border-right:1px solid #fff;border-radius:0}.label-group .label.label-black{background-color:#000}.navbar-info-button{padding:3px 4px;font-size:12px;font-family:inherit;margin-top:-2px}svg.graph .edge-label,svg.graph text{font-size:14px}.checkpoints-view{padding-top:1em}.subtask-details .blank{height:2em}.checkpoint-overview td span{padding-left:2em}svg.graph{overflow:hidden;height:100%;width:100%!important}svg.graph g.type-TK>rect{fill:#00ffd0}svg.g
 raph text{font-weight:300}svg.graph .node>rect{stroke:#999;stroke-width:5px;fill:#fff;margin:0;padding:0}svg.graph .node[active]>rect{fill:#eee}svg.graph .node.node-mirror>rect{stroke:#a8a8a8}svg.graph .node.node-iteration>rect{stroke:#cd3333}svg.graph .node.node-source>rect{stroke:#4ce199}svg.graph .node.node-sink>rect{stroke:#e6ec8b}svg.graph .node.node-normal>rect{stroke:#3fb6d8}svg.graph .node h5{color:#999}svg.graph .edgeLabel rect{fill:#fff}svg.graph .edgePath path{stroke:#333;stroke-width:2px;fill:#333}svg.graph .label{color:#777;margin:0}svg.graph .node-label{display:block;margin:0;text-decoration:none}.timeline{overflow:hidden}.timeline-canvas{overflow:hidden;padding:10px}.timeline-canvas .bar-container{overflow:hidden}.timeline-canvas.secondary .timeline-insidelabel,.timeline-canvas.secondary .timeline-series{cursor:auto}#content .navbar-secondary-additional.navbar-secondary-additional-2 .add-metrics a,.show-pointer{cursor:pointer}.qtip-timeline-bar{font-size:14px;line-hei
 ght:1.4}#content .navbar-secondary-additional.navbar-secondary-additional-2{margin:-10px -10px 10px;padding:0;border-bottom:1px solid #e4e4e4}#content .navbar-secondary-additional.navbar-secondary-additional-2 .navbar-info{padding-top:12px;padding-bottom:12px}#content .navbar-secondary-additional.navbar-secondary-additional-2 .add-metrics{margin-right:15px;float:right}#content .navbar-secondary-additional.navbar-secondary-additional-2 .add-metrics .btn{margin-top:5px;margin-bottom:5px}#content .navbar-secondary-additional.navbar-secondary-additional-2 .metric-menu{max-height:300px;width:300px;overflow-y:scroll;text-align:left}#content .search label{position:absolute;top:15px;left:22px}#content .search input.metrics-filter{height:30px;padding:5px 5px 5px 25px;margin:5px 5px 5px 15px;width:90%;border-radius:5px;border:1px solid #999;-webkit-box-shadow:none;box-shadow:none}.metric-row{margin:0;min-height:275px;padding:0;list-style-type:none}.metric-row .metric-col{background-color:tran
 sparent;width:33.33%;float:left}.metric-row .metric-col.big{width:100%}.metric-row .metric-col .panel{margin-left:5px;margin-right:5px;min-height:265px;margin-bottom:10px}.metric-row .metric-col .panel .panel-body{background-color:transparent;height:265px;position:relative}.metric-row .metric-col .panel .panel-body .metric-numeric{text-align:center;margin-top:75px;font-size:40px;font-weight:700}.metric-row .metric-col .panel .panel-heading{padding:0 10px;background-color:transparent;height:41px;line-height:41px;position:relative;overflow:hidden;cursor:pointer}.metric-row .metric-col .panel .panel-heading .metric-title{padding:10px 0}.metric-row .metric-col .panel .panel-heading .buttons{position:absolute;top:0;right:0;padding:0 10px;background-color:#fff}.metric-row .metric-col.dndDraggingSource{display:none}.metric-row .dndPlaceholder{position:relative;background-color:#f0f0f0;min-height:305px;display:block;width:33.33%;float:left;margin-bottom:10px;border-radius:5px}.p-info{paddin
 g-left:5px;padding-right:5px}@media (min-width:1024px) and (max-width:1279px){#content #fold-button,#sidebar .navbar-static-top .navbar-brand-text{display:none}#sidebar{left:0;width:160px}#content{margin-left:160px}#content .navbar-main,#content .navbar-main-additional{left:160px}.table td.td-long{width:20%}}@media (min-width:1280px){#sidebar{left:0}#content{margin-left:250px}#content #fold-button{display:none}#content .navbar-main,#content .navbar-main-additional{left:250px}.table td.td-long{width:30%}}.legend-box{font-size:10px;width:2em}#total-mem{background-color:#7cb5ec}#heap-mem{background-color:#434348}#non-heap-mem{background-color:#90ed7d}#fetch-plan,#job-submit{width:100px}#content-inner,#details,#node-details{height:100%}#job-panel{overflow-y:auto}
\ No newline at end of file