CHAOS
Getting CQM Graphs
This is a quick example of getting cqm graphs from CHAOS.
In short, the Info command is used to get the graph URLs. The HTML provides a form to enter the credentials or you can edit the javascript to hardcode these.
HTML:
<!DOCTYPE html>
<head lang='en'>
<title>Graphs</title>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script src='chaosgraphs.js'></script>
</head>
<body>
<form id='login'>
<input type='text' name='username' placeholder='username' autofocus />
<input type='password' name='password' placeholder='password' />
<input type='submit' value='Login' />
</form>
<hr />
<div id='results'></div>
</body>
</html>
Javascript:
//Function to get service data from chaos using the "info" command
function getgraphs(username,password)
{
$("#results").html("<p><img src='images/loading-small.gif' alt='Loading' /></p>"); //Show a loading image while wai
ting for chaos
if(!username) { var username = $("input[type='text'][name='username']").val(); }
if(!password) { var password = $("input[type='password'][name='password']").val(); }
//AJAX request for "info" command
$.ajax({
type: "POST",
url: "https://chaos.aa.net.uk/info",
xhrFields: { withCredentials: true },
contentType: 'application/json',
data: JSON.stringify({username:username,password:password}),
success: function(data) {
var chaos = data;
var html = "";
console.log(chaos);
if(chaos.error != undefined) {
//If there is an error display it
html+="<p class='error'>"+chaos.error+"</p>";
}
else {
//If there is no error, loop through the response and create graphs
for(var i = 0; i < chaos.login.length; i++) {
if(chaos.login[i].broadband_count != 0) {
for(var j = 0; j < chaos.login[i].broadband.length; j++) {
var bb = chaos.login[i].broadband[j];
html+=bb.circuit+"<br />";
html+="<img src='"+bb.cqm_png.replace(/http:/g,"https:")+"' alt='CQM graph "+j+"' /><hr />";
}
}
else { html+="No lines"; }
}
}
$("#results").html(html);
//Put the results into a div
}
});
}
$(document).ready(function() {
//Run the getgraphs() function when the form is submitted
$("#login").submit(function(e) {
e.preventDefault();
getgraphs();
//Or you could run getgraphs with a static username and password e.g.
//getgraphs('myusername','mypassword');
});
});