Skip to content

Commit

Permalink
Mesos UI: Change paths, pailer, and logs to work with a reverse proxy.
Browse files Browse the repository at this point in the history 
Includes correcting routes to be /agent/{id}...
Redirect from old mesos ui location to new dcos mesos ui location.
  • Loading branch information
@mlunoe @tillt
mlunoe authored and tillt committed May 10, 2017
1 parent db85099 commit d562795
Show file tree
Hide file tree
Showing 4 changed files with 42 additions and 46 deletions.
30 changes: 15 additions & 15 deletions src/webui/master/static/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,15 @@
<meta name="description" content="">
<meta name="author" content="">

<link href="/static/css/bootstrap-3.3.6.min.css" rel="stylesheet">
<link href="/static/css/mesos.css" rel="stylesheet">
<link href="static/css/bootstrap-3.3.6.min.css" rel="stylesheet">
<link href="static/css/mesos.css" rel="stylesheet">

<link rel="shortcut icon" href="/static/ico/favicon.ico">
<link rel="shortcut icon" href="static/ico/favicon.ico">
</head>

<body>
<div data-ng-show="doneLoading" style="width: 75px; margin: 0 auto; text-align: center;">
<img src="/static/img/loading.gif" height="64" width="64" alt="">
<img src="static/img/loading.gif" height="64" width="64" alt="">
</div>

<div ng-controller="MainCtrl">
Expand All @@ -30,7 +30,7 @@
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#/">
<img src="/static/img/mesos_logo.png" alt="Apache Mesos">
<img src="static/img/mesos_logo.png" alt="Apache Mesos">
</a>
</div>

Expand Down Expand Up @@ -108,16 +108,16 @@ <h4 class="modal-title">{{ title }}</h4>
</div>
</script>

<script src="/static/js/jquery-1.7.1.min.js"></script>
<script src="/static/js/underscore-1.4.3.min.js"></script>
<script src="/static/js/clipboard-1.5.16.min.js"></script>
<script src="/static/js/angular-1.2.3.min.js"></script>
<script src="/static/js/angular-route-1.2.3.min.js"></script>
<script src="/static/js/ui-bootstrap-tpls-0.9.0.min.js"></script>
<script src="/static/js/relative-date.js"></script>
<script src="static/js/jquery-1.7.1.min.js"></script>
<script src="static/js/underscore-1.4.3.min.js"></script>
<script src="static/js/clipboard-1.5.16.min.js"></script>
<script src="static/js/angular-1.2.3.min.js"></script>
<script src="static/js/angular-route-1.2.3.min.js"></script>
<script src="static/js/ui-bootstrap-tpls-0.9.0.min.js"></script>
<script src="static/js/relative-date.js"></script>

