Im trying to get started experimenting with websockets.
Right now this websocket looks just like the echo test. A box, "log" with an input box and the buttons start/quit.
and when is opens it displays
WebSocket - status 0
then
Welcome - status 1
Rather then display a "log" I am trying to learn how to implement this into a site. If I wanted to it just do something. Like display an Icon/img/gif when it is ready what that code look like?
Right now I have this is the head
var socket;
function init(){
var host = "ws://api.blockchain.info:8335/inv";
try{
socket = new WebSocket(host);
log('WebSocket - status '+socket.readyState);
socket.onopen = function(msg){ log("Welcome - status "+this.readyState); };
socket.onmessage = function(msg){ log("Received: "+msg.data); };
socket.onclose = function(msg){ log("Disconnected - status "+this.readyState); };
}
catch(ex){ log(ex); }
$("msg").focus();
}
function send(){
var txt,msg;
txt = $("msg");
msg = txt.value;
if(!msg){ alert("Message can not be empty"); return; }
txt.value="";
txt.focus();
try{ socket.send(msg); log('Sent: '+msg); } catch(ex){ log(ex); }
}
function quit(){
log("Goodbye!");
socket.close();
socket=null;
}
// Utilities
function $(id){ return document.getElementById(id); }
function log(msg){ $("log").innerHTML+="<br>"+msg; }
function onkey(event){ if(event.keyCode==13){ send(); } }
</script>
and this in the body
<input id="msg" type="textbox" onKeyPress="onkey(event)"/>
<button onClick="send()">Start</button>
<button onClick="quit()">Quit</button>
My thoughts right now is I need to change the first line
log('WebSocket - status '+socket.readyState);
To get rid of this log. so that the websocket can function but not be displaying all this crap.
I then need to change the function in
socket.onopen = function(msg){ log("Welcome - status "+this.readyState); };
to remove the log and do a function(event) and something like a
document.getElementByID
that opens my img/giff
And my next step is setting up a function for when I receive data from the web socket.
socket.onmessage = function(msg){ log("Received: "+msg.data); };
Right now it outputs a lot of data in "log form"
All I want to do is get one piece of this data and display a number in a green box.
Sent: {"op":"addr_sub", "addr":"1GSZj2ydskgAsd2sVpgimWY73TpCCLAwFR"}
Sent: {"op":"addr_sub", "addr":"1NTGckTrNbwdbj1CVgnEGjXqfR8wLwK87S"}
Received: {"op":"utx","x":{"hash":"36c325166decd7f7cdf8b269aecc9f8c161033223581f4aeb1c3665a7317a16d","vin_sz":1,"vout_sz":2,"lock_time":"Unavailable","size":257,"relayed_by":"127.0.0.1","tx_index":31068727,"time":1351625866,"inputs":[{"prev_out":{"value":27900000,"type":0,"addr":"1GHYfp7X81X8pXBpmQZwFJcXCsoCAESNag"}}],"out":[{"value":1000000,"type":0,"addr":"1NTGckTrNbwdbj1CVgnEGjXqfR8wLwK87S"},{"value":26850000,"type":0,"addr":"1GHYfp7X81X8pXBpmQZwFJcXCsoCAESNag"}]}}
I want to keep is the "value":1000000 and display it in new box/img. similar to what i'm trying to do in the original 0, 1 message showing the websocket on of off.
If I wanted to store the data of the hash and time into a database is that possible with a websocket as well?
Would would this code look like? im working in Dreamweaver and having a hard time finding dumbed down examples of websockets to get me started.