AJAX RFID Tester
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/1.4.3/jquery.scrollTo.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/ICanHaz.js/0.10/ICanHaz.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.3/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.9/backbone-min.js"></script>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="main.css">
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/ICanHaz.js/0.10/ICanHaz.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.3/underscore-min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.9/backbone-min.js"></script>
<script type="text/javascript" src="main.js"></script>
<title>My Title Now</title>
</head>
<body>Last status: <span id="status">Idle</span>
<div id="logContainer" style="overflow : auto; height: 250px; resize: vertical;">
</div>
<label>Time</label>
<input id="timestamp" type="text" value=""/>
<label>Delay</label>
<input id="delay" type="text" value=""/>
<br/>
<label>Tag Id</label>
<input id="tagid" type="text" value=""/>
<br/>
<button id="index" class="b">Index</button>
<button id="alldetails" class="b">All details</button>
<button id="single" class="b">Single</button>
<button id="since" class="b">Since</button>
<button id="replace">Replace</button>
<input type="checkbox" id="loop" name="Loop">Loop
<br>
</body>
</html>
CSS
label {
font-family: sans-serif;
background-color: #fff8dcange;
}
kbd {
border: 1px solid grey;
border-radius: 3px;
background: -webkit-linear-gradient(top, #eeeeee 0%, #cccccc 100%);
}
#content {
font-family:'courier new', 'courier';
min-height: 3em;
background: -webkit-linear-gradient(top, #ffffee 0%, #ddddcc 100%);
}
JavaScript
var DEBUG = true;
var logEntryTemplate='<div><b>{{requestTitle}} {{_requestDetails}}</b></div>\
<div>\
{{#response}}\
{{#time}}Time: {{time}}<br/>{{/time}}\
{{#error_msg}}<p>{{error_msg}}</p>{{/error_msg}}\
{{{_data}}}\
{{/response}}\
</div>';
console.log(logEntryTemplate);
//Prevent crashes from console.log when unavailable
if(!DEBUG){
if (!("console" in window)) {
var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml", "group", "groupEnd", "time",
"timeEnd", "count", "trace", "profile", "profileEnd"
];
window.console = {};
for (var i = 0, len = names.length; i < len; ++i) {
window.console[names[i]] = function(){};
}
}
}
var testConsole=(function($){
//Any code that accesses HTML needs to be
var DELAY_TIME = 2000;
var BASE_URL = "http://localhost:8888/";
RequestLogEntry = Backbone.Model.extend({
defaults: {
requestTitle: "",
requestDetails: {},
response: null
}
});
//Currently the view only supports adding items
RequestLogs = Backbone.Collection.extend({
model: RequestLogEntry
});
var requestLogs = new RequestLogs();
LogEntryView = Backbone.View.extend({
tagName: 'div',
initialize: function(options){
this.model.bind("change", this.render, this);
},
render: function(){
var args=this.model.toJSON();
args._requestDetails=JSON.stringify(args.requestDetails);
if(args.response){
var data=args.response.data;
var _data="";
if ($.isArray(data)) {
if (data.length === 0) {
_data += "None";
}
$.each(data, function (i, item) {
//Need to escape any html
_data += _.escape(JSON.stringify(item)) + '<br />';
...