CHAOS: Difference between revisions
Content deleted Content added
mNo edit summary |
|||
| Line 17: | Line 17: | ||
HTML: |
HTML: |
||
http://wiki.aa.org.uk/aacustom/chaosgraphs.html |
|||
<source lang=html5> |
|||
<!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> |
|||
</source> |
|||
| ⚫ | |||
<source lang=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() { |
|||
http://wiki.aa.org.uk/aacustom/chaosgraphs.js |
|||
//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'); |
|||
}); |
|||
}); |
|||
</source> |
|||