<script src="/static/js/app.js"></script>
<script src="/static/js/services.js"></script>
<script src="/static/js/controllers.js"></script>
<script src="static/js/app.js"></script>
<script src="static/js/services.js"></script>
<script src="static/js/controllers.js"></script>
</body>
</html>
50 changes: 23 additions & 27 deletions src/webui/master/static/js/controllers.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
// Invokes the pailer for the specified host and path using the
// specified window_title.
function pailer(host, path, window_title) {
var url = '//' + host + '/files/read?path=' + path;
var url = host + 'files/read?path=' + path;

// The randomized `storageKey` is removed from `localStorage` once the
// pailer window loads the URL into its `sessionStorage`, therefore
Expand All @@ -26,7 +26,7 @@
localStorage.setItem(storageKey, url);

var pailer =
window.open('/static/pailer.html', storageKey, 'width=580px, height=700px');
window.open('static/pailer.html', storageKey, 'width=580px, height=700px');

// Need to use window.onload instead of document.ready to make
// sure the title doesn't get overwritten.
Expand Down Expand Up @@ -281,6 +281,13 @@
mesosApp.controller('MainCtrl', [
'$scope', '$http', '$location', '$timeout', '$modal',
function($scope, $http, $location, $timeout, $modal) {

// Redirect from old mesos ui location to new dcos mesos ui location
if ($location.port() === 5050) {
var url = $location.protocol() + "://" + $location.host() + "/mesos";
window.location = url;
}

$scope.doneLoading = true;

// Adding bindings into scope so that they can be used from within
Expand Down Expand Up @@ -464,7 +471,7 @@
).open();
} else {
pailer(
$scope.$location.host() + ':' + $scope.$location.port(),
'/mesos/',
'/master/log',
'Mesos Master');
}
Expand Down Expand Up @@ -539,9 +546,8 @@
}

var pid = $scope.agents[$routeParams.agent_id].pid;
var hostname = $scope.agents[$routeParams.agent_id].hostname;
var id = pid.substring(0, pid.indexOf('@'));
var host = hostname + ":" + pid.substring(pid.lastIndexOf(':') + 1);
var host = '/agent/' + $routeParams.agent_id + '/';

$scope.log = function($event) {
if (!$scope.state.external_log_file && !$scope.state.log_dir) {
Expand All @@ -560,7 +566,7 @@
$top.start(host, id, $scope);
}

$http.jsonp('//' + host + '/' + id + '/state?jsonp=JSON_CALLBACK')
$http.jsonp(host + id + '/state?jsonp=JSON_CALLBACK')
.success(function (response) {
$scope.state = response;

Expand Down Expand Up @@ -605,7 +611,7 @@
$('#alert').show();
});

$http.jsonp('//' + host + '/metrics/snapshot?jsonp=JSON_CALLBACK')
$http.jsonp(host + '/metrics/snapshot?jsonp=JSON_CALLBACK')
.success(function (response) {
$scope.staging_tasks = response['slave/tasks_staging'];
$scope.starting_tasks = response['slave/tasks_starting'];
Expand Down Expand Up @@ -645,16 +651,15 @@
}

var pid = $scope.agents[$routeParams.agent_id].pid;
var hostname = $scope.agents[$routeParams.agent_id].hostname;
var id = pid.substring(0, pid.indexOf('@'));
var host = hostname + ":" + pid.substring(pid.lastIndexOf(':') + 1);
var host = '/agent/' + $routeParams.agent_id + '/';

// Set up polling for the monitor if this is the first update.
if (!$top.started()) {
$top.start(host, id, $scope);
}

$http.jsonp('//' + host + '/' + id + '/state?jsonp=JSON_CALLBACK')
$http.jsonp(host + id + '/state?jsonp=JSON_CALLBACK')
.success(function (response) {
$scope.state = response;

Expand Down Expand Up @@ -722,16 +727,15 @@
}

var pid = $scope.agents[$routeParams.agent_id].pid;
var hostname = $scope.agents[$routeParams.agent_id].hostname;
var id = pid.substring(0, pid.indexOf('@'));
var host = hostname + ":" + pid.substring(pid.lastIndexOf(':') + 1);
var host = '/agent/' + $routeParams.agent_id + '/';

// Set up polling for the monitor if this is the first update.
if (!$top.started()) {
$top.start(host, id, $scope);
}

$http.jsonp('//' + host + '/' + id + '/state?jsonp=JSON_CALLBACK')
$http.jsonp(host + id + '/state?jsonp=JSON_CALLBACK')
.success(function (response) {
$scope.state = response;

Expand Down Expand Up @@ -833,14 +837,12 @@
}

var pid = agent.pid;
var hostname = $scope.agents[$routeParams.agent_id].hostname;
var id = pid.substring(0, pid.indexOf('@'));
var port = pid.substring(pid.lastIndexOf(':') + 1);
var host = hostname + ":" + port;
var host = '/agent/' + $routeParams.agent_id + '/';

// Request agent details to get access to the route executor's "directory"
// to navigate directly to the executor's sandbox.
$http.jsonp('//' + host + '/' + id + '/state?jsonp=JSON_CALLBACK')
$http.jsonp(host + id + '/state?jsonp=JSON_CALLBACK')
.success(function(response) {

function matchFramework(framework) {
Expand Down Expand Up @@ -911,8 +913,7 @@
.error(function(response) {
$alert.danger({
bullets: [
"The agent's hostname, '" + hostname + "', is not accessible from your network",
"The agent's port, '" + port + "', is not accessible from your network",
"The agent is not accessible",
"The agent timed out or went offline"
],
message: "Potential reasons:",
Expand All @@ -933,18 +934,13 @@
$scope.agent_id = $routeParams.agent_id;
$scope.path = $routeParams.path;

var pid = $scope.agents[$routeParams.agent_id].pid;
var hostname = $scope.agents[$routeParams.agent_id].hostname;
var id = pid.substring(0, pid.indexOf('@'));
var host = hostname + ":" + pid.substring(pid.lastIndexOf(':') + 1);
var url = '//' + host + '/files/browse?jsonp=JSON_CALLBACK';

$scope.agent_host = host;
var url = '/agent/' + $scope.agent_id + '/files/browse?jsonp=JSON_CALLBACK';

$scope.pail = function($event, path) {
pailer(host, path, decodeURIComponent(path));
pailer('/agent/' + $scope.agent_id + '/', path, decodeURIComponent(path));
};

$scope.agent_host = '/agent/' + $scope.agent_id + '/';
// TODO(bmahler): Try to get the error code / body in the error callback.
// This wasn't working with the current version of angular.
$http.jsonp(url, {params: {path: $routeParams.path}})
Expand Down
2 changes: 1 addition & 1 deletion src/webui/master/static/js/services.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -271,7 +271,7 @@
return;
}

this.endpoint = '//' + host + '/' + id + '/monitor/statistics?jsonp=JSON_CALLBACK';
this.endpoint = host + '/' + id + '/monitor/statistics?jsonp=JSON_CALLBACK';
this.scope = scope;

// Initial poll is immediate.
Expand Down
6 changes: 3 additions & 3 deletions src/webui/master/static/pailer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,9 @@
<pre id="data"></pre>
<div class="indicator" id="indicator"></div>

<script src="/static/js/jquery-1.7.1.min.js"></script>
<script src="/static/js/underscore-1.4.3.min.js"></script>
<script src="/static/js/jquery.pailer.js"></script>
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/underscore-1.4.3.min.js"></script>
<script src="js/jquery.pailer.js"></script>

<script>
var $body = $('body');
Expand Down

0 comments on commit d562795

Please sign in to comment.