Add interactive socket.io test page

This commit is contained in:
Martin Boehm 2018-02-07 13:23:17 +01:00
parent a093d9aa9b
commit e094fce3dd

View File

@ -6,8 +6,51 @@
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
crossorigin="anonymous">
<style>
.row {
margin-top: 1%;
}
</style>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.4/socket.io.js"></script>
<title>Test socket.io</title>
<script>
var socket;
function connect(server) {
socket = io(server, { transports: ['websocket'] });
socket.on('connect', function () {
console.log('socket connected');
document.getElementById('connectionStatus').innerText = "connected";
});
}
function lookupTransactionIds() {
var addresses = document.getElementById('addresses').value.split(",");
var mempool = document.getElementById("addressesMempool").checked;
lookupTransactionsIdsMempool(addresses, mempool, 2000000, 0, function (result) {
console.log('sent successfully');
console.log(result);
document.getElementById('lookupTransactionIdsResult').innerText = JSON.stringify(result).replace(/,/g, ", ");
});
}
function lookupTransactionsIdsMempool(addresses, mempool, start, end, f) {
const method = 'getAddressTxids';
const rangeParam = mempool ? {
start,
end,
queryMempoolOnly: true,
} : {
start,
end,
queryMempol: false,
};
const params = [
addresses,
rangeParam,
];
return socket.send({ method, params }, f);
}
</script>
</head>
<body>
@ -15,41 +58,35 @@
<div class="row justify-content-center">
<h1>Socket.io tester</h1>
</div>
<div class="row">
<div class="col">
<input class="btn btn-secondary" type="button" value="Login" onclick="connect(document.getElementById('serverAddress').value)">
</div>
<div class="col-8">
<input type="text" class="form-control" id="serverAddress" value="ws://127.0.0.1:8334">
</div>
<div class="col form-inline">
<label id="connectionStatus">not connected</label>
</div>
</div>
<div class="row">
<div class="col">
<input class="btn btn-secondary" type="button" value="getAddressTxids" onclick="lookupTransactionIds()">
</div>
<div class="col-8">
<input type="text" class="form-control" id="addresses" value="2MxvKTW83yhVsGCr4BSRqmhca7r8TB2dgW8,bc1qrsf2l34jvqnq0lduyz0j5pfu2nkd93nnq0qggn">
</div>
<div class="col form-inline">
<input type="checkbox" id="addressesMempool">&nbsp;
<label>only mempool</label>
</div>
</div>
<div class="row">
<div class="col" id="lookupTransactionIdsResult">
</div>
</div>
</div>
</div>
</body>
<script>
var socket = io('ws://127.0.0.1:8334', { transports: ['websocket'] });
socket.on('message', function (message) {
console.log('new message');
console.log(message);
});
socket.on('connect', function () {
console.log('socket connected');
lookupTransactionsIdsMempool(["2MxvKTW83yhVsGCr4BSRqmhca7r8TB2dgW8", "bc1qrsf2l34jvqnq0lduyz0j5pfu2nkd93nnq0qggn"], false, 2000000, 0, function (result) {
console.log('sent successfully');
console.log(result);
});
});
function lookupTransactionsIdsMempool(addresses, mempool, start, end, f) {
const method = 'getAddressTxids';
const rangeParam = mempool ? {
start,
end,
queryMempoolOnly: true,
} : {
start,
end,
queryMempol: false,
};
const params = [
addresses,
rangeParam,
];
return socket.send({ method, params }, f);
}
</script>
</html>