2010-07-12 22:04:42 +08:00
|
|
|
$(document).ready(function() {
|
2010-08-23 23:32:17 +08:00
|
|
|
app.run();
|
2010-07-13 20:03:36 +08:00
|
|
|
var url = this.location.toString();
|
2010-08-23 23:32:17 +08:00
|
|
|
if (url.indexOf('#') == -1) {
|
|
|
|
this.location = url + '#/';
|
|
|
|
}
|
2010-07-12 22:04:42 +08:00
|
|
|
});
|
|
|
|
|
2010-08-23 23:32:17 +08:00
|
|
|
var app = $.sammy(dispatcher);
|
|
|
|
function dispatcher() {
|
|
|
|
var sammy = this;
|
|
|
|
function path(p, r, t) {
|
|
|
|
sammy.get(p, function() {
|
|
|
|
render(r, t, p);
|
|
|
|
});
|
|
|
|
}
|
2010-08-31 23:44:12 +08:00
|
|
|
path('#/', {'overview': '/overview'}, 'overview');
|
2010-08-27 00:42:03 +08:00
|
|
|
|
2010-08-31 23:44:12 +08:00
|
|
|
path('#/connections', {'connections': '/connections/'}, 'connections');
|
2010-08-25 22:11:30 +08:00
|
|
|
this.get('#/connections/:name', function() {
|
2010-08-31 23:44:12 +08:00
|
|
|
render({'connection': '/connections/' + esc(this.params['name'])}, 'connection',
|
2010-08-24 01:32:33 +08:00
|
|
|
'#/connections');
|
|
|
|
});
|
2010-08-25 22:11:30 +08:00
|
|
|
this.del('#/connections', function() {
|
|
|
|
sync_delete(this, '/connections/:name');
|
|
|
|
go_to('#/connections');
|
|
|
|
return false;
|
|
|
|
});
|
2010-08-27 00:42:03 +08:00
|
|
|
|
2010-08-31 23:44:12 +08:00
|
|
|
path('#/channels', {'channels': '/channels'}, 'channels');
|
2010-08-27 00:42:03 +08:00
|
|
|
|
2010-08-31 23:44:12 +08:00
|
|
|
path('#/exchanges', {'exchanges': '/exchanges', 'vhosts': '/vhosts'}, 'exchanges');
|
2010-08-27 00:42:03 +08:00
|
|
|
this.get('#/exchanges/:vhost/:name', function() {
|
2010-08-31 23:44:12 +08:00
|
|
|
render({'exchange': '/exchanges/' + esc(this.params['vhost']) + '/' + esc(this.params['name'])}, 'exchange',
|
2010-08-27 00:42:03 +08:00
|
|
|
'#/exchanges');
|
|
|
|
});
|
|
|
|
this.put('#/exchanges', function() {
|
|
|
|
sync_put(this, '/exchanges/:vhost/:name');
|
|
|
|
update();
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
this.del('#/exchanges', function() {
|
|
|
|
sync_delete(this, '/exchanges/:vhost/:name');
|
|
|
|
go_to('#/exchanges');
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
|
2010-08-31 23:44:12 +08:00
|
|
|
path('#/queues', {'queues': '/queues', 'vhosts': '/vhosts'}, 'queues');
|
2010-08-27 17:55:32 +08:00
|
|
|
this.get('#/queues/:vhost/:name', function() {
|
2010-09-02 00:26:51 +08:00
|
|
|
var path = '/queues/' + esc(this.params['vhost']) + '/' + esc(this.params['name']);
|
|
|
|
render({'queue': path,
|
|
|
|
'bindings': path + '/bindings'}, 'queue', '#/queues');
|
2010-08-27 17:55:32 +08:00
|
|
|
});
|
|
|
|
this.put('#/queues', function() {
|
|
|
|
sync_put(this, '/queues/:vhost/:name');
|
|
|
|
update();
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
this.del('#/queues', function() {
|
|
|
|
sync_delete(this, '/queues/:vhost/:name');
|
|
|
|
go_to('#/queues');
|
|
|
|
return false;
|
|
|
|
});
|
2010-08-27 00:42:03 +08:00
|
|
|
|
2010-09-02 00:26:51 +08:00
|
|
|
this.post('#/bindings', function() {
|
|
|
|
sync_post(this, '/bindings/:vhost/:queue/:exchange');
|
|
|
|
update();
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
this.del('#/bindings', function() {
|
|
|
|
sync_delete(this, '/bindings/:vhost/:queue/:exchange/:properties_key');
|
|
|
|
update();
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
|
2010-08-31 23:44:12 +08:00
|
|
|
path('#/vhosts', {'vhosts': '/vhosts/'}, 'vhosts');
|
2010-08-24 01:32:33 +08:00
|
|
|
this.get('#/vhosts/:id', function() {
|
2010-08-31 23:44:12 +08:00
|
|
|
render({'vhost': '/vhosts/' + esc(this.params['id'])}, 'vhost',
|
2010-08-24 01:32:33 +08:00
|
|
|
'#/vhosts');
|
|
|
|
});
|
|
|
|
this.put('#/vhosts', function() {
|
2010-08-25 01:46:30 +08:00
|
|
|
sync_put(this, '/vhosts/:name');
|
2010-08-24 01:32:33 +08:00
|
|
|
update();
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
this.del('#/vhosts', function() {
|
2010-08-25 01:46:30 +08:00
|
|
|
sync_delete(this, '/vhosts/:name');
|
2010-08-24 01:32:33 +08:00
|
|
|
go_to('#/vhosts');
|
|
|
|
return false;
|
|
|
|
});
|
2010-08-27 00:42:03 +08:00
|
|
|
|
2010-08-31 23:44:12 +08:00
|
|
|
path('#/users', {'users': '/users/'}, 'users');
|
2010-08-24 01:32:33 +08:00
|
|
|
this.get('#/users/:id', function() {
|
2010-08-31 23:44:12 +08:00
|
|
|
render({'user': '/users/' + esc(this.params['id']),
|
2010-09-02 00:45:05 +08:00
|
|
|
'permissions': '/users/' + esc(this.params['id']) + '/permissions',
|
2010-08-31 23:44:12 +08:00
|
|
|
'vhosts': '/vhosts/'}, 'user',
|
2010-08-24 01:32:33 +08:00
|
|
|
'#/users');
|
|
|
|
});
|
|
|
|
this.put('#/users', function() {
|
2010-08-25 01:46:30 +08:00
|
|
|
sync_put(this, '/users/:username');
|
2010-08-24 01:32:33 +08:00
|
|
|
update();
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
this.del('#/users', function() {
|
2010-08-25 01:46:30 +08:00
|
|
|
sync_delete(this, '/users/:username');
|
2010-08-24 01:32:33 +08:00
|
|
|
go_to('#/users');
|
|
|
|
return false;
|
2010-08-23 23:32:17 +08:00
|
|
|
});
|
2010-08-27 00:42:03 +08:00
|
|
|
|
2010-08-25 00:13:47 +08:00
|
|
|
this.put('#/permissions', function() {
|
2010-09-02 00:45:05 +08:00
|
|
|
sync_put(this, '/permissions/:vhost/:username');
|
2010-08-25 00:13:47 +08:00
|
|
|
update();
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
this.del('#/permissions', function() {
|
2010-09-02 00:45:05 +08:00
|
|
|
sync_delete(this, '/permissions/:vhost/:username');
|
2010-08-25 00:13:47 +08:00
|
|
|
update();
|
|
|
|
return false;
|
|
|
|
});
|
2010-08-23 23:32:17 +08:00
|
|
|
}
|
|
|
|
|
2010-08-24 01:32:33 +08:00
|
|
|
function go_to(url) {
|
|
|
|
this.location = url;
|
|
|
|
}
|
|
|
|
|
2010-08-23 23:32:17 +08:00
|
|
|
var current_template;
|
|
|
|
var current_reqs;
|
|
|
|
var current_highlight;
|
2010-08-24 17:57:19 +08:00
|
|
|
//var timer;
|
2010-07-13 00:11:42 +08:00
|
|
|
|
2010-08-23 23:32:17 +08:00
|
|
|
function render(reqs, template, highlight) {
|
|
|
|
current_template = template;
|
|
|
|
current_reqs = reqs;
|
|
|
|
current_highlight = highlight;
|
2010-07-13 20:03:36 +08:00
|
|
|
update();
|
|
|
|
}
|
|
|
|
|
2010-07-12 22:04:42 +08:00
|
|
|
function update() {
|
2010-08-24 17:57:19 +08:00
|
|
|
//clearInterval(timer);
|
2010-08-31 23:44:12 +08:00
|
|
|
with_reqs(current_reqs, [], function(json) {
|
2010-08-23 23:32:17 +08:00
|
|
|
var html = format(current_template, json);
|
2010-07-13 00:31:16 +08:00
|
|
|
replace_content('main', html);
|
2010-08-31 23:44:12 +08:00
|
|
|
update_status('ok');
|
2010-08-24 01:32:33 +08:00
|
|
|
postprocess();
|
2010-08-24 17:57:19 +08:00
|
|
|
//timer = setInterval('update()', 5000);
|
2010-08-24 01:32:33 +08:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function postprocess() {
|
|
|
|
$('a').removeClass('selected');
|
|
|
|
$('a[href="' + current_highlight + '"]').addClass('selected');
|
2010-08-24 17:57:19 +08:00
|
|
|
// $('input').focus(function() {
|
|
|
|
// clearInterval(timer);
|
|
|
|
// update_status('paused');
|
|
|
|
// });
|
2010-08-24 17:24:50 +08:00
|
|
|
$('form.confirm').submit(function() {
|
|
|
|
return confirm("Are you sure? This object cannot be recovered " +
|
|
|
|
"after deletion.");
|
|
|
|
});
|
2010-08-24 17:57:19 +08:00
|
|
|
$('div.section h2, div.section-hidden h2').click(function() {
|
|
|
|
$(this).next().toggle(100);
|
|
|
|
});
|
2010-08-25 17:46:08 +08:00
|
|
|
$('label').map(function() {
|
|
|
|
if ($(this).attr('for') == '') {
|
|
|
|
var id = 'auto-label-' + Math.floor(Math.random()*1000000000);
|
|
|
|
$(this).attr('for', id);
|
|
|
|
var input = $(this).parents('tr').first().find('input, select');
|
|
|
|
input.attr('id', id);
|
|
|
|
}
|
|
|
|
});
|
2010-08-07 00:52:26 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
function with_reqs(reqs, acc, fun) {
|
2010-09-02 19:58:34 +08:00
|
|
|
if (keys(reqs).length > 0) {
|
|
|
|
var key = keys(reqs)[0];
|
2010-08-31 23:44:12 +08:00
|
|
|
with_req('/api' + reqs[key], function(resp) {
|
|
|
|
acc[key] = jQuery.parseJSON(resp.responseText);
|
|
|
|
var remainder = {};
|
|
|
|
for (var k in reqs) {
|
|
|
|
if (k != key) remainder[k] = reqs[k];
|
|
|
|
}
|
|
|
|
with_reqs(remainder, acc, fun);
|
2010-08-07 00:52:26 +08:00
|
|
|
});
|
|
|
|
}
|
|
|
|
else {
|
|
|
|
fun(acc);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2010-07-13 00:31:16 +08:00
|
|
|
function replace_content(id, html) {
|
|
|
|
$("#" + id).empty();
|
|
|
|
$(html).appendTo("#" + id);
|
|
|
|
}
|
|
|
|
|
2010-07-12 22:04:42 +08:00
|
|
|
function format(template, json) {
|
|
|
|
try {
|
2010-08-27 23:18:41 +08:00
|
|
|
var tmpl = new EJS({url: 'js/tmpl/' + template + '.ejs'});
|
2010-07-17 00:38:06 +08:00
|
|
|
return tmpl.render(json);
|
2010-07-12 22:04:42 +08:00
|
|
|
} catch (err) {
|
2010-08-24 17:57:19 +08:00
|
|
|
//clearInterval(timer);
|
2010-08-23 23:32:17 +08:00
|
|
|
debug(err['name'] + ": " + err['message']);
|
2010-07-12 22:04:42 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2010-08-31 23:44:12 +08:00
|
|
|
function update_status(status) {
|
2010-07-13 00:31:16 +08:00
|
|
|
var text;
|
|
|
|
if (status == 'ok')
|
2010-08-31 23:44:12 +08:00
|
|
|
text = "Last update: " + new Date();
|
2010-07-13 00:31:16 +08:00
|
|
|
else if (status == 'timeout')
|
2010-08-31 23:44:12 +08:00
|
|
|
text = "Warning: server reported busy at " + new Date();
|
2010-07-13 00:31:16 +08:00
|
|
|
else if (status == 'error')
|
2010-08-31 23:44:12 +08:00
|
|
|
text = "Error: could not connect to server at " + new Date();
|
2010-08-24 17:57:19 +08:00
|
|
|
//else if (status == 'paused')
|
|
|
|
// text = "Updating halted due to form interaction.";
|
2010-07-13 00:31:16 +08:00
|
|
|
|
2010-07-17 00:38:06 +08:00
|
|
|
var html = format('status', {status: status, text: text});
|
2010-07-13 00:31:16 +08:00
|
|
|
replace_content('status', html);
|
|
|
|
}
|
|
|
|
|
2010-07-12 22:04:42 +08:00
|
|
|
function with_req(path, fun) {
|
|
|
|
var json;
|
|
|
|
var req = new XMLHttpRequest();
|
|
|
|
req.open( "GET", path, true );
|
|
|
|
req.onreadystatechange = function () {
|
|
|
|
if (req.readyState == 4) {
|
|
|
|
if (req.status == 200) {
|
2010-08-31 23:44:12 +08:00
|
|
|
fun(req);
|
2010-07-12 22:04:42 +08:00
|
|
|
}
|
2010-07-13 00:31:16 +08:00
|
|
|
else if (req.status == 408) {
|
2010-08-31 23:44:12 +08:00
|
|
|
update_status('timeout');
|
2010-07-13 00:31:16 +08:00
|
|
|
}
|
2010-07-13 00:11:42 +08:00
|
|
|
else if (req.status == 0) {
|
2010-08-31 23:44:12 +08:00
|
|
|
update_status('error');
|
2010-07-13 00:11:42 +08:00
|
|
|
}
|
2010-07-24 00:24:01 +08:00
|
|
|
else if (req.status == 404) {
|
|
|
|
var html = format('404', {});
|
|
|
|
replace_content('main', html);
|
|
|
|
}
|
2010-07-12 22:04:42 +08:00
|
|
|
else {
|
2010-08-23 23:32:17 +08:00
|
|
|
debug("Got response code " + req.status);
|
2010-08-24 17:57:19 +08:00
|
|
|
//clearInterval(timer);
|
2010-07-12 22:04:42 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
req.send(null);
|
|
|
|
}
|
2010-07-13 20:03:36 +08:00
|
|
|
|
2010-08-25 01:46:30 +08:00
|
|
|
function sync_put(sammy, path_template) {
|
|
|
|
sync_req('put', sammy, path_template);
|
|
|
|
}
|
|
|
|
|
|
|
|
function sync_delete(sammy, path_template) {
|
|
|
|
sync_req('delete', sammy, path_template);
|
|
|
|
}
|
|
|
|
|
2010-09-02 00:26:51 +08:00
|
|
|
function sync_post(sammy, path_template) {
|
|
|
|
sync_req('post', sammy, path_template);
|
|
|
|
}
|
|
|
|
|
2010-08-25 01:46:30 +08:00
|
|
|
function sync_req(type, sammy, path_template) {
|
|
|
|
var path = fill_path_template(path_template, sammy.params);
|
2010-08-24 01:32:33 +08:00
|
|
|
var req = new XMLHttpRequest();
|
2010-08-31 21:22:52 +08:00
|
|
|
req.open(type, '/api' + path, false);
|
2010-08-24 01:32:33 +08:00
|
|
|
req.setRequestHeader('content-type', 'application/json');
|
2010-08-25 01:46:30 +08:00
|
|
|
req.send(JSON.stringify(sammy.params)); // TODO make portable
|
2010-08-24 01:32:33 +08:00
|
|
|
|
|
|
|
if (req.status >= 400) {
|
2010-08-25 00:13:47 +08:00
|
|
|
debug("Got response code " + req.status + " with body " +
|
|
|
|
req.responseText);
|
2010-08-24 01:32:33 +08:00
|
|
|
}
|
|
|
|
}
|
2010-07-13 20:03:36 +08:00
|
|
|
|
2010-08-25 01:46:30 +08:00
|
|
|
function fill_path_template(template, params) {
|
|
|
|
var re = /:[a-zA-Z_]*/g;
|
|
|
|
return template.replace(re, function(m) {
|
|
|
|
return esc(params[m.substring(1)]);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2010-07-13 20:03:36 +08:00
|
|
|
function debug(str) {
|
|
|
|
$('<p>' + str + '</p>').appendTo('#debug');
|
2010-09-02 19:58:34 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
function keys(obj) {
|
|
|
|
var ks = [];
|
|
|
|
for (var k in obj) {
|
|
|
|
ks.push(k);
|
|
|
|
}
|
|
|
|
return ks;
|
2010-07-13 20:03:36 +08:00
|
|
|
}
|