Skip to content
Snippets Groups Projects
Commit b779ce49 authored by jkerdreu's avatar jkerdreu
Browse files

Added some CSS & auto refresh

git-svn-id: https://redmine.imt-atlantique.fr/svn/xaal/code/Python/branches/fork@1662 b32b6428-25c9-4566-ad07-03861ab6144f
parent 4a6e3b0f
No related branches found
No related tags found
No related merge requests found
......@@ -2,10 +2,39 @@
<head>
<title>xAAL JSON / List of devices</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<style>
h1,h2 {
color: #00bbd7;
}
table {
border-collapse: collapse;
width: 800;
}
th, td {
padding: 6px;
text-align: left;
border-bottom: 1px solid #ddd;
}
th {
background: #00bbd7;
color: white;
}
</style>
<body>
<h1>Device</h1>
<h1>xAAL Device</h1>
<div id="attributes"></div>
<h2>Description</h2>
<table id="description">
</table>
<br/>
<h2>Attributes</h2>
<table id="attributes">
</table>
<script>
function getUrlVars()
......@@ -21,13 +50,29 @@ function getUrlVars()
return vars;
}
addr=getUrlVars()['addr'];
url="/devices/"+addr;
$.getJSON(url, function(result){
$("#attributes").html(result["attributes"]["temperature"]);
function update() {
addr=getUrlVars()['addr'];
url="/devices/"+addr;
$.getJSON(url, function(result){
$("#description").html("<tr><th>Name</th><th>Value</th></tr>");
$.each(result["description"], function(id, field){
if (field) {
$("#description").append("<tr><td>"+id+"</td><td>"+field+"</td></tr>");
}
});
$("#attributes").html("<tr><th>Name</th><th>Value</th></tr>");
$.each(result["attributes"], function(id, field){
$("#attributes").append("<tr><td>"+id+"</td><td>"+field+"</td></tr>");
});
});
}
setInterval(update,(1000*30));
update();
</script>
</script>
......
......@@ -2,15 +2,51 @@
<head>
<title>xAAL JSON / List of devices</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<style>
h1{
color: #00bbd7;
}
table {
border-collapse: collapse;
width: 800;
}
th, td {
padding: 6px;
text-align: left;
border-bottom: 1px solid #ddd;
}
th {
background: #00bbd7;
color: white;
}
</style>
<body>
<h1>Devices</h1>
<h1>xAAL Devices</h1>
<style>
table {
border-collapse: collapse;
width: 800;
}
th, td {
padding: 6px;
text-align: left;
border-bottom: 1px solid #ddd;
}
</style>
<table id="devices">
<tr><th>DevType</th><th>Address</th></tr>
</table>
<div id="url">
</div>
<script>
$.getJSON("/devices", function(result){
$.each(result, function(i, field){
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment