Skip to content

Commit

Permalink
Finished Flink-928
Browse files Browse the repository at this point in the history
Taskmanagers are now displayed in the web interface @rmetzger

Author: Jonathan <[email protected]>

Closes apache#43 from JonathanH5/webclient and squashes the following commits:

5cc5f72 [Jonathan] Finished Flink-928 and simplified how new pages to the WebInterface are added
  • Loading branch information
MoeweX authored and rmetzger committed Jul 3, 2014
1 parent cebb1f6 commit 7a4c209
Show file tree
Hide file tree
Showing 18 changed files with 505 additions and 139 deletions.
24 changes: 16 additions & 8 deletions stratosphere-runtime/resources/web-docs-infoserver/analyze.html
Original file line number Diff line number Diff line change
Expand Up @@ -31,14 +31,25 @@
<script type="text/javascript" src="js/timeline.js"></script>
<script type="text/javascript" src="js/helpers.js"></script>
<script type="text/javascript" src="js/analyzer.js"></script>

<!-- Load Menu -->
<script type="text/javascript">
$(document).ready(function() {
$.ajax({ url : "menu?get=analyze", type : "GET", cache: false, success : function(html) {
$("#side-menu").empty();
$("#side-menu").append(html);
}, dataType : "html",
});
});
</script>
</head>

<body>

<div id="wrapper">

<!-- Sidebar -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<nav class='navbar navbar-inverse navbar-fixed-top' role='navigation'>
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
Expand All @@ -49,15 +60,12 @@
</button>
<a class="navbar-brand" href="index.html">Stratosphere</a>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav side-nav">
<li><a href="index.html"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li><a href="history.html"><i class="fa fa-bar-chart-o"></i> History</a></li>
<li><a href="configuration.html"><i class="fa fa-keyboard-o"></i> Configuration</a></li>
<ul id="side-menu" class="nav navbar-nav side-nav">
<!-- Filled via script -->
</ul>

<ul class="nav navbar-nav navbar-right navbar-user">
<li class="dropdown user-dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-archive"></i> Log Files<b class="caret"></b></a>
Expand Down
25 changes: 16 additions & 9 deletions stratosphere-runtime/resources/web-docs-infoserver/blank-page.html
Original file line number Diff line number Diff line change
Expand Up @@ -25,16 +25,26 @@
<!-- Scripts from Stratosphere -->
<script type="text/javascript" src="js/jquery.flot.min.js"></script>
<script type="text/javascript" src="js/helpers.js"></script>
<script type="text/javascript" src="js/jobmanagerFrontend.js"></script>
<script type="text/javascript" src="js/jcanvas.min.js"></script>

<!-- Load Menu -->
<script type="text/javascript">
$(document).ready(function() {
$.ajax({ url : "menu?get=...", type : "GET", cache: false, success : function(html) {
$("#side-menu").empty();
$("#side-menu").append(html);
}, dataType : "html",
});
});
</script>
</head>

<body>

<div id="wrapper">

<!-- Sidebar -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<nav class='navbar navbar-inverse navbar-fixed-top' role='navigation'>
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
Expand All @@ -45,15 +55,12 @@
</button>
<a class="navbar-brand" href="index.html">Stratosphere</a>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav side-nav">
<li class="active"><a href="index.html"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li><a href="history.html"><i class="fa fa-bar-chart-o"></i> History</a></li>
<li><a href="configuration.html"><i class="fa fa-keyboard-o"></i> Configuration</a></li>
<ul id="side-menu" class="nav navbar-nav side-nav">
<!-- Filled via script -->
</ul>

<ul class="nav navbar-nav navbar-right navbar-user">
<li class="dropdown user-dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-archive"></i> Log Files<b class="caret"></b></a>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,14 +27,25 @@
<script type="text/javascript" src="js/helpers.js"></script>
<script type="text/javascript" src="js/configuration.js"></script>
<script type="text/javascript" src="js/jcanvas.min.js"></script>

<!-- Load Menu -->
<script type="text/javascript">
$(document).ready(function() {
$.ajax({ url : "menu?get=configuration", type : "GET", cache: false, success : function(html) {
$("#side-menu").empty();
$("#side-menu").append(html);
}, dataType : "html",
});
});
</script>
</head>

<body>

<div id="wrapper">

<!-- Sidebar -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<nav class='navbar navbar-inverse navbar-fixed-top' role='navigation'>
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
Expand All @@ -45,15 +56,12 @@
</button>
<a class="navbar-brand" href="index.html">Stratosphere</a>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav side-nav">
<li><a href="index.html"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li><a href="history.html"><i class="fa fa-bar-chart-o"></i> History</a></li>
<li class="active"><a href="configuration.html"><i class="fa fa-keyboard-o"></i> Configuration</a></li>
<ul id="side-menu" class="nav navbar-nav side-nav">
<!-- Filled via script -->
</ul>

<ul class="nav navbar-nav navbar-right navbar-user">
<li class="dropdown user-dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-archive"></i> Log Files<b class="caret"></b></a>
Expand All @@ -79,12 +87,8 @@ <h1>Configuration <small>Overview about the configuration settings of Stratosphe
<div class="col-lg-12"><h3>Global Configuration</h2></div>
<div class="col-lg-12">
<div class="table-responsive" id="confTable">




</div>
</div>
</div>
</div><!-- /.row -->

</div><!-- /#page-wrapper -->
Expand Down
26 changes: 17 additions & 9 deletions stratosphere-runtime/resources/web-docs-infoserver/history.html
Original file line number Diff line number Diff line change
Expand Up @@ -27,14 +27,25 @@
<script type="text/javascript" src="js/helpers.js"></script>
<script type="text/javascript" src="js/jobmanagerFrontend.js"></script>
<script type="text/javascript" src="js/jcanvas.min.js"></script>

<!-- Load Menu -->
<script type="text/javascript">
$(document).ready(function() {
$.ajax({ url : "menu?get=history", type : "GET", cache: false, success : function(html) {
$("#side-menu").empty();
$("#side-menu").append(html);
}, dataType : "html",
});
});
</script>
</head>

<body>

<div id="wrapper">

<!-- Sidebar -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<nav class='navbar navbar-inverse navbar-fixed-top' role='navigation'>
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
Expand All @@ -45,21 +56,18 @@
</button>
<a class="navbar-brand" href="index.html">Stratosphere</a>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav side-nav">
<li><a href="index.html"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li class="active"><a href="history.html"><i class="fa fa-bar-chart-o"></i> History</a></li>
<li><a href="configuration.html"><i class="fa fa-keyboard-o"></i> Configuration</a></li>
<ul id="side-menu" class="nav navbar-nav side-nav">
<!-- Filled via script -->
</ul>

<ul class="nav navbar-nav navbar-right navbar-user">
<li class="dropdown user-dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-archive"></i> Log Files<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="logInfo"><i class="fa fa-keyboard-o"></i> Log Info</a></li>
<li><a href="logInfo?get=stdout"><i class="fa fa-keyboard-o"></i> Stdout</a></li>
<li><a href="logInfo?get=stdout"><i class="fa fa-keyboard-o"></i> Stdout</a></li>
</ul>
</li>
</ul>
Expand Down
26 changes: 17 additions & 9 deletions stratosphere-runtime/resources/web-docs-infoserver/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -40,14 +40,25 @@
});
});
</script>

<!-- Load Menu -->
<script type="text/javascript">
$(document).ready(function() {
$.ajax({ url : "menu?get=index", type : "GET", cache: false, success : function(html) {
$("#side-menu").empty();
$("#side-menu").append(html);
}, dataType : "html",
});
});
</script>
</head>

<body>

<div id="wrapper">

<!-- Sidebar -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<nav class='navbar navbar-inverse navbar-fixed-top' role='navigation'>
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
Expand All @@ -58,21 +69,18 @@
</button>
<a class="navbar-brand" href="index.html">Stratosphere</a>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav side-nav">
<li class="active"><a href="index.html"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li><a href="history.html"><i class="fa fa-bar-chart-o"></i> History</a></li>
<li><a href="configuration.html"><i class="fa fa-keyboard-o"></i> Configuration</a></li>
<ul id="side-menu" class="nav navbar-nav side-nav">
<!-- Filled via script -->
</ul>

<ul class="nav navbar-nav navbar-right navbar-user">
<li class="dropdown user-dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-archive"></i> Log Files<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="logInfo"><i class="fa fa-keyboard-o"></i> Log Info</a></li>
<li><a href="logInfo?get=stdout"><i class="fa fa-keyboard-o"></i> Stdout</a></li>
<li><a href="logInfo?get=stdout"><i class="fa fa-keyboard-o"></i> Stdout</a></li>
</ul>
</li>
</ul>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,24 +1,15 @@

$(document).ready(function() {
loadData();

});

/*
* Load all necessary data
*/
function loadData() {
$.ajax({ url : "configuration", type : "GET", cache: false, success : function(json) {
$.ajax({ url : "setupInfo?get=globalC", type : "GET", cache: false, success : function(json) {
loadConfigTable(json);
}, dataType : "json",
});
}
});

/*
* Initializes global config table
*/
function loadConfigTable(json) {
console.log(json);
$("#confTable").empty();
var table = "<table class=\"table table-bordered table-hover table-striped\">";
table += "<tr><th>Property</th><th>Value</th></tr>";
Expand All @@ -29,4 +20,4 @@ function loadConfigTable(json) {
}
table += "</table>";
$("#confTable").append(table);
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@

$(document).ready(function() {
pollTaskmanagers();

});

/*
* Initializes taskmanagers table
*/
function loadTaskmanagers(json) {
$("#taskmanagerTable").empty();
var table = "<table class=\"table table-bordered table-hover table-striped\">";
table += "<tr><th>Node</th><th>Ipc Port</th><th>Data Port</th><th>Seconds since last Heartbeat</th>" +
"<th>Number of Slots</th><th>Available Slots</th><th>CPU Cores</th><th>Physical Memory (mb)</th><th>TaskManager Heapsize (mb)</th></tr>";
for (var i = 0; i < json.taskmanagers.length; i++) {
var tm = json.taskmanagers[i]
table += "<tr><td>"+tm.inetAdress+"</td><td>"+tm.ipcPort+"</td><td>"+tm.dataPort+"</td><td>"+tm.timeSinceLastHeartbeat+"</td>" +
"<td>"+tm.slotsNumber+"</td><td>"+tm.freeSlots+"</td><td>"+tm.cpuCores+"</td><td>"+tm.physicalMemory+"</td><td>"+tm.freeMemory+"</td></tr>";
}
table += "</table>";
$("#taskmanagerTable").append(table);
}

function pollTaskmanagers() {
$.ajax({ url : "setupInfo?get=taskmanagers", type : "GET", cache: false, success : function(json) {
loadTaskmanagers(json);
}, dataType : "json",
});
setTimeout(function() {
pollTaskmanagers();
}, 10000);
}
Loading

0 comments on commit 7a4c209

Please sign in to comment